实现Listbox中长按弹出ContextMenu效果

xaml:

<Button Content="Button" Height="72" HorizontalAlignment="Left" Margin="156,114,0,0" Name="button1" VerticalAlignment="Top" Width="160" >
                <toolkit:ContextMenuService.ContextMenu>
                    <toolkit:ContextMenu Height="300"
                                         HorizontalAlignment="Left"
                                         Margin="0,0,0,0" 
                                         Name="contextMenu1"
                                         VerticalAlignment="Top"
                                         Width="100" 
                                         Background="Red">
                        <toolkit:MenuItem Header="你好" Click="MenuItem_Click">                            
                        </toolkit:MenuItem>
                        <toolkit:Separator></toolkit:Separator>
                        <toolkit:MenuItem>
                            <toolkit:MenuItem.Header>
                                <StackPanel Orientation="Horizontal">
                                    <Image  Source="/ApplicationIcon.png" ></Image>
                                    <TextBlock Text="好好学习"></TextBlock>
                                    
                                </StackPanel>
                                
                            </toolkit:MenuItem.Header>
                        </toolkit:MenuItem>
                    </toolkit:ContextMenu>
                </toolkit:ContextMenuService.ContextMenu>                
            </Button>

上面红色部门必须加的,contextMenu不能放到容器中用,要和其他控件绑定同时使用,你长按button就会弹出一个菜单,你试下上面代码就知道了



在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目录。

#实现过程

至此,准备工作已经就绪,可以开始实现效果了。

1.在工程references中引入Microsoft.Phone.Controls.Toolkit。

2.在需要实现的页面(例如,demo.xaml)文件中加入toolkit声明如下:

[csharp]  view plain copy
  1. xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"   
3.在demo.xaml中加入实现代码如下:
[csharp]  view plain copy
  1. <!--ContentPanel - place additional content here-->  
  2.         
  3. <StackPanel x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0" >  
  4.           <Grid Background="Blue">  
  5.               <TextBlock Text="Select a color from the Context Menu"/>  
  6.     <ListBox x:Name="listBox">  
  7.         <ListBox.ItemTemplate>  
  8.             <DataTemplate>  
  9.                 <StackPanel Orientation="Horizontal">  
  10.                     <toolkit:ContextMenuService.ContextMenu>  
  11.                         <toolkit:ContextMenu>  
  12.                             <toolkit:MenuItem Header="Add Color" Click="MenuItem_Click"/>  
  13.                             <toolkit:MenuItem Header="Remove Color" Click="MenuItem_Click"/>  
  14.                         </toolkit:ContextMenu>  
  15.                     </toolkit:ContextMenuService.ContextMenu>  
  16.                     <Image Source="{Binding ImageUri}" Stretch="None" />  
  17.                     <TextBlock Text="{Binding Text}" />  
  18.                 </StackPanel>  
  19.             </DataTemplate>  
  20.         </ListBox.ItemTemplate>  
  21.     </ListBox>  
  22.           </Grid>  
  23.   
  24.       </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

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值