勾選框

瀏覽範例。 瀏覽範例

.NET 多平台應用程式介面（.NET MAUI） CheckBox 是一種按鈕，可以選擇勾選或空置。 勾選一個勾選框時，該方塊被視為開啟。 當勾選框為空時，該方框被視為關閉。

CheckBox 定義下列屬性：

  • IsChecked，型別為bool，表示CheckBox是否被勾選。 此性質預設綁定模式為 TwoWay。
  • Color，其型別為 Color，表示 CheckBox 的顏色。

這些屬性是由 BindableProperty 物件所支援，這表示可以設定樣式，並成為數據系結的目標。

CheckBox 定義了一個在 IsChecked 屬性變更時觸發的 CheckedChanged 事件，不論是透過使用者操作或是應用程式設定該 IsChecked 屬性。 CheckedChangedEventArgs 事件隨附 CheckedChanged 物件具有名為 Value的單一屬性，類型為 bool。 當事件被觸發時，該財產的價值 Value 會被設定為該財產的新價值 IsChecked 。

建立一個勾選框

以下範例說明如何在 XAML 中實例化 a CheckBox ：

<CheckBox />

這個 XAML 產生了如下截圖所示的外觀：

空勾選框的截圖。

預設情況下，CheckBox 是空的。 可以透過使用者操作檢查CheckBox，或將屬性IsChecked設為true：

<CheckBox IsChecked="true"
          SemanticProperties.Description="Agree to terms and conditions" />

這個 XAML 產生了如下截圖所示的外觀：

勾選勾選框的截圖。

或者，也可以在程式碼中建立 a CheckBox ：

CheckBox checkBox = new CheckBox { IsChecked = true };

回應勾取框狀態變更

當 IsChecked 屬性變更時，無論是透過使用者操作或應用程式設定 IsChecked 屬性，都會引發 CheckedChanged 事件。 您可以註冊此事件的事件處理程式以回應變更：

<CheckBox CheckedChanged="OnCheckBoxCheckedChanged" />

程式代碼後置檔案包含 CheckedChanged 事件的處理程式：

void OnCheckBoxCheckedChanged(object sender, CheckedChangedEventArgs e)
{
    // Perform required operation after examining e.Value
}

負責sender事件的是CheckBox這一參數。 你可以用它來存取CheckBox物件，或區分共享同一CheckedChanged事件處理器的多個CheckBox物件。

或者，也可以在程式碼中註冊事件處理 CheckedChanged 程序：

CheckBox checkBox = new CheckBox { ... };
checkBox.CheckedChanged += (sender, e) =>
{
    // Perform required operation after examining e.Value
};

將檢查框進行資料綁定

透過使用資料綁定和觸發器來回應CheckBox被檢查或空置的狀況，可以消除CheckedChanged事件處理程序的需求。

<CheckBox x:Name="checkBox" />
<Label Text="Lorem ipsum dolor sit amet, elit rutrum, enim hendrerit augue vitae praesent sed non, lorem aenean quis praesent pede.">
    <Label.Triggers>
        <DataTrigger x:DataType="CheckBox"
                     TargetType="Label"
                     Binding="{Binding Source={x:Reference checkBox}, Path=IsChecked}"
                     Value="true">
            <Setter Property="FontAttributes"
                    Value="Italic, Bold" />
            <Setter Property="FontSize"
                    Value="18" />
        </DataTrigger>
    </Label.Triggers>
</Label>

在此範例中，Label 使用資料觸發器中的綁定表達式來監控 CheckBox 的 IsChecked 屬性。 當此性質變為 true時，FontAttributes與FontSizeLabel性質 則會改變。 當 IsChecked 屬性回到 false時，FontAttributes 的 FontSize 和 Label 屬性會重設為其初始狀態。

以下截圖顯示當勾選CheckBox時，Label的格式：

資料綁定勾選框的截圖。

欲了解更多觸發點資訊，請參見 「觸發點」。

停用勾選框

有時應用程式會進入一種狀態，其中正在檢查的 CheckBox 是無效操作。 在這種情況下，CheckBox 可以藉由將其 IsEnabled 屬性設定為 false來停用。

勾取方塊出現

除了繼承自類別CheckBox的性質View外，CheckBox還定義了一個Color屬性，將其顏色設定為：Color

<CheckBox Color="Red" />

以下截圖顯示一系列被檢查的 CheckBox 物件，每個物件的 Color 屬性設定為不同的 Color：

彩色勾選框截圖。

勾選框視覺狀態

** CheckBox 有一個 IsCheckedVisualState 可以用來啟動 CheckBox 在被選取時的視覺變化。

以下 XAML 範例展示了如何為 IsChecked 狀態定義視覺狀態：

<CheckBox ...>
    <VisualStateManager.VisualStateGroups>
        <VisualStateGroupList>
            <VisualStateGroup x:Name="CommonStates">
                <VisualState x:Name="Normal">
                    <VisualState.Setters>
                        <Setter Property="Color"
                                Value="Red" />
                    </VisualState.Setters>
                </VisualState>

                <VisualState x:Name="IsChecked">
                    <VisualState.Setters>
                        <Setter Property="Color"
                                Value="Green" />
                    </VisualState.Setters>
                </VisualState>
            </VisualStateGroup>
        </VisualStateGroupList>
    </VisualStateManager.VisualStateGroups>
</CheckBox>

在這個例子中，IsCheckedVisualState 指定當 CheckBox 被勾選時，其 Color 屬性會被設定為綠色。 該 NormalVisualState 條件規定當 處於 CheckBox 正常狀態時，其 Color 性質將被設定為紅色。 因此，整體效果是，當 CheckBox 為空時，它呈現紅色，而勾選時則為綠色。

如需視覺狀態的詳細資訊，請參閱 視覺狀態。

  • Last updated on