问题描述

正常使用右键菜单ContextMenu时，如果菜单项是不变的，可以直接在XAML中写死，如下是给一个Button按钮添加了右键菜单功能。

<Button Content="Test" Width="100" Height="30"><Button.ContextMenu><ContextMenu><MenuItem Header="1"/><MenuItem Header="1123"/><MenuItem Header="11234134532"/><MenuItem Header="1234532"/><MenuItem Header="1234"/><MenuItem Header="13245324532543253"/></ContextMenu></Button.ContextMenu>
</Button>

此时整个MenuItem菜单项都是可以响应点击的。

然而项目中通常右键菜单项MenuItem的内容是不固定的，是通过ItemsSource绑定了集合。集合使用的数据内容是可以动态修改的，在XAML中只是写数据模板ItemTemplate。代码改造一下如下。

XAML：ItemSource绑定列表DataList，MenuItem中显示的是DataList集合中的每个自定义对象的Num属性。

<Button Content="Test" Width="100" Height="30"><Button.ContextMenu><ContextMenu ItemsSource="{Binding DataList, Mode=TwoWay}"><ContextMenu.ItemTemplate><DataTemplate><MenuItem Header="{Binding Num}"Command="{Binding RelativeSource={RelativeSource AncestorType=Window},Path=DataContext.YourCommand}" CommandParameter="{Binding RelativeSource={x:Static RelativeSource.Self}}"/></DataTemplate></ContextMenu.ItemTemplate></ContextMenu></Button.ContextMenu>
</Button>

自定义的实体类Student.cs。

public class Student
{public string Num { get; set; }public int Age { get; set; }
}

ViewModel：定义DataList集合。

private ObservableCollection<Student> dataList;
public ObservableCollection<Student> DataList
{get { return dataList; }set { dataList = value; }
}

给DataList填充数据。

DataList = new ObservableCollection<Student>();
DataList.Add(new Student() { Num = "12", Age = 10});
DataList.Add(new Student() { Num = "12213", Age = 10 });
DataList.Add(new Student() { Num = "1212", Age = 10 });
DataList.Add(new Student() { Num = "2", Age = 10 });
DataList.Add(new Student() { Num = "112341242134122", Age = 10 });
DataList.Add(new Student() { Num = "123452342", Age = 10 });

运行后即可发现问题。

仔细观察上图运行效果，每个菜单项是嵌套在条目内部的，只有点击到中间深色区域才能触发菜单项的点击事件！点击左右两端浅色部分也能使菜单项关闭，但不会触发菜单项的点击事件！

解决方案

最初的想法是给内部被嵌套的MenuItem改样式，改为Padding=0应该就能使其扩大到紧贴整个条目区域。

<Button Content="Test" Width="100" Height="30"><Button.ContextMenu><ContextMenu ItemsSource="{Binding DataList, Mode=TwoWay}"><ContextMenu.ItemContainerStyle><Style TargetType="{x:Type MenuItem}"><Setter Property="Padding" Value="-33,0,-63,0"/></Style></ContextMenu.ItemContainerStyle><ContextMenu.ItemTemplate><DataTemplate><MenuItem Header="{Binding Num}" Command="{Binding RelativeSource={RelativeSource AncestorType=Window},Path=DataContext.YourCommand}" CommandParameter="{Binding RelativeSource={x:Static RelativeSource.Self}}"/></DataTemplate></ContextMenu.ItemTemplate></ContextMenu></Button.ContextMenu>
</Button>

通过ContextMenu.ItemContainerStyle设置样式的Padding属性后，看上去菜单项已经覆盖了整个条目，但点击时依然是左右两端无法响应点击事件，只有中间部分能响应到！（测试的点击事件已被绑定到YourCommand命令中，此处已省略）

谷歌一下，看看别人是怎么处理该问题的。

参考：

https://social.msdn.microsoft.com/Forums/vstudio/en-US/188e6bad-352a-4e7d-a3bb-0a88f7760529/datatemplate-can-not-access-menuitemclick-attribute?forum=wpf
https://stackoverflow.com/questions/44763405/c-sharp-wpf-contextmenu-menuitem-does-not-react-to-click

上面第一篇文章中，老外的意见是不要在ItemTemplate中嵌套MenuItem，改为嵌套TextBlock。试了一下发现没用。。

根据第二篇中的回复，改为不用DataTemplate，完全在ContextMenu.ItemContainerStyle中设置菜单项的属性，试用后生效了。

<Button Content="Test" Width="100" Height="30"><Button.ContextMenu><ContextMenu ItemsSource="{Binding DataList, Mode=TwoWay}" Padding="0"><!-- 消除ItemTemplate造成的内部MenuItem嵌套，导致左右两端无法响应点击的问题 --><ContextMenu.ItemContainerStyle><Style TargetType="{x:Type MenuItem}"><Setter Property="Header" Value="{Binding Num}"/><Setter Property="Command" Value="{Binding RelativeSource={RelativeSource AncestorType=Window},Path=DataContext.YourCommand}"/><Setter Property="CommandParameter" Value="{Binding RelativeSource={x:Static RelativeSource.Self}}"/></Style></ContextMenu.ItemContainerStyle></ContextMenu></Button.ContextMenu>
</Button>

此时MenuItem菜单项覆盖了整个条目，且点击左右两端都能触发点击事件了！

posted on 2018-09-11 17:05 NET未来之路阅读(...) 评论(...) 编辑收藏

转载于:https://www.cnblogs.com/lonelyxmas/p/9628876.html

【WPF】右键菜单ContextMenu可点击区域太小的问题相关推荐

win10系统右键新建菜单里office报错0x8007007A:传递给系统调用的数据区域太小。
问题描述: 鼠标右键新建word.excel等office文件时,提示错误:0x8007007A:传递给系统调用的数据区域太小.但原有office文件可正常使用(本人电脑是thinkpad,offic ...
vue-axios下载文件流blob，ie下载报传递给系统调用的数据区域太小.ie文件流下载报错；文件下载失败将blob的错误信息转换成json格式
本次下载是后台文件流传输,前端下载,前端将拿到的下载id和名称downloadName传递给下载方法:如果是多个下载,可以采用数组for循环情景描述: 1.如果符合导出条件, 后端直接返回数据流,如 ...
NVIDIA控制面板打开报错，提示nvcplui.exe应用程序错误并显示传递给系统调用的数据区域太小
打开NVIDIA控制面板时提示错误,提示nvcplui.exe应用程序错误并显示传递给系统调用的数据区域太小解决方法:打开报错提示中程序所在路径我电脑对应路径如下图所示在电脑中进入对应路径,可能 ...
传递给系统调用的数据区域太小。 (异常来自 HRESULT:0x8007007A)
传递给系统调用的数据区域太小. (异常来自 HRESULT:0x8007007A) 参考文章: (1)传递给系统调用的数据区域太小. (异常来自 HRESULT:0x8007007A) (2)http ...
wpf 代码获取contextmenu_WPF 如何控制右键菜单ContextMenu的弹出
在具体做一些项目的时候,有时候需要需要先左键点击某个节点,然后再右键点击节点的时候才弹出右键菜单,所以直接右键点击时需要禁用掉右键菜单,这里比如我们为Grid添加了ContextMenu,但是我们需要 ...
WPF中的右键菜单ContextMenu
WPF中的右键菜单主要是通过ContextMenu来实现,ContextMenu的使用有两种方式一..在Resources中声明,在控件中使用. 1.在Resources中添加ContextMenu ...
WPF右键菜单动态传值
菜单简介安装 Newtonsoft.Json.dll 1.VS安装 2.网页下载代码实现 1. 窗体 2.后台代码动态绑定右键菜单以及事件传对象关键代码小结简介在工作WPF项目中需要给图 ...
java 树右键菜单_VUE实现Studio管理后台（八）：用右键菜单contextmenu，编辑树形结构...
RXEdior预设会有文件管理功能,但是灵活性需求不大,目前的设想是文件夹不允许修改,只允许增删改文件.基于这样的设想,把界面实现成这个效果: 这个功能并不是一个通用功能,并且我们做的代码,也没有按照 ...
jqGrid 右键菜单contextmenu简单实现
鼠标右键单击表格弹出快捷菜单可以查看.编辑.新增.删除行记录,这是很多项目的常见操作,jqGrid也可以实现类似功能,本案例依赖:bootstrap-contextmenu,该项目比较老了作者已经不维 ...

【WPF】右键菜单ContextMenu可点击区域太小的问题

问题描述

解决方案

【WPF】右键菜单ContextMenu可点击区域太小的问题相关推荐

最新文章

热门文章