#wp7dev_jp

さて、いろいろなエフェクトをつけてきましたが、この辺を選択できるメニューが必要です。

そこで横スクロールのボタンメニューを作るわけですが、いくつか方法はあります。

  • リストコントロールを使ってテンプレートを作り横方向リストコントロールにする
  • ピボットを使う
  • スクロールビューワーでボタンを並べる

そもそも使いたいのはメニューだけで画面は必要ないので、ピボットを使うシナリオはなし。リストコントロールも複数選択などはないので、ちょっとオーバースペックかな?ということで単純にスクロールビューワーを使うことにする。

こんな構造。

image

 

どの手法でもいいですが適材適所で。XAMLはシンプルにこんな感じ。横スクロールのバーは非表示にしておく。

<ScrollViewer Height="146"
    HorizontalScrollBarVisibility="Hidden" 
    VerticalScrollBarVisibility="Disabled">
    <StackPanel Orientation="Horizontal">
        <Button x:Name="btnOriginal" Content="Original">
            <Button.Background>
                <ImageBrush Stretch="None" 
                    ImageSource="Images/Button/オリジナル.jpg"/>
            </Button.Background>
        </Button>
        <Button x:Name="nostalgic" Content="Nostalgic">
            <Button.Background>
                <ImageBrush Stretch="None" 
                    ImageSource="Images/Button/コントラスト.jpg"/>
            </Button.Background>
        </Button>
             :
    </StackPanel>
</ScrollViewer>

実際にはこんな感じになります。

ボタンはスクエアなボタンテンプレートを作成。名前なしのコントロールテンプレートなのでここのボタンのXAMLにはテンプレート参照は書きません。

image

UI もそれなりに整ってきた。

関連リンク