#目标
在WP7中,为了达到长按弹出选项菜单效果,可以采用ContextMenu实现。
#前提条件
带有ContextMenu的toolkit,可以通过访问http://silverlight.codeplex.com/releases/view/71550获取最新的toolkit以及相应的源码及XAP。
如果需要检查,可访问$:\Program Files\Reference Assemblies\Microsoft\Framework\Silverlight\v4.0\Profile (其中$为SDK安装盘符)。对于WP7.0,访问WindowsPhone目录;对于WP7.1,访问WindowsPhone71目录。
#实现过程
至此,准备工作已经就绪,可以开始实现效果了。
方法一、通过代码来实现,利用ContextMenuService
- ContextMenu menu = new ContextMenu();
- MenuItem menuItem1 = new MenuItem();
- menuItem1.Header = "This is Menu Item 1";
- menuItem1.Click += new RoutedEventHandler(MenuItem_Click);
- menu.Items.Add(menuItem1);
- MenuItem menuItem2 = new MenuItem();
- menuItem2.Header = "This is Menu Item 2";
- menuItem2.Click += new RoutedEventHandler(MenuItem_Click);
- menu.Items.Add(menuItem2);
- ContextMenuService.SetContextMenu(rc, menu); //这里的rc,表示的是矩形框的名字,也可以说是ContextMenu依附的那个控件的名字。
方法二、通过修改xaml文件来实现
1.在工程references中引入Microsoft.Phone.Controls.Toolkit。
2.在需要实现的页面(例如,demo.xaml)文件中加入toolkit声明如下:
- xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"
3.在demo.xaml中加入实现代码如下:
- <!--ContentPanel - place additional content here-->
- <StackPanelx:Name="ContentPanel"Grid.Row="1"Margin="12,0,12,0">
- <GridBackground="Blue">
- <TextBlockText="Select a color from the Context Menu"/>
- <ListBoxx:Name="listBox">
- <ListBox.ItemTemplate>
- <DataTemplate>
- <StackPanelOrientation="Horizontal">
- <toolkit:ContextMenuService.ContextMenu>
- <toolkit:ContextMenu>
- <toolkit:MenuItemHeader="Add Color"Click="MenuItem_Click"/>
- <toolkit:MenuItemHeader="Remove Color"Click="MenuItem_Click"/>
- </toolkit:ContextMenu>
- </toolkit:ContextMenuService.ContextMenu>
- <ImageSource="{Binding ImageUri}"Stretch="None"/>
- <TextBlockText="{Binding Text}"/>
- </StackPanel>
- </DataTemplate>
- </ListBox.ItemTemplate>
- </ListBox>
- </Grid>
- </StackPanel>
如此即可完成长按弹出菜单效果。
#效果演示
#问题
1.在WP7.0上则存在被缩放的部分有显示问题,当背景颜色对比大时更加明显。
2.在mango(WP7.1+)上效果非常好,与系统现象一致。看来微软已经FIX此问题。
#参考链接
1.http://silverlight.codeplex.com/releases/view/71550,以获取最新的toolkit和source code。
2.http://www.windowsphonegeek.com/tips/wp7-contextmenu-answers-to-popular-questions