Visual Basic 程式設計 翁傳奇 P9521773@fcu.edu.tw 逢甲大學資訊工程研究所
第二章第一次親密接觸 1. Visual Basic 程式設計原理 2. Visual Basic 6.0 主畫面介紹 3. 第一個視窗應用程式 - 表單 4. 基礎元件的使用
Visual Basic 程式設計原理 Visual Basic 6.0 本身是以 Basic (Beginner s All Purpose Symbolic Instruction Code, 初學者的全功能語言 ) 為基礎的軟體開發系統, 其整個專案架構就是物件導向 (Object Oriented) 的架構 什麼是物件 (Object) 物件, 照字面上的意義來說, 就是一個一個的東西 沒錯, 我們舉幾個生活上的例子來說明 : 腳踏車是一個物件, 汽車也是物件, 鍋子也是物件, 房子也是物件 如以上所說, 其實一般我們可以看的到, 摸的到都可以稱作是物件 在 VB 裡面的物件則是一個一個的 VCL 元件, 或是我們自己建立的物件也是, 例如按鈕是個物件, 選單也是個物件等等 簡單的說明一下物件的大概意義差不多就是這樣子了 3
Visual Basic 程式設計原理 什麼是屬性 (Property) 屬性, 它就是物件的特性 特徵 例如 : 汽車有顏色這個特徵, 但是不同的汽車可能會有不同的顏色, 所以顏色就是汽車的一個屬性, 其餘的如汽車的馬力 汽車的車門數目 汽車的極速 汽車的排器量 等等, 只要是用來描述這台汽車的東西都可以稱作是這台汽車的屬性 反觀, 在 VB 中對於一個物件的屬性是哪些呢? 以按鈕來說好了, 按鈕的顏色 位置 大小 等等, 都是按鈕的屬性 說到這邊, 不知道大家對於屬性有沒有更進一步的認識呢? 4
Visual Basic 程式設計原理 什麼是事件 (Event) 事件, 簡單來說就是會發生的事情 例如對於一台汽車來說, " 正在駕駛 " 就是一種事件, 轉彎 煞車等等都是 那對於 VB 上的按鈕來說, 按下按鈕就是一個事件 如果是對於整個視窗來說, 開啟視窗也是一個事件 視窗移動 視窗關閉等等也都是事件 什麼是方法 (Method) 如果你要將汽車從紅色變成藍色, 所使用的 " 方法 " 就是我們這邊所要說的方法 很簡單的, 把這種觀念轉換到 VB 上的物件, 假設我現在想要讓按鈕變成 Focused, 那我只需要執行 SetFocus 這個方法 如果我要將一個字串 (AnsiString) 變成整數, 我只需要使用 ToInt 這個方法 所以, 我們只要想成, 要作一件事情一定需要一個方法, 那就可以很清楚的將 " 方法 " 的定義弄清楚了 5
第二章第一次親密接觸 1. Visual Basic 程式設計原理 2. Visual Basic 6.0 主畫面介紹 3. 第一個視窗應用程式 - 表單 4. 基礎元件的使用
7
VB 的主畫面說明 VB 提供的是一個整合開發環境 (IDE, Integrated Development Environment) 的畫面, 它整合了 VB 的所有功能, 等於是運用 VB 的控制中心 主畫面包括主視窗 工具箱 表單設計師 專案總管 屬性視窗與表單配置視窗等六個區域 8
主視窗 (Main Window) 主視窗包含三個部分 : 標題列 功能表列與工具列 9
工具列 以圖示按鈕代表一些常用的指令, 以方便你操作運用, 要執行其中的某項指令時, 只要在其按鈕上按一下就可以 工具列右端的兩組數字, 分別代表 目前物件左上角座標 與 目前物件的寬度與高度 如上圖中的 0,0, 表示執行 VB 程式時, 表單 Form1 的左上角顯現在螢幕上的座標位置 4800,3600 表示該表單的寬度為 4800, 高度為 3600 ( 單位為 Twips) 10
度量單位 -Twip Twip 是 Microsoft 公司所制定的度量單位,1 吋 =1440Twips,VB 即使用 Twip 作為度量單位通常在電腦的應用中, 大多以 圖素 ( pixel,picture Element 的縮寫 ) 為度量單位, 或簡稱為 點 Twip 與 pixel 的關係如下 : 1 Twip=1/20 pixel 1 pixel=20 Twip 因為 1 吋 =72 個點 (pixel), 因此 : 1 吋 =1440 Twip 1 Twip=1/1440 吋 11
專案總管 (Project Explorer) 專案名稱 顯示程式碼 顯示表單 ( 不 ) 分類顯示 顯示模組 12
專案總管 (Project Explorer) 設計 VB 的應用程式時, 通常會產生多個不同類型的檔案, 如表單檔 (.frm) 工作區檔 (.vbw) 與模組檔 (.bas) 等, 這些檔案就組成一個專案 (Project), 而且擁有一個專案名稱 剛啟動 VB 時, 系統預設有一個專案, 其名稱為 Project1 事後可執行 檔案 / 新增專案 指令, 就會新增一個名稱為 Project2 的專案 如果再新增專案, 則依序為 Project3 Project4 等 13
專案總管 (Project Explorer) 每個專案都預設有一個名稱為 Form1 的表單, 專案就是用來管理表單及程式相關的檔案 專案總管會顯示現有專案的組成架構, 以便於了解全貌 擁有兩個以上的專案時, 又會自動建立一個 專案群組 (Project Group), 預設的名稱是 Group1 專案總管 視窗中有三個按鈕 檢視程式碼 : 顯示所選取元件 ( 如表單 ) 的程式碼視窗 檢視物件 : 顯示所選取表單的 表單設計師 視窗 切換資料夾 : 顯示或隱藏專案下的元件 ( 如表單 ) 資料夾 14
屬性視窗 (Properties Window) 元件型別 元件名稱 選擇的屬性的說明 依字母順序排列 依類別排列 15
表單設計 工具箱 表單視窗 表單配置視窗 16
表單設計 工具箱中提供可以直接點選的 控制項, 以便安置在表單上, 進行表單的設計 指標標籤框架 核取方塊下拉式清單方塊水平捲軸 計時器目錄清單方塊 形狀影像 OLE 收納器 圖片方塊文字方塊命令鈕選項按鈕 清單方塊垂直捲軸磁碟清單方塊 檔案清單方塊直線 資料 17
表單設計師與表單視窗 表單設計師 是一個設計表單的視窗 設計表單的方法如下 在表單中選取適用的控制項 在表單視窗的適當位置利用拖曳滑鼠的方式安置選取的控制項 利用屬性視窗來設定各物件的屬性 18
程式編輯器 19
程式編輯器 (cont d) 即時語法檢查 20
程式編輯器 (cont d) 21
程式編輯器 (cont d) 自動列出屬性 / 方法 22
第二章第一次親密接觸 1. Visual Basic 程式設計原理 2. Visual Basic 6.0 主畫面介紹 3. 第一個視窗應用程式 - 表單 4. 基礎元件的使用
第一個視窗應用程式 每當我們看到一個一個華麗的視窗應用程式時, 是不是都有個夢想, 我們也想自己寫一個這麼漂亮的東西出來 現在, 我們將實現這個夢想 如何建立 / 執行 Windows 應用程式 我們將一步一步的帶領大家建立第一個視窗應用程式 現在我們執行 VB 這套開發環境, 執行後會出現如圖的畫面出現 24
第一個視窗應用程式 (cont.) 其實, 這就是一個基本的視窗程式了, 現在, 我們接著按下 Start 這個按鈕或是 F5, 就會出現一個最簡單的視窗了 接著我們選擇 Remove Project, 將所有的設計表格關閉, 並且選擇不儲存 25
第一個視窗應用程式 (cont.) 當我們關閉所有開發程式之後, 如果我們還想繼續開發一套新的應用程式, 我們可以直接點選按鈕, 或是選擇表單中的 New Project, 之後就會出現建立新應用程式的選單 26
第一個視窗應用程式 (cont.) 選擇專案種類 選擇 Standard EXE 27
第一個視窗應用程式 (cont.) 儲存專案內容 當我們開發程式當中, 我們一定會常常儲存現在的成果, 以避免當機或是程式無回應等造成的損失, 這一小節我們將仔細的讓各位了解 VB 中儲存專案的方法為何 我們儲存專案大致上分成四種 : 種類 Save Project Group Save Project Group As Save Form Save Form As 說明 儲存目前正在編輯中的專案 將目前正在編輯中的專案儲存成另外一個檔案名稱 儲存目前正在編輯中的 Form 或是程式碼 將目前正在編輯中的 Form 或是程式碼改成另一個檔名儲存 28
第一個視窗應用程式 (cont.) File New Project( 檔案 建立新專案 ) 若有已開啟的專案, 會詢問是否要儲存? 29
第一個視窗應用程式 更改表單基本內容 在視窗的設計中, 視窗本身就具有很多屬性可以供我們更改, 我們在這一小節將介紹幾個常見的屬性, 至於在 VB 中的大部分屬性以及說明可以在 VB 內建的 MSDN 中找到 在更改表單內容這部分我們將舉幾個例子出來, 讓大家直接從例子中學習 我們所舉的例子可能才兩三個, 不過讀者可以自行變更各種不同的值試試看, 相信一定會有更多不同的發現 30
第一個視窗應用程式 (cont.) Caption: 更改 Caption 屬性可以將視窗左上角的文字變換成我們想要的文字 例如我們在這個例子中將原本 Form1 的值改變成 Hello, world!, 那就會在 Form 的左上角直接呈現出結果 Name: 更改 Name 這個屬性就是變更這整個物件的名稱 例如原本 Form 的 Name 是 Form1, 也就是在程式的運作當中, 這個 Form 的變數名稱就叫做 Form1 如果現在我們將 Name 這個屬性的值改成 MainForm, 之後整個 Form 的名稱就得改用 MainForm 來代替 31
從屬性視窗把 Caption 的值改為 Hello, world! 32
第一個視窗應用程式 (cont.) ICON: Icon 最主要是控制視窗程式的圖示畫面, 如果我們更改了 Icon 的資料,Form 就會馬上在左上角顯示出最新的 Icon 圖案 我們首先先點選物件檢視器上的 Icon 這個屬性旁邊的那個小按鈕, 之後便會跳出一個視窗讓我們選擇我們想要的 Icon, 決定好 Icon 後就可以直接按下 OK 完成 Icon 的選擇 Picture: 除了可以利用 BackColor 屬性更改 Form 的背景顏色之外, 也可以用圖片來取代單調的背景 其操作的方法如 Icon 所示 33
第一個視窗應用程式 (cont.) StartUpPosition: 除了可以利用表單配置視窗來調整視窗在執行時出現的位置之外, 也可以使用 StartUpPosition 屬性來調整 0 Manual: 不指定初始值 1 CenterOwner: 將項目置於所屬 UserForm 的中間 2 CenterScreen: 置於全螢幕的正中央 3 Windows Default: 置於螢幕左上角, 或視其表單配置視窗的調整狀態 34
第一個視窗應用程式 (cont.) BorderStyle: 0-None 1-Fixed Single 2-Sizeable 大小需調整 3-Fixed Dialog 不會在程序列出現 35
屬性說明預設值 Appearance( 外觀 ) 0: 以平面顯示,1: 以立體顯示 1- 立體 AutoRedraw( 重繪 ) True: 自動重繪,False: 不自動重繪 (6-9 節 ) False BackColor( 背景色 ) 表單背景色 &H8000000F& BorderStyle( 邊界 ) 邊界格式,0: 沒有框線,1: 單線固定,2: 大小可調整,3: 雙線固定對話方塊,4: 單線固定工具視窗,5: 可調整工具視窗 Caption( 標題 ) 標題的文字 Form1 2- 大小可調整 Font( 字型 ) 可設定字型 樣式 大小與效果新細明體 FontTransparent ( 重疊 ) True: 顯示資料時與原有內容重疊 False: 顯示資料時蓋掉原有內容 True ForeColor( 前景色 ) 前景色, 即輸出資料的顏色 &H80000012& Height( 高度 ) 表單的高度 ( 單位 :Twip) 3600 Left( 左邊界 ) 表單左邊界距離螢幕左邊的距離 0 Name( 名稱 ) 表單的物件名稱 Form1 Top( 上邊界 ) 表單上邊界距離螢幕上邊的距離 0 Visible( 可視性 ) True: 表單顯現,False: 表單不顯現 True Width( 寬度 ) 表單的寬度 ( 單位 :Twip) 4800 36
三種設定屬性的方式 要在屬性視窗設定屬性值, 常見的有下列三種方式 : 一 直接輸入屬性值 : 如將 Caption 的預設值 Form1 改為 歡迎 (Height Left Name Top 與 Width 也一樣 ) 37
二 直接選取方式 : 如在 AutoRedraw 選用 True (Appearance BorderStyle FontTransparent 與 Visible 也一樣 ) 按此鈕 選此項 設定完成了 38
三 對話方塊方式 : 如在 Font 設定字型 樣式 大小與效果 (BackColor 與 ForeColor 也類似 ) 點選此鈕 39
第一個視窗應用程式 (cont.) 透過屬性視窗修改 於程式中修改 Caption= 字串 注意型別數字 v.s. 字串 Private Sub Form_Load() Caption = Form Load" End Sub Private Sub Form_Click() Caption = "Clicked" End Sub Private Sub Form_DblClick() Caption = "Double Clicked" End Sub 40
第一個視窗應用程式 (cont.) 請使用修改 Form1.Caption 的方式, 觀察以下 Form 方法的變化 : Initialize KeyDown KeyPress KeyUp MouseDown MouseMove MouseUp Resize 觸發 : 方法 / 事件 41
Hello, world! 在表單上用滑鼠按一下 注意雙擊時的變化 雙擊表單 42
加入程式碼 43
表單 (Form) 的方法 方法的表示法 : 物件 _ 方法名 ( 參數 ) Form_Click() Private Sub Form_Click() End Sub 方法的使用 :[ 物件.] 方法名 ( 參數 ) Form1.Cls <-->Cls Form1.Print <-->Print 事件處理函式 Click DblClick 44
第二章第一次親密接觸 1. Visual Basic 程式設計原理 2. Visual Basic 6.0 主畫面介紹 3. 第一個視窗應用程式 - 表單 4. 基礎元件的使用
基礎元件使用 - Command Button 屬性 Caption: 標題 Enabled: 可用 MousePointer Style 1-Graphical Picture Visible: 可視性 ToolTip Text: 說明文字事件處理函式 Click 46
基礎元件使用 - Command Button 請撰寫一個程式, 內含兩個 Command Button, 分別為 Command1 以及 Command2 當按下 Command1 時顯示 Command2, 隱藏 Command1; 當按下 Command2 時, 顯示 Command2, 隱藏 Command1 Command1.Caption = Show Command2 Command2.Caption = Show Command1 47
基礎元件使用 - Label 與 Text Label 的屬性 Alignment: 對齊 Caption: 標題 AutoSize: 自動調整大小 WordWrap: 標題內容超出寬度時, 是否自動換行 Text 的屬性 Alignment : 對齊 Enabled & Locked MaxLength MultipleLine & ScrollBars Text PasswordChar : MultipleLine 必須為 False 48
基礎元件使用 - 練習題 相關元件屬性 Label1.Caption= 姓名 : Label2.Caption= 密碼 : Text1.Text= Text2 Text= Password Text3 Text= 等候輸入姓名與密碼中 Locked=True MultipleLine & ScrollBars Command1.Caption= 確定 Command2.Caption= 清空 Command3 Caption= 離開 Enabled=False 所有的元件的 Font 皆設定為新細明體, 字體大小 16, 並且對每個元件加入說明 (ToolTip Text) 49
基礎元件使用 - 練習題 (cont.) 元件相關方法 當按下確定時, 則在 Text3 中顯示 xxx 您好, 您的密碼為 ooo 並且讓離開的按鈕能夠 Enable 當按下清空時, 則將 Text1~Text3 的內容清空 當按下離開時, 則將視窗關閉 50
設定字型 選用各種字型 樣式與效果的情況如下表 : 字型範例字型樣式範例效果範例 新細明體新細明體標準標準字刪除線刪除線 標楷體標楷體斜體斜體字底線底線 新宋體 新宋體 粗體 粗體字 刪除線 + 底線 ( 有安裝的字型均可用 ) 粗斜體粗斜體字 刪除線 + 底線 ( 刪除線 與 底線 可複選 ) 51
2. 有關 樣式 與 效果, 也可在程式碼中設定如下表 : 字型樣式 設定方式 標準 FontBold=False FontItalic=False 斜體 FontBold=False FontItalic=True 粗體 FontBold=True FontItalic=False 粗斜體 FontBold=True FontItalic=True 效果 設定方式 標準 FontStrikethru=False FontUnderline=False 刪除線 FontStrikethru=True FontUnderline=False 底線 FontStrikethru=False FontUnderline=True 刪除線 + 底線 FontStrikethru=True FontUnderline=True 註 FontBold 是 粗體, FontItalic 是 斜體, FontStrikethru 是 刪除線,FontUnderline 是 底線, 預設值均為 False( 標準字 ) 52
課堂練習 請設計兩數四則運算的表單 提示 : 將字串數值化, 可以使用 Val() Ex: Val(Text1.Text) 53