AppBarUtils - Kazzz's diary

ApplicationBar自体はBlend4でデザイン支援を受けることができる標準のクラスを使用する

ApplicationBarButton、ApplicationBarMenuItemも同様

上記アイテムのClickイベントに対応するトリガ、コマンドを用意する

この方針で実装することにしたのだが、参考になる(というかそのもの)実装をCodePlexで見つけた。

AppBarUtils for Windows Phone SDK 7.1

AppBarUtilsはApplicationBarに特化したユーティリティであり、ソースコードを読んだ所では冒頭で書いた機能をほぼ実現できそうなので、この中で必要と思われるソースコードを流用させて頂くことにした。

流用させて頂くクラスは以下の5つ。

AppBarItemType

アプリケーションバーの下にはボタンとメニューがぶら下がるが、その種類を特定するために使用する列挙型

AppBarExtensions

アプリケーションバーを基点として対象のアイテムを探すための拡張メソッドクラス(ApplicationBarのインスタンスメソッドのように使える)

AppBarItemBehavior

コマンド、トリガのベースクラスとなるアプリケーションバーをターゲットとするビヘイビアクラス

AppBarItemCommand

アプリケーションバー下のアイテム(ボタン、メニュー)のクリックイベントから起動することのできるコマンド(ICommand)を包含するビヘイビアクラス

AppBarItemTrigger

アプリケーションバー下のアイテム(ボタン、メニュー)のクリックイベントをトリガとして扱うためのTriggerBase派生クラス

実際にXAMLに書くとこんな感じになる。

settings.xamlより、AppBarItemTriggerを使う例

    <phone:PhoneApplicationPage.ApplicationBar>
        <shell:ApplicationBar IsVisible="True" IsMenuEnabled="false">
            <shell:ApplicationBarIconButton x:Name="saveSettings" IconUri="/icons/appbar.check.rest.png" Text="save"/>
            <shell:ApplicationBarIconButton x:Name="cancelSettings" IconUri="/icons/appbar.cancel.rest.png" Text="cancel"/>
        </shell:ApplicationBar>
    </phone:PhoneApplicationPage.ApplicationBar>

    <i:Interaction.Triggers>
        <ApplicationBar:AppBarItemTrigger Id="save" Text="保存">
            <i:InvokeCommandAction Command="{StaticResource cmdSave}" CommandParameter="{Binding}"/>
        </ApplicationBar:AppBarItemTrigger>
    </i:Interaction.Triggers>

この例ではInteraction.Triggers要素下にAppBarItemTriggerクラスを配置しており、Idが"save"つまり、ApplicationBarIconButtonのText属性が"save"のボタンのクリックイベントをトリガとしてInvokeCommandActiontが実行されるように記述されている。

ポイントは、AppBarItemTriggerが自らとApplicationBarIconButtonの関連づけするのにTextプロパティを使用する点。正直あまり良い実装とはあえないが、ApplicationBarIconButton/ApplicationBarIconMenuItemにはIdプロパティのようにコントロールを一意を識別するためのプロパティが存在しておらず、それにはTextプロパティを使うしかないためやむなしといった所である。

TextプロパティをIdのように使っているため、ApplicationBarIconButtonのTextプロパティは本来の役目であるボタンの文字コンテンツを果たせない訳だが、AppBarItemTriggerにはTextプロパティがありこれをApplicationBarIconButtonの同名のプロパティにバインドすることでコンテンツを設定をAppBarItemTrigger側から行えるようにしている訳だ。

実行結果

テキストが"保存"となっているボタンを押下する

AppSettingsSaveCommandが実行される。

AppBarUtinlsを利用することで標準のアプリケーションバーをBlend4でデザインした後、対応したトリガ、アクションをボタン、又はメニューにバインドすることができるようになった。