Avalonia UIのメニューに択一チェック

チェック入れたいんですよ、1つだけ。

メニューに設定項目を表示して、ユーザーに1つだけチェックを入れてもらう、そういう設計はよく見かけますよね。

そういう用途では、WPFならIsCheckableプロパティを使えば自動的にチェック付け外ししてくれるようになって便利です。
一方、Avalonia UIはもう一歩進んでます。

ToggleType="Radio"を使う

Avalonia UIのメニューにIsCheckableプロパティはありません。
もっと強力なToggleTypeプロパティがあります。

さっそく使ってみましょう。

MainWindow.axaml

<Menu>
    <MenuItem Header="Menu 1(Basic)">
        <MenuItem Header="Option 1" ToggleType="Radio"/>
        <MenuItem Header="Option 2" ToggleType="Radio"/>
        <MenuItem Header="Option 3" ToggleType="Radio"/>
        <Separator/>
        <MenuItem Header="Option 4" ToggleType="Radio"/>
        <MenuItem Header="Option 5" ToggleType="Radio"/>
        <MenuItem Header="Option 6" ToggleType="Radio"/>
    </MenuItem>
    <MenuItem Header="Menu 2(Initial Checked)">
        <MenuItem Header="Option 1" ToggleType="Radio"/>
        <MenuItem Header="Option 2" ToggleType="Radio" IsChecked="True"/>
        <MenuItem Header="Option 3" ToggleType="Radio" IsChecked="True"/>
    </MenuItem>
    <MenuItem Header="Menu 3(Group)">
        <MenuItem Header="Option A-1" ToggleType="Radio" GroupName="A"/>
        <MenuItem Header="Option A-2" ToggleType="Radio" GroupName="A"/>
        <MenuItem Header="Option A-3" ToggleType="Radio" GroupName="A"/>
        <Separator/>
        <MenuItem Header="Option B-1" ToggleType="Radio" GroupName="B"/>
        <MenuItem Header="Option B-2" ToggleType="Radio" GroupName="B"/>
        <MenuItem Header="Option B-3" ToggleType="Radio" GroupName="B"/>
    </MenuItem>
</Menu>

ソースコード全文は下記リポジトリに置いています。

基本の使い方

<MenuItem Header="Menu 1(Basic)">
    <MenuItem Header="Option 1" ToggleType="Radio"/>
    <MenuItem Header="Option 2" ToggleType="Radio"/>
    <MenuItem Header="Option 3" ToggleType="Radio"/>
    <Separator/>
    <MenuItem Header="Option 4" ToggleType="Radio"/>
    <MenuItem Header="Option 5" ToggleType="Radio"/>
    <MenuItem Header="Option 6" ToggleType="Radio"/>
</MenuItem>

ToggleType="Radio"を使うと、複数選択肢の中から1個だけ選ぶという制御を自動でやってくれるようになります。
普通のチェック項目とは異なり、選ばれなかった選択肢のチェックを外すところまで自動でやってくれます。

IsChecked="True"で初期チェック

<MenuItem Header="Menu 2(Initial Checked)">
    <MenuItem Header="Option 1" ToggleType="Radio"/>
    <MenuItem Header="Option 2" ToggleType="Radio" IsChecked="True"/>
    <MenuItem Header="Option 3" ToggleType="Radio" IsChecked="True"/>
</MenuItem>

IsChecked="True"を付けることで最初からチェックを付けることができます。
1つだけチェックがつくというルールよりIsChecked="True"のほうが優先されるようで、初期状態に限り複数チェック付けることも可能なようです。
もちろん、手動でチェックを入れると、1つだけチェックに戻ります。

GroupNameでグループ分け

<MenuItem Header="Menu 3(Group)">
    <MenuItem Header="Option A-1" ToggleType="Radio" GroupName="A"/>
    <MenuItem Header="Option A-2" ToggleType="Radio" GroupName="A"/>
    <MenuItem Header="Option A-3" ToggleType="Radio" GroupName="A"/>
    <Separator/>
    <MenuItem Header="Option B-1" ToggleType="Radio" GroupName="B"/>
    <MenuItem Header="Option B-2" ToggleType="Radio" GroupName="B"/>
    <MenuItem Header="Option B-3" ToggleType="Radio" GroupName="B"/>
</MenuItem>

一つのメニュー配下で複数種類チェックを入れたいこともありますよね。
そういうときは、GroupNameを付けるとグループ分けできます。

サンプルコードでは見やすさのため<Separator/>を入れていますが、見た目のわかりやすさだけで、グルーピングには関与しません。

余談：ToggleType="CheckBox"だと複数選択チェック

<MenuItem Header="Menu 1(CheckBox)">
    <MenuItem Header="Option 1" ToggleType="Radio"/>
    <MenuItem Header="Option 2" ToggleType="Radio"/>
    <MenuItem Header="Option 3" ToggleType="Radio"/>
    <Separator/>
    <MenuItem Header="Check 1" ToggleType="CheckBox"/>
    <MenuItem Header="Check 2" ToggleType="CheckBox"/>
    <MenuItem Header="Check 3" ToggleType="CheckBox"/>
</MenuItem>

WPFのIsCheckableプロパティみたいな挙動はどうするのかというと、ToggleType="CheckBox"を使います。
こうすると、複数にチェックを付け外しできるようになります。
見た目もRadioとCheckBoxで差別化されていますね。

動作確認環境

• Avalonia 12.0.4
• Visual Studio 2026 Community 18.7.1
• Windows 11