TOPページ > Tips > Windows Phone 7 > フォーム・コントロール > ContextMenuService >

Context Menuで選択したアイテムを取得する

ListBoxのアイテムをホールドしてコンテキストメニューを表示し、例えば「Delete」を選択した時に、どのアイテムに対してDeleteが行われたのかを取得する必要があります。

コンテキストメニューで選択されたのが、どのアイテムに対してなのか

XAMLの定義はこんな感じにしておきます。ContextServiceクラスを使用するために名前空間toolkitの定義を行います。コンテキストメニューを表示させるには、ItemTemplateのDataTemplateにてContext Menuを組み込みます。

ContextMenuのIsZoomEnabledプロパティをTrueに設定している場合、選択項目をホールドすると選択項目以外がズームアウトします。

...
shell:SystemTray.IsVisible="False" 
xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit">
 
<ListBox Name="listBox1" VerticalAlignment="Stretch" 
	HorizontalAlignment="Stretch" Width="366">
    <ListBox.ItemTemplate>
        <DataTemplate>
            <StackPanel Orientation="Horizontal" Margin="0,20,0,0" >
 
                <!-- コンテキストメニューの定義 -->
                <toolkit:ContextMenuService.ContextMenu>
                    <toolkit:ContextMenu IsZoomEnabled="True">
                        <toolkit:MenuItem Header="Delete" 
                            Click="MenuItem_Click" />
                    </toolkit:ContextMenu>
                </toolkit:ContextMenuService.ContextMenu>
 
                <TextBlock Text="{Binding}" Margin="30,0" 
                    TextWrapping="Wrap" 
                    Style="{Binding PhoneTextExtraLargeStyle}" />
 
            </StackPanel>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

あらかじめ、XAML内でコンテキストメニューの項目がクリックしたときのイベントハンドラが定義されていますので、MenuItem_ClickメソッドにてContext Menuで選択したアイテムを取得してみます。

        private void MenuItem_Click(object sender, RoutedEventArgs e)
        {
            var item = ((sender as FrameworkElement).DataContext as LibraryViewModel);
            if (item != null) return;
 
            // NOTE: 削除の処理とか
	}

選択項目以外をズームアウトさせない方法

IsZoomEnabledをFalseに設定していると、そのままの状態でコンテキストメニューが表示されます。

                                <!-- Context Menu -->
                                <toolkit:ContextMenuService.ContextMenu>
                                    <toolkit:ContextMenu IsZoomEnabled="False">
                                        <toolkit:MenuItem Header="Delete" />
                                    </toolkit:ContextMenu>
                                </toolkit:ContextMenuService.ContextMenu>

Catをホールドしてコンテキストメニューを表示してみました。上記のスクリーンショットと違い選択項目以外がズームアウトしていないのが分かります。