使用 Button 組件

與 Button 組件的使用者互動
Button 組件參數
建立具有 Button 組件的應用程式
- 建立具有 Button 組件的應用程式

此Button 組件是可調整大小的矩形按鈕，使用者可以透過滑鼠或空白鍵按下此按鈕，啟動應用程式中的動作。您可以將自訂的圖示增加到 Button，也可以將 Button 的行為從按下方式變更為切換方式。切換 Button 會在按一下時保持按下狀態，再按一下時又會回復一般狀態。

Button 是許多表單與網路應用程式的基本項目。如果希望使用者觸發某個事件，您就可以使用按鈕。例如，大部分表單都有「送出」按鈕。您也可以在簡報中增加「上一張」和「下一張」按鈕。

與 Button 組件的使用者互動

您可以在應用程式中啟用或停用按鈕。處於停用狀態的按鈕不接受滑鼠或鍵盤輸入。如果您按一下或用 Tab 鍵移到啟用的按鈕上，它就會成為焦點。當 Button 實體成為焦點時，您可以使用下列按鍵加以控制：

按鍵	說明
Shift+Tab	將焦點移到上一個物件。
空白鍵	按下或放開按鈕，並且觸發 `click` 事件。
Tab 鍵	將焦點移到下一個物件。
Enter/Return	如果按鈕設定為 FocusManager 的預設 Button，則會將焦點移至下一個物件。

如需有關控制焦點的詳細資訊，請參閱 Flash Professional 的 ActionScript 3.0 參考中的「IFocusManager 介面」和「FocusManager 類別」，以及使用 FocusManager 。

進行編寫時，每個 Button 實體的即時預覽會反映您在「屬性」檢測器或「組件檢測器」中對參數的變更。

備註：如果圖示比按鈕大，就會延伸超出按鈕的邊框。

若要在應用程式中指定某個按鈕為預設按鈕 (也就是當使用者按下 Enter 鍵時，便會接收 click 事件的按鈕)，請設定 FocusManager.defaultButton 。例如，下列程式碼會將預設按鈕設定為 Button 實體 submitButton 。

FocusManager.defaultButton = submitButton;

將 Button 組件加入應用程式時，您可以加入下列 ActionScript 程式碼，讓螢幕朗讀程式能夠存取此組件：

import fl.accessibility.ButtonAccImpl; 
 
ButtonAccImpl.enableAccessibility();

不論您為組件建立了多少個實體，都只需要啟用組件的輔助功能一次。

Button 組件參數

您可以在「屬性」檢測器 (「視窗 > 屬性 > 屬性」) 或「組件檢測器」(「視窗 > 組件檢測器」) 中，為每個 Button 實體： emphasized 、 label 、 labelPlacement 、 selected 和 toggle 。這些參數都具有相對應的 ActionScript 同名屬性。當您指定這些參數的值時，就是設定屬性在應用程式中的起始狀態。在 ActionScript 中設定屬性會覆寫您設定給參數的值。如需有關這些參數可能值的詳細資訊，請參閱適用於 Adobe Flash Platform 的 ActionScript 3.0 參考中的 Button 類別。

建立具有 Button 組件的應用程式

下列程序說明如何在編寫時將 Button 組件加入應用程式。在這個範例中，當您按一下 Button 時，就會變更 ColorPicker 組件的狀態。

建立新的 Flash (ActionScript 3.0) 文件。
將 Button 組件從「組件」面板拖曳到「舞台」，然後在「屬性」檢測器中為組件輸入下列值：
- 輸入實體名稱 aButton 。
- 輸入 Show 做為 label 參數的值。
在「舞台」上新增 ColorPicker，並賦予實體名稱 aCp 。
開啟「動作」面板，選取主要「時間軸」中的「影格 1」，然後輸入下列 ActionScript 程式碼：
```
aCp.visible = false; 
 
aButton.addEventListener(MouseEvent.CLICK, clickHandler); 
 
function clickHandler(event:MouseEvent):void { 
     
    switch(event.currentTarget.label) { 
        case "Show": 
            aCp.visible = true; 
            aButton.label = "Disable"; 
            break; 
        case "Disable": 
            aCp.enabled = false; 
            aButton.label = "Enable"; 
            break; 
        case "Enable": 
            aCp.enabled = true; 
            aButton.label = "Hide"; 
            break; 
        case "Hide": 
            aCp.visible = false; 
            aButton.label = "Show"; 
            break; 
    } 
}
```
第二行程式碼會將 clickHandler() 函數註冊成為 MouseEvent.CLICK 事件的事件處理常式函數。當使用者按一下該 Button 時便會發生此事件，並導致 clickHandler() 函數根據 Button 的值採取下列其中一個動作：
- Show 會讓 ColorPicker 變成可見狀態，並將 Button 的標籤變更為 Disable。
- Disable 會停用 ColorPicker，並將 Button 的標籤變更為 Enable。
- Enable 會啟用 ColorPicker，並將 Button 的標籤變更為 Hide。
- Hide 會讓 ColorPicker 變成隱藏狀態，並將 Button 的標籤變更為 Show。
選取「控制 > 測試影片」，執行應用程式。

建立具有 Button 組件的應用程式

下列程序會使用 ActionScript 建立切換 Button，並且當您按一下此 Button 時，會在「輸出」面板中顯示事件類型。此範例會叫用類別的建構函式以建立 Button 實體，並透過呼叫 addChild() 方法將實體加入「舞台」。

建立新的 Flash (ActionScript 3.0) 文件。
將 Button 組件從「組件」面板拖曳到目前文件的「元件庫」面板。

此舉會將組件加入元件庫中，但不會使其在應用程式中顯示。
開啟「動作」面板，選取主要「時間軸」中的「影格 1」，然後輸入下列程式碼以建立 Button 實體：
```
import fl.controls.Button; 
 
var aButton:Button = new Button(); 
addChild(aButton); 
aButton.label = "Click me"; 
aButton.toggle =true;  
aButton.move(50, 50);
```
move() 方法會將該按鈕放置於「舞台」上 50 (x 座標), 50 (y 座標) 的位置。

接著，加入下列 ActionScript 以建立事件偵聽程式和事件處理常式函數：

aButton.addEventListener(MouseEvent.CLICK, clickHandler); 
 
function clickHandler(event:MouseEvent):void { 
    trace("Event type: " + event.type); 
}

選取「控制 > 測試影片」。

當您按一下按鈕時，Flash 會在「輸出」面板中顯示「Event type: click」訊息。