第2章 可視化開(kāi)發(fā)

VisualStudio開(kāi)發(fā)工具的使用可視化編程技術(shù)福建工程學(xué)院軟件學(xué)院主講：張正柱郵箱：zh.zz@VisualStudio.NET集成開(kāi)發(fā)環(huán)境簡(jiǎn)介第一個(gè)VS應(yīng)用程序可視化開(kāi)發(fā)的初步認(rèn)識(shí)本部分學(xué)習(xí)要點(diǎn)1.

VisualStudio.NET

開(kāi)發(fā)人員可以使用Windows自帶的“記事本”來(lái)進(jìn)行程序的開(kāi)發(fā)。但是，如果所有的代碼都要手動(dòng)添加和輸入，然后手動(dòng)編譯程序，使用命令調(diào)試程序等，那么工作效率是很低的。

為了解決上述問(wèn)題，集成開(kāi)發(fā)環(huán)境(IDE)應(yīng)運(yùn)而生。集成開(kāi)發(fā)環(huán)境集成了方便程序開(kāi)發(fā)的各種工具和功能，如防止程序員犯低級(jí)錯(cuò)誤或者筆誤的自動(dòng)語(yǔ)法檢查、方便的圖形化調(diào)試功能等，大大減少了編碼的語(yǔ)法錯(cuò)誤并降低了代價(jià)，使得程序的運(yùn)行更簡(jiǎn)單。微軟在推出C#這種開(kāi)發(fā)語(yǔ)言的同時(shí)，也推出了對(duì)應(yīng)的集成開(kāi)發(fā)環(huán)境VisualStudio系列產(chǎn)品。

VisualStudio.NET是一套完整的開(kāi)發(fā)工具，用于生成ASP.NETWeb應(yīng)用程序、XMLWebServices、桌面應(yīng)用程序和移動(dòng)應(yīng)用程序。VisualBasic.NET、VisualC++.NET、VisualC#.NET和VisualJ#.NET使用統(tǒng)一的集成開(kāi)發(fā)環(huán)境，該環(huán)境允許它們共享工并創(chuàng)建混合語(yǔ)言解決方案；這些語(yǔ)言都利用.NET框架（.NETFramework）的功能，它提供了對(duì)簡(jiǎn)化桌面應(yīng)用程序、ASP.NETWeb應(yīng)用程序和XMLWebServices開(kāi)發(fā)關(guān)鍵技術(shù)的訪問(wèn)。1.VisualStudio.NETVisualStudio.NETWindows窗體開(kāi)發(fā)工具Web窗體開(kāi)發(fā)工具錯(cuò)誤處理數(shù)據(jù)訪問(wèn)多語(yǔ)言支持Web服務(wù)開(kāi)發(fā)工具開(kāi)發(fā)調(diào)試部署設(shè)計(jì)1.VisualStudio.NET1.安裝VisualStudio.NET在安裝前需要準(zhǔn)備：硬件1VisualStudio.NET安裝程序3運(yùn)行環(huán)境（操作系統(tǒng)）21.VisualStudio.NET1.安裝VisualStudio.NET1.VisualStudio.NET2.瀏覽VisualStudio.NET起始頁(yè)1.VisualStudio.NET2.瀏覽VisualStudio.NET工具箱選項(xiàng)卡式文檔菜單欄解決方案資源管理器屬性窗口6.VisualStudio.NET使用起始頁(yè)“選項(xiàng)”對(duì)話框解決方案資源管理器類視圖“屬性”窗口工具箱智能感知使用幫助

2.集成開(kāi)發(fā)環(huán)境簡(jiǎn)介打開(kāi)起始頁(yè)：2.集成開(kāi)發(fā)環(huán)境簡(jiǎn)介2.1使用起始頁(yè)起始頁(yè)4部分功能說(shuō)明：項(xiàng)說(shuō)明最近的項(xiàng)目顯示最近更新的項(xiàng)目的列表，使你可以創(chuàng)建新項(xiàng)目和打開(kāi)現(xiàn)有的項(xiàng)目入門/開(kāi)始顯示一個(gè)列表，其中包括幫助主題、網(wǎng)站、技術(shù)文章以及旨在提高工作效率和強(qiáng)調(diào)產(chǎn)品功能的其他資源。該主題列表根據(jù)應(yīng)用的設(shè)置的不同而變化。有關(guān)更多信息，請(qǐng)參見(jiàn)使用設(shè)置VisualStudio標(biāo)題新聞顯示微軟公司的產(chǎn)品和事件信息的鏈接MSDN中文網(wǎng)站默認(rèn)情況下，顯示應(yīng)用的設(shè)置指定的RSS源中的文章列表?？梢酝ㄟ^(guò)“選項(xiàng)”對(duì)話框→“環(huán)境”→“啟動(dòng)”選項(xiàng)指定自定義的RSS源2.集成開(kāi)發(fā)環(huán)境簡(jiǎn)介2.1使用起始頁(yè)2.2解決方案資源管理器2.集成開(kāi)發(fā)環(huán)境簡(jiǎn)介樹(shù)視圖

使用粗體字顯示的項(xiàng)目使用粗體字顯示的解決方案

命令

選擇

多重選擇工具欄

2.2解決方案資源管理器2.集成開(kāi)發(fā)環(huán)境簡(jiǎn)介2.3類視圖2.集成開(kāi)發(fā)環(huán)境簡(jiǎn)介通過(guò)“類視圖”添加新項(xiàng)2.3類視圖2.集成開(kāi)發(fā)環(huán)境簡(jiǎn)介在“類視圖”中管理項(xiàng)目可以從“類視圖”中獲得通?？捎糜凇敖鉀Q方案資源管理器”中符號(hào)的所有命令通過(guò)類視圖可以時(shí)方便快捷地查找某個(gè)類，某個(gè)功能模塊的位置2.3類視圖2.集成開(kāi)發(fā)環(huán)境簡(jiǎn)介2.4“屬性”窗口2.集成開(kāi)發(fā)環(huán)境簡(jiǎn)介對(duì)象名工具欄

“屬性集”窗格“說(shuō)明”窗格“屬性”窗口從上至下總共分為4個(gè)部分：

2.4“屬性”窗口2.集成開(kāi)發(fā)環(huán)境簡(jiǎn)介2.集成開(kāi)發(fā)環(huán)境簡(jiǎn)介2.5工具箱“工具箱”是一個(gè)浮動(dòng)的樹(shù)控件，它與Windows資源管理器的工作方式非常相似，但沒(méi)有網(wǎng)格或連接線。

“工具箱”顯示可以添加到項(xiàng)目中的項(xiàng)的圖標(biāo)。每次返回編輯器或設(shè)計(jì)器時(shí)，“工具箱”都會(huì)自動(dòng)滾動(dòng)到最近選擇過(guò)的選項(xiàng)卡和項(xiàng)

2.集成開(kāi)發(fā)環(huán)境簡(jiǎn)介2.5工具箱在代碼編寫過(guò)程中，VisualStudio.NET提供了智能感知（IntelliSense）功能，它是由集成開(kāi)發(fā)環(huán)境提供的一種即時(shí)自動(dòng)提示功能2.集成開(kāi)發(fā)環(huán)境簡(jiǎn)介2.6智能感知VisualStudio的本地幫助文件和聯(lián)機(jī)幫助文件設(shè)置幫助系統(tǒng)選項(xiàng)

維護(hù)幫助收藏夾

2.集成開(kāi)發(fā)環(huán)境簡(jiǎn)介2.7使用幫助在安裝VisualStudio時(shí)隨之安裝的本地幫助文件（這個(gè)幫助就是我們?cè)诎惭b時(shí)所選擇的MSDN）。VisualStudio幫助信息有兩個(gè)基本來(lái)源聯(lián)機(jī)幫助。聯(lián)機(jī)幫助是基于Internet的，如MSDNOnline、MSDN新聞組及.NETCodeWiseCommunity開(kāi)發(fā)人員Web站點(diǎn)集等。2.集成開(kāi)發(fā)環(huán)境簡(jiǎn)介2.7使用幫助設(shè)置幫助系統(tǒng)選項(xiàng)：2.集成開(kāi)發(fā)環(huán)境簡(jiǎn)介2.7使用幫助維護(hù)幫助收藏夾：添加到幫助收藏夾搜索功能重命名收藏夾保存內(nèi)容的名稱

刪除“幫助收藏夾”的內(nèi)容

2.集成開(kāi)發(fā)環(huán)境簡(jiǎn)介2.7使用幫助3.第一個(gè)VS應(yīng)用程序創(chuàng)建C#控制臺(tái)應(yīng)用程序,打開(kāi)VS.NET,點(diǎn)擊新建項(xiàng)目在新建項(xiàng)目模板中選擇控制臺(tái)應(yīng)用程序指定項(xiàng)目的名稱HelloWorld以及存放路徑4)編輯Program.cs文件,紅色部分為自己添加的代碼3.第一個(gè)VS應(yīng)用程序5)查看應(yīng)用程序文件夾結(jié)構(gòu)可以通過(guò)解決方案資源管理器管理項(xiàng)目文件HelloWorld.csprojAssemblyInfo.csProgram.cs“HelloWorld”應(yīng)用程序文件3.第一個(gè)VS應(yīng)用程序項(xiàng)目文件

.sln（solution）

解決方案

.csproj（project）

項(xiàng)目文件（啟動(dòng)項(xiàng)目：加粗）

.cs 代碼文件

.designer.cs 設(shè)計(jì)器代碼文件

.resx(resource) 資源文件3.第一個(gè)VS應(yīng)用程序5)查看應(yīng)用程序文件夾結(jié)構(gòu)VisualStudio.NET創(chuàng)建一個(gè)與項(xiàng)目同名的文件夾，此處為“HelloWorld”該文件夾包含項(xiàng)目文件“HelloWorld.csproj”和其他關(guān)聯(lián)文件每個(gè)新項(xiàng)目都創(chuàng)建了bin、obj和Properties

三個(gè)文件夾。bin和obj這兩個(gè)文件夾下都有一個(gè)Debug子目錄，其中包含可執(zhí)行文件HelloWorld.exe在“解決方案資源管理器”中啟用“顯示所有文件”選項(xiàng)，可查看“HelloWorld”項(xiàng)目的結(jié)構(gòu)3.第一個(gè)VS應(yīng)用程序6)生成解決方案從菜單中選擇“生成”“生成解決方案”該過(guò)程將編譯項(xiàng)目中包括的所有文件查看編譯生成結(jié)果,編譯結(jié)果顯示在“輸出”窗口中如果結(jié)果顯示“生成:1成功或最新，0失敗，0被跳過(guò)”，則說(shuō)明已經(jīng)成功生成，然后即可交付該應(yīng)用程序3.第一個(gè)VS應(yīng)用程序2)運(yùn)行程序從菜單中選擇“調(diào)試”“開(kāi)始執(zhí)行(不調(diào)試)”輸出結(jié)果顯示在VS.NET控制臺(tái)窗口中3.第一個(gè)VS應(yīng)用程序4.可視化開(kāi)發(fā)的初步認(rèn)識(shí)

編程步驟創(chuàng)建用戶界面設(shè)置屬性運(yùn)行Windows應(yīng)用程序窗體和控件代碼視圖程序分析如何用VisualStudio.NET來(lái)進(jìn)行一些簡(jiǎn)單的開(kāi)發(fā)，比如下面的界面：4.可視化開(kāi)發(fā)的初步認(rèn)識(shí)

創(chuàng)建“歡迎”應(yīng)用程序的3個(gè)基本步驟：4.1編程步驟步驟一：創(chuàng)建用戶界面。步驟二：設(shè)置屬性。

步驟三：編譯、運(yùn)行。4.可視化開(kāi)發(fā)的初步認(rèn)識(shí)

創(chuàng)建新項(xiàng)目創(chuàng)建界面4.2創(chuàng)建用戶界面4.可視化開(kāi)發(fā)的初步認(rèn)識(shí)

創(chuàng)建新項(xiàng)目：步驟操作啟動(dòng)VisualStudio.NET。

在VisualStudio

“文件”菜單下，單擊“新建”→“項(xiàng)目”命令。在“項(xiàng)目類型”選項(xiàng)組中，選擇“VisualC#”。在“名稱”文本框中，鍵入“Welcome”，單擊“確定”按鈕。13424.2創(chuàng)建用戶界面4.可視化開(kāi)發(fā)的初步認(rèn)識(shí)

4.2創(chuàng)建用戶界面創(chuàng)建新項(xiàng)目：

4.可視化開(kāi)發(fā)的初步認(rèn)識(shí)

步驟操作改變窗體文件名。單擊標(biāo)準(zhǔn)工具欄的“工具箱”按鈕，顯示“工具箱”對(duì)話框。從“工具箱”中將Label控件拖放到窗體上，創(chuàng)建一個(gè)控件Label1。從“工具箱”中將PictureBox控件拖放到窗體上，創(chuàng)建一個(gè)控件PictureBox1。13424.2創(chuàng)建用戶界面創(chuàng)建界面：4.可視化開(kāi)發(fā)的初步認(rèn)識(shí)

4.2創(chuàng)建用戶界面創(chuàng)建界面：界面繪制完畢，結(jié)果如下圖所示4.可視化開(kāi)發(fā)的初步認(rèn)識(shí)

設(shè)置主窗體屬性設(shè)置Label1屬性

設(shè)置PictureBox1屬性

設(shè)置布局

4.3設(shè)置屬性4.可視化開(kāi)發(fā)的初步認(rèn)識(shí)

設(shè)置主窗體屬性的3個(gè)步驟：

步驟一：右鍵單擊窗體，選擇“屬性”。步驟二：在“屬性”窗口中，將Text屬性的值改為“歡迎”。步驟三：將Size屬性的值改為“400,200”。4.3設(shè)置屬性4.可視化開(kāi)發(fā)的初步認(rèn)識(shí)

步驟操作右鍵單擊Label1控件，選擇“屬性”

。在“屬性”窗口中，將Location屬性的值改為“13,13”。將Text屬性為的值改為“歡迎進(jìn)入VisualC#.NET世界!”。

將Font屬性的值改為“ArialBlack,15.25pt,style=Bold”。13424.3設(shè)置屬性設(shè)置Label1屬性:4.可視化開(kāi)發(fā)的初步認(rèn)識(shí)

右鍵單擊PictureBox1控件，從快捷菜單中選擇“屬性”命令。在“屬性”窗口中，將Location屬性的值改為“30,65”。在“屬性”窗口中，修改Image屬性。選中“本地資源”，單擊“導(dǎo)入”按鈕。單擊“確定”按鈕。

將SizeMode屬性的值改為“AutoSize”。4.3設(shè)置屬性設(shè)置PictureBox1屬性:4.可視化開(kāi)發(fā)的初步認(rèn)識(shí)

設(shè)置布局的3個(gè)步驟：

步驟一：在標(biāo)準(zhǔn)工具欄上單擊右鍵，從快捷菜單中選擇“布局”命令。步驟二：選中Label1，然后單擊布局工具欄中的“水平居中”按鈕。步驟三：選中PictureBox1，然后單擊布局工具欄中的“水平居中”按鈕。

4.3設(shè)置屬性4.可視化開(kāi)發(fā)的初步認(rèn)識(shí)

運(yùn)行“Welcome”應(yīng)用程序：4.4運(yùn)行Windows應(yīng)用程序4.可視化開(kāi)發(fā)的初步認(rèn)識(shí)

每個(gè)窗體和控件都有各自的屬性，它們一起構(gòu)成了應(yīng)用程序的可視化部分——圖形用戶界面（GraphicUserInterface，GUI）。4.5窗體和控件4.可視化開(kāi)發(fā)的初步認(rèn)識(shí)

代碼編輯模式：4.6