4.視窗應用程式的基本輸出入 20131201

4 視窗應用程式的基本輸出入

• 4-1 物件基礎程式設計• 4-2 表單控制項• 4-3 按鈕控制項• 4-4 資料輸出的標籤控制項• 4-5 資料輸入的文字方塊控制項• 4-6 訊息方塊• 4-7 字型與色彩

4-1 物件基礎程式設計

• 4-1-1 物件的基本觀念• 4-1-2 物件名稱的命名

4-1 物件基礎程式設計

• C# 語言是一種物件導向程式語言– 提供資料抽象化和物件觀念

• Object

• Class

• Attribute

• Method

• Event

4-1-1 物件的基本觀念 - 物件

• 「物件」（ Objects ） :– 是物件導向程式的基礎– 是資料（ Data ）和包含處理此資料程式碼（

稱為方法 Method ）的綜合體。• 「類別」（ Class ） :

– 定義物件內容的模版，– 透過模版可以建立屬於同一個類別的多個物件

• 例如： Label 控制項是一個類別 (Class) ，當我們在表單上新增多個標籤控制項後，就是使用類別建立名為 label1 和 label2. 等多個物件 (Object) 。

4-1-1 物件的基本觀念 - 屬性

• 物件的屬性（ Properties ） :– 是物件的性質和狀態，– 例如：

• 文字方塊控制項提供 MaxLength 屬性設定輸入字串的長度

• 標籤物件的 BackColor 可以指定背景色彩

textBox1.MaxLength;

label1.BackColor;

4-1-1 物件的基本觀念 - 屬性

4-1-1 物件的基本觀念 - 方法• 方法（ Methods ） :

– 是物件的處理函數，也就是執行物件提供的功能。例如： Graphics 繪圖物件 g 提供方法可以繪出字串和畫線，如下所示：

g.DrawString();

g.DrawLine();

• 上述程式碼使用 Graphics 物件的方法。– 我們並不需要知道繪出字串和畫線的程式碼是

什麼？只需知道物件提供的方法需要如何用，指定參數後，就可以繪出指定的圖形。

http://msdn.microsoft.com/zh-tw/library/System.Drawing.Graphics(v=vs.110).aspxhttp://msdn.microsoft.com/zh-tw/library/System.Drawing.Graphics(v=vs.110).aspx

4-1-1 物件的基本觀念 - 事件 (1)• 事件（ Events ）

– 本身是一個物件 (Object) ，– 代表使用者按下滑鼠按鍵或鍵盤按鍵等操作後

，所觸發的動作進而造成控制項狀態的改變，當這些改變發生時，就會觸發對應的事件物件

– 我們可以針對事件來作進一步處理。• 事件驅動程式設計（ Event-driven

Programming ） :– 事件可以建立事件處理程序來處理事件，這種

以事件設計程式的方式，稱為「事件驅動程式設計」（ Event-driven Programming ）。

4-1-1 物件的基本觀念 - 事件 (2)

• 例如： 4WFBacsicIO1 中 Button 控制項button1 觸發的 Click 事件，其事件處理程序如下所示：

private void button1_Click(object sender, EventArgs e)

{ … }• 上述事件處理程序有 2 個參數，其說明如下所示 :

– object 物件：觸發事件的來源物件，也就是哪一個物件產生此事件。

– Eventargs 物件：事件物件本身，包含事件的相關資訊。

實作練習 -4WFBasicIO1_1

1. 當按下 button1 時 ,label1 的背景色 (BackColor)變為 Yellow, 且 label1 的文字 (Text)為” click!” ，如下圖所示 :

2. 進階練習 :

當按下 button1 時背景顏色會在 yellow 及原來背景色切換。

4WFBasicIO1_1

參考解答

• 1.

• 2.

4-1-2 物件名稱的命名 - 說明

• 當我們使用 Visual C# Express 將控制項物件新增至表單時，預設是以控制項名稱加上編號作為名稱（即 Name 屬性的值），例如： Form1 、 label1 和 button1 等。

• 預設的物件名稱缺乏可讀性，並不能作為程式註解的用途，建議將物件名稱重新命名成有意義的名稱。

4-1-2 物件名稱的命名 - 命名方式

• 匈牙利命名法– 以名稱的前 3 個字元作為控制項代碼，如此控

制項名稱將更加有意義，如下表所示：

表單與控制項類字首範例表單 frm frmTest、frmCalculate

按鈕 btn btnSave、btnOpen

標籤 lbl lblShowMessage

文字方塊 txt txtName、txtStudentName

4-2 表單控制項

• 4-2-1 表單的基礎• 4-2-2 建立表單控制項• 4-2-3 表單的常用屬性

4-2-1 表單的基礎 - 說明• 表單（ Form ） :

– 是一種控制項物件– 是 Windows 應用程式的基本架構– Windows 應用程式的視窗和對話方塊，就是一

種表單物件。• 視窗應用程式的基本輸出入是 GUI 元件的控

制項。– 讓我們看一個 Windows 視窗應用程式，例如：

Windows 作業系統的【小算盤】，如圖所示：

4-2-1 表單的基礎 - 架構• Windows 應用程式是由一個個視窗和對話方塊所

組成，對應到 C# 應用程式就是一個個表單物件。

• 我們可以將表單物件視為容器，在每一個表單物件中都擁有許多控制項，像是在一個大盒子中放入其他控制項的小盒子，如下圖所示：

4-2-2 建立表單控制項 -Visual C#專案

Visual C#專案： 4WFBacsicIO1

• Visual C# Express 新增【 Windows Form應用程式】專案，就可以建立表單控制項，其建立步驟如下所示：– 步驟一：開啟或建立 Windows Form 應用程式專案

– 步驟二：調整表單尺寸– 步驟三：設定表單屬性– 步驟四：編譯執行 Windows 應用程式

4-2-3 表單的常用屬性 -外觀屬性說明

BackColor 設定表單背景色彩，預設值是 Control

BackgroundImage 選取表單背景的圖片檔案，預設值是無BackgroundImageLayout 表單背景的配置方式，預設值是 Title，可以是 None、

Center、Stretch 和 Zoom

Cursor 設定滑鼠游標的外觀，預設值是 Default，可以選擇所需的游標樣式

Font 設定表單使用的字型，選此屬性可以顯示「字型」對話方塊，預設值是新細明體, 9pt。也可以展開 Font 屬性，指定字型的個別屬性，例如：Name、Size、Unit

和 Bold/Italic/Strikeout 等ForeColor 設定表單前景色彩，預設值是 ControlText

FormBorderStyle 設定表單的框線樣式，共有 7 種選擇，None（沒有框線）、FixedSingle（不可調整的單線）、Fixed3D（不可調整的立體線）、FixedDialog（不可調整的對話方

塊線）、Sizeable（可調整，此為預設值）、FixedToolWindow（不可調整的工具箱樣式）和SizeableToolWindow（可調整的工具箱樣式）

Text 設定表單標題文字，預設值是表單名稱

4-2-3 表單的常用屬性 - 配置屬性說明

Location 設定表單顯示在螢幕上的座標 X,Y，預設值是 0,0，如果是控制項就是相對於表單左上角的座標

MaximumSize 設定當調整表單尺寸時，可以顯示最大範圍的 Width,Height，預設值是 0,0

MinimumSize 設定當調整表單尺寸時，可以顯示最小範圍的 Width,Height，預設值是 0,0

Size 設定表單尺寸的 Width,Height，預設值是 300,300

StartPoistion 表單第一次出現的位置，可以是 Manual（手動）、CenterScreen

（螢幕中央）、WindowsDefaultLocation（預設位置，預設值）、WindowsDefaultBounds（預設邊界位置）和 CenterParent（父

表單的中央）WindowState 表單顯示方式是 Normal（正常，預設值）、Minimized（最小

化）或 Maximized（最大化）

4-2-3 表單的常用屬性 - 設計

• 設計屬性是在表單設計階段的相關屬性，如下表所示：

屬性說明Name 表單名稱，預設值是 Form1

Language 設定使用的語言，此為 Windows 作業系統在控制台的【地區及語言選項】的設定值

Locked 是否可以移動或調整控制項大小，預設值 False 為不鎖定，表示可以移動或調整，True 為不可以

4-2-3 表單的常用屬性 - 視窗樣式

屬性說明ControlBox 指定表單是否擁有控制功能，即上方標題列的按鈕和功能表，

預設值 True 是有，False 為沒有HelpButton 表單是否顯示說明按鈕，預設值 False 為不顯示，True 為顯示

Icon 設定表單縮小時顯示的圖示MaximizeBox 是否在標題列顯示最大化鈕，預設值 True 顯示，False 為不顯

示MinimizeBox 是否在標題列顯示最小化鈕，預設值 True 顯示，False 為不顯

示TopMost 表單是否在最上層，即位在其他表單之上，預設值 False 為不

是，True 為是

4-2-3 表單的常用的事件

1. Load

2. Activated

3. Click

4. DoubleClick

5. KeyPress


1. 預設背景色如圖 :

2. 當按滑鼠左鍵時，寬度縮減 10

3. 當按鍵盤時背景色改為 SteelBlue

4WFBasicIO1_2

4-3 按鈕控制項 - 說明• 「按鈕」（ Button）控制項

– 它是可實際執行功能的使用介面。– 例如：在輸入資料後，按下按鈕觸發 Click 事

件，就可以執行事件處理程序來顯示結果、更改屬性或取消等操作，如下圖所示：

Button

4-3 按鈕控制項 - 按鈕的快速鍵 • 在按鈕控制項新增快速鍵，就是在輸入標

題名稱的 Text屬性時，在英文字母前加上"&"符號，表示之後字元成為底線字的快速鍵。一些 "&" 符號的範例，如下表所示：標題名稱字串顯示結果快速鍵

(&Search) (Search) Alt+S

(E&xit) (Exit) Alt+X

(&Change) (Change) Alt+C

4-3 按鈕控制項 -按鈕控制項的 Click 事件

• 按鈕控制項預設觸發 Click事件，– 我們可以建立 Click 事件處理程序執行所需的操作。事

件處理程序預設的名稱格式，如下所示：ControlName_EventName– ControlName 是控制項名稱，底線後是事件名稱，其

意義是「此程序是用來處理控制項此程序是用來處理控制項 ControlNameControlName 產產生的生的 EventNameEventName 事件事件」。

– 例如： button1 控制項建立的 Click 事件處理程序名稱為 button1_Click() 。

4-3 按鈕控制項 -存取表單與控制項的屬性

• 除了在「屬性」視窗更改屬性值外，也可以使用程式碼存取控制項的屬性值，其基本語法如下：ControlName.PropertyName

• 例如：按鈕名稱為 button1 ， PropertyName 是屬性名稱，如果想更改按鈕控制項的標題名稱，其程式碼如下所示：button1.Text = " 執行事件處理“ ;

• Form1 是 button1 的上一層物件，也就是Form1.cs 表單自己，程式碼是使用 this關鍵字取得物件本身，如下所示：this.Text = " 測試 Click 事件“ ;

4-3 按鈕控制項 -按鈕控制項的常用屬性

屬性說明Name 控制項名稱Text 按鈕的標題文字

TextAlign 標題文字的對齊方式，共有井字形的 9 個位置可供選擇Image 指定按鈕圖片，如果同時使用 Text 和 Image 屬性，文字和圖片會

重疊，請調整 ImageAlign 和 TextAlign 屬性ImageAlign 圖片按鈕的顯示位置

FaltStyle 指定按鈕樣式，也就是游標移至按鈕上時的顯示樣式，可以是 Flat

（平面按鈕）、Popup（平面按鈕，滑鼠經過時成為立體）、Standard

（立體 3D 按鈕，預設值）和 System（使用作業系統的按鈕樣式）Enable 按鈕是否有作用，預設值 True 為有作用，False 為沒有作用，此

時按鈕標題文字會成為灰色。Visible 顯示或隱藏控制項，預設值 True 顯示，False 為隱藏

4-3 按鈕控制項 -Visual C# 專案

Visual C# 專案： WFBasicIO3

• 在 Windows 應用程式新增按鈕控制項來更改控制項的 Text 屬性值，如下圖所示：


• 改變表單顏色 SpringGreen

• 改變按鈕顏色 Tan

• 結束程式 Application.Exit();

進階練習 : 執行另一個表單

進階練習 - 執行另一個表單

4-4 資料輸出的標籤控制項 - 說明

• 「標籤」（ Label）控制項是一種資料輸出控制項– 可以在表單顯示其他控制項的標題文字、說明

文字或輸出執行結果，例如：我們可以按下按鈕控制項，然後在標籤顯示執行結果，如下圖所示：

label

4-4 資料輸出的標籤控制項 - 標籤控制項的常用屬性

• 標籤控制項的屬性有很多與表單物件和按鈕控制項相同。一些常用屬性，如下表所示：屬性說明

Name 控制項名稱Text 標籤控制項顯示的文字內容

TextAlign 文字對齊方式，共有井字形的 9 個位置可供選擇BorderStyle 框線樣式，可以是 None 沒有框線，FixedSingle 單線和 Fixed3D

立體框線AutoSize 是否依據顯示字型來自動調整尺寸，預設值 True 會自動調整，所

以不能更改控制項尺寸，如果改為 False 不自動調整，就可以使用定位點來調整控制項尺寸

4-4 資料輸出的標籤控制項 -Visual C# 專案

Visual C# 專案： WFBasicIO4• 在 Windows 應用程式新增標籤控制項，可以用來

輸出數學運算式的計算結果，這是將前一章節算術運算式的結果，改為輸出到標籤控制項，如下所示：f = X^2-2*X+3

• 執行結果


1. Form1 load 時 label1 底色 (BackColor)變 Snow, BorderStyle 變 Fixed3D

2. 按下 “換算” button 時，將美金兌台幣以匯率 31.5換算，並將換算結果顯示在label1

4WFBasicIO4_1

進階實作練習 -LinkLabel 4WFBasicIO4_1

4-5 資料輸入的文字方塊控制項

• 4-5-1 單行文字方塊 • 4-5-2 密碼和多行文字方塊控制項• 4-5-3 選取文字方塊的內容

4-5-1 單行文字方塊 -說明• 「文字方塊」（ TextBox）控制項可以讓使用者輸入資料–輸入的資料是字串，需配合型別轉換函數就可以取得所需型別的資料。

– TextBox有多種不同的顯示外觀，預設是建立單行文字方塊，如下圖所示：

4-5-1 單行文字方塊 -文字方塊控制項的常用屬性

屬性說明Name 控制項名稱Text 文字方塊控制項輸入的內容，這是一個字串

MaxLength 設定文字方塊可接受的字元數，預設為 32767

ReadOnly 文字方塊內容是否可以更改，預設為 False可以更改，True為不能更改，如為 True，其功能如同標籤控制項

PasswordChar 密碼欄位，輸入字元由其他符號取代，例如："*"星號MultiLine 是否是多行文字方塊，輸入資料可以超過一行，預設值 False為

單行顯示，True為多行顯示ScrollBar 如果是多行文字方塊，可以設定此屬性來顯示捲動軸，None預

設值是沒有、Horizontal顯示水平捲動軸、Vertical為垂直捲動軸和 Both同時顯示水平和垂直捲動軸

WordWrap 如果是多行文字方塊，設定此屬性決定是否自動換行，預設值True表示自動換行，False為不自動換行

TextAlign 文字方塊的對齊方式，可以是 Left（靠左）、Right（靠右）和 Center

（置中）

4-5-1 單行文字方塊 -Visual C#專案

Visual C#專案：WFBasicIO5

• 在Windows應用程式新增 2個文字方塊控制項，可以建立華氏和攝氏溫度的轉換程式，如下圖所示：

執行結果


• BMI值計算程式– BMI值公式 : BMI=體重 (公斤 )/(身高 *身高 )

(身高單位為m)

4-5-2 密碼和多行文字方塊控制項 -說明

• 除了單行文字方塊外，我們可以更改TextBox控制項屬性來建立密碼和多行文字方塊控制項，如下圖所示：

密碼

多行文字方塊

4-5-2 密碼和多行文字方塊控制項 -取得控制項的值

• 將 txtPassword和 txtMessage輸入的文字內容輸出到唯讀的 txtOutput文字方塊控制項來顯示，如下所示： txtOutput.Text = txtPassword.Text + "/" +

txtMessage.Text;

4-5-2 密碼和多行文字方塊控制項 -Visual C#專案

Visual C#專案： 4WFBasicIO6

• 在Windows應用程式擁有密碼和多行文字方塊控制項，程式是使用 ReadOnly屬性的唯讀文字方塊控制項來顯示輸出結果，如圖所示：


控制項屬性值textBox1 PasswordChar *

textBox1 MaxLength 10

textBox2 Multiline True

textBox2 Size 452,85

textBox2 ScrollBar Vertical

textBox3 ReadOnly True

執行結果

4-5-3 選取文字方塊的內容 -說明

• 多行文字方塊控制項如果是作為文字處理工具，我們可以選取文章的部分內容，並且將它複製出來。文字方塊控制項關於選取文字內容的屬性，如下表所示：

• 在文字方塊控制項的相關方法，如下表所示：

屬性說明SelectionStart 選取文字的開始位置，以 0開始

SelectionLength 選取文字的長度SelectedText 取得文字方塊選取的文字內容

方法說明Focus() 設定控制項取得焦點

4-5-3 選取文字方塊的內容 -Visual C#專案


• 在Windows應用程式建立多行文字方塊控制項，提供 2個按鈕，可以選取文字內容和顯示選取的內容，如下圖所示：

4-6 訊息方塊 -說明

• 訊息方塊是一種Windows作業系統的對話方塊

• Windows應用程式可以使用訊息方塊來顯示錯誤訊息，或輸出執行結果。

• MessageBox:在 C#程式建立訊息方塊就是新增MessageBox類別的物件。

• MessageBox訊息方塊可以顯示標題文字、訊息內容、按鈕或圖示。

4-6 訊息方塊 -語法• MessageBox.Show()方法

– 我們只能透過MessageBox.Show()方法來建立訊息方塊，其常用語法，如下所示：

MessageBox.Show(訊息文字 , [標題文字 , 顯示按鈕 , 顯示圖示 , 預設按鈕 ])

– 訊息文字：顯示在訊息方塊中的資訊字串，必要參數。– 標題文字：顯示在訊息方塊視窗上方標題列的字串。– 顯示按鈕：指定在訊息方塊中顯示哪些按鈕

• 其值是MessageBoxButtons列舉常數。– 顯示圖示：指定在訊息方塊中顯示的圖示

• 其值是MessageBoxIcon列舉常數。– 預設按鈕：指定在訊息方塊的預設按鈕

• 其值是MessageBoxDefaultButton列舉常數。

4-6 訊息方塊 -MessageBoxButtons列舉常數

MessageBoxButtons列舉常數說明MessageBoxButtons.AbortRetryIgn

ore顯示【中止】、【重試】和【忽略】鈕

MessageBoxButtons.OK 顯示【確定】鈕MessageBoxButtons.OKCancel 顯示【確定】和【取消】鈕

MessageBoxButtons.RetryCancel 顯示【重試】和【取消】鈕MessageBoxButtons.YesNo 顯示【是】和【否】按

MessageBoxButtons.YesNoCancel 顯示【是】、【否】和【取消】鈕

4-6 訊息方塊 -MessageBoxIcon列舉常數

MessageBoxIcon列舉常數說明MessageBoxIcon.Asterisk、MessageBoxIcon.Information

顯示圓形內含小寫字母 i的訊息圖示

MessageBoxIcon.Error、MessageBoxIcon.Hand、

MessageBoxIcon.Stop

顯示圓形背景紅色內含白色 X的錯誤訊息圖示

MessageBoxIcon.Exclamation、MessageBoxIcon.Warning

顯示三角形背景黃色內含驚嘆號的警告圖示

MessageBoxIcon.Question 顯示圓形內含問號的問題圖示MessageBoxIcon.None 沒有顯示圖示

4-6 訊息方塊 - MessageBoxDefaultButton

MessageBoxDefaultButton列舉常數

說明

MessageBoxDefaultButton.Button1 第一個按鈕是預設按鈕MessageBoxDefaultButton.Button2 第二個按鈕是預設按鈕MessageBoxDefaultButton.Button3 第三個按鈕是預設按鈕

4-6 訊息方塊 - 範例 (4WFBasicIO8_1)

• 例如：使用 MessageBox.Show() 方法建立訊息方塊，如下所示：MessageBox.Show(" 訊息盒測試 ", " 這是標題 ",

MessageBoxButtons.OK, MessageBoxIcon.Information);

• 第 1 個參數是訊息方塊內容的字串變數result ，第 2 個參數是視窗標題文字，顯示【確定】鈕和顯示圓形內含小寫字母 i 的訊息圖示。

4-6 訊息方塊 - 範例 (4WFBasicIO8_1)

4-6 訊息方塊 - 傳回值

• MessageBox.Show() 方法如果有傳回值– 傳回值就是按下了哪一個按鈕，– 屬於 DialogResult 列舉常數，如下表所示：

DialogResult列舉常數說明DialogResult.OK 按下【確定】鈕

DialogResult.Cancel 按下【取消】鈕DialogResult.Yes 按下【是】鈕DialogResult.No 按下【否】鈕

DialogResult.Abort 按下【終止】鈕DialogResult.Retry 按下【重試】鈕DialogResult.Ignore 按下【忽略】鈕

訊息方塊實作練習 - 利息計算(4WFBasicIO8)

• 在 Windows 應用程式建立利息計算功能，程式使用 TexBox 控制項輸入金額和利率後，計算出每年需要的利息是多少，程式是使用訊息方塊顯示計算結果，如下圖所示：

執行結果

參考解答

4-7 字型與色彩 - 說明• 在 Visual C# Express 的表單新增控制項後

– 可以在「屬性」視窗設定控制項的字型、背景色彩和前景色彩。

– 亦可在事件處理程序的程式碼中指定字型與色彩 :

• 需要建立 Font字型物件• 和使用色彩結構。

4-7 字型與色彩 - 字型物件 ( 建立物件 )

• 字型是 Font 類別的物件– 需要使用 new 運算子建立 Font 物件，如下所

示：lblShow.Font = new Font(" 細明體 ", 16,

FontStyle.Bold);– 上述程式碼建立 Font 物件指定為控制項的

Font 屬性，使用的是 Font 類別的建構子（詳細說明在物件導向章節）

– 其參數依序是字型名稱、字型尺寸和樣式，樣式是使用 FontStyle 列舉常數。

4-7 字型與色彩 - 字型物件(FontStyle 列舉常數 )

列舉常數說明FontStyle.Bold 粗體字FontStyle.Italic 斜體字

FontStyle.Regular 標準字FontStyle.Strikeout 刪除線字FontStyle.Underline 底線字

4-7 字型與色彩 -Color 結構 ( 說明 )

• 在程式碼指定控制項色彩是使用 Color 結構的屬性，如下所示：lblShow.BackColor = Color.Gray;

• 上述程式碼指定 lblShow 控制項的背景色彩 BackColor 屬性為灰色。

4-7 字型與色彩 -Color 結構 ( 常用的色彩結構 )

• 常用的色彩結構屬性，如下表所示：屬性說明屬性說明

Color.White 白色 Color.Black 黑色Color.Red 紅色 Color.Green 綠色Color.Blue 藍色 Color.Yellow 黃色Color.Purple 紫色 Color.Gray 灰色Color.Orange 橘色 Color.Navy 海軍藍

4-7 字型與色彩 -Color 結構(FromArgb 方法 )

• 如果不是常用色彩，我們可以使用 Color 結構的 FromArgb()FromArgb()方法，以 RGB 三原色的比例值來指定色彩，如下所示：lblShow.ForeColor=

Color.FromArgb(255, 0, 0);• 上述程式碼可以指定前景色彩為紅色， 3

個參數依序是紅紅、綠綠和藍藍三原色的比例值，值的範圍是 0~255 。

4-7 字型與色彩 -Visual C# 專案

Visual C# 專案： 4WFBasicIO9

• 在 Windows 應用程式提供按鈕控制項，按下按鈕可以更改標籤控制項的字型、背景和前景色彩，如下圖所示：

執行結果

基本輸出入綜合實作練習 - 簡易計算機 (4WFBasicIO10)

• 請建立一個簡易的四則計算機，擁有計算整數相加、減、乘和除的四個按鈕，只需在文字方塊輸入 2 個運算元，按下按鈕，就可以在下方標籤控制項顯示計算結果。

基本輸出入綜合實作練習 2- (4WFBasicIO11)

4.視窗應用程式的基本輸出入 20131201

Documents