WPF DataGrid 行悬浮显示操作图片
0
悬赏园豆：100
[已解决问题]
解决于 2014-05-27 18:02
wpf datagrid，需要实现下图这种效果。图片是定义的操作。可以是多个操作。
现在的效果是通过LoadingRow在后台绑定的MouseEnter和MouseLeave事件。想通过触发器实现这种效果，但是有两个问题。
1.MouseEnter 不知如何绑定到DataGridRow对象上。
2.Command传参数，不知如何获取悬浮的行对象。
<DataGrid Name="dg" ItemsSource="{Binding List}" AutoGenerateColumns="False" CanUserAddRows="False"> <i:Interaction.Triggers> <i:EventTrigger EventName="MouseEnter" SourceObject="{Binding Path=DataContext, RelativeSource={RelativeSource Mode=FindAncestor, AncestorLevel=1,AncestorType=DataGridRow}}"> <i:InvokeCommandAction Command="{Binding MouseOverCommand}" CommandParameter="{Binding RelativeSource={RelativeSource Mode=FindAncestor,AncestorType=DataGridRow}}" /> <!--<cmd:EventToCommand Command="{Binding MouseOverCommand}" PassEventArgsToCommand="True" CommandParameterValue="{Binding RelativeSource={RelativeSource Mode=FindAncestor,AncestorType=DataGridRow}}"/>--> </i:EventTrigger> </i:Interaction.Triggers> <DataGrid.Columns> <DataGridTextColumn Header="名字" Binding="{Binding Name}"/> <DataGridTemplateColumn Header="操作"> <DataGridTemplateColumn.CellTemplate> <DataTemplate> <Image Visibility="{Binding IsVisible}" Source="C:\Users\Administrator\Pictures\large_logo.png" Width="20" Height="20"/> </DataTemplate> </DataGridTemplateColumn.CellTemplate> </DataGridTemplateColumn> </DataGrid.Columns> </DataGrid>
源代码（快盘下载）：http://www.kuaipan.cn/file/id_226427209806523487.htm?source=1
谢谢大神帮忙解答。
主要就是想问下通过触发器怎么实现，现在是已经实现效果了。通过LoadingRow绑定的事件。
最佳答案
1
<DataGridTemplateColumn Header="操作"> <DataGridTemplateColumn.CellTemplate> <DataTemplate> <Button Content="删除" Command="{Binding Delete}" CommandParameter="{Binding}"> <Button.Style> <Style TargetType="Button"> <Setter Property="Opacity" Value="0"/> <Style.Triggers> <Trigger Property="IsMouseOver" Value="True"> <Setter Property="Opacity" Value="1"/> </Trigger> </Style.Triggers> </Style> </Button.Style> </Button> </DataTemplate> </DataGridTemplateColumn.CellTemplate> </DataGridTemplateColumn>
CommandParameter="{Binding}" 这样传递的参数就是 button 的datacontext,也就是DatagridRow所在行的对象
收获园豆：90
Command="{Binding Delete}" 中的 delete command 要写在tempUser里。
这个图片有点问题，我改下。不是固定那一列悬浮，还是整个行悬浮。DataGridRow悬浮。
@xiaocong_soft:
<Window.Resources> <BooleanToVisibilityConverter x:Key="boolToVisibilityConverter"/> </Window.Resources>
<DataGrid Name="dg" ItemsSource="{Binding List}" AutoGenerateColumns="False" CanUserAddRows="False"> <DataGrid.Columns> <DataGridTextColumn Header="名字" Binding="{Binding Name}"/> <DataGridTemplateColumn Header="操作"> <DataGridTemplateColumn.CellTemplate> <DataTemplate> <Button Content="删除" Command="{Binding Delete}" CommandParameter="{Binding}" Visibility="{Binding IsMouseOver,RelativeSource={RelativeSource AncestorType=DataGridRow},Converter={StaticResource boolToVisibilityConverter}}"/> </DataTemplate> </DataGridTemplateColumn.CellTemplate> </DataGridTemplateColumn> </DataGrid.Columns> </DataGrid>
@德年: 哥哥，吊炸天了。点赞。
其他回答(1)
0
可以通过重写DataGrid的模板来实现。
在悬浮列那里默认增加你的图片，设置为隐藏。然后重写MouseEnter方法。当方法触发后，将图片设置为显示。一开就隐藏。
方法触发的同时将当前列设置为选中状态。
这样应该能实现你的需求。
重写DataGrid的模板的如果不会的话，可以参考http://msdn.microsoft.com/zh-cn/library/ff506248(v=vs.110).aspx
收获园豆：10
没太看明白。这个图片是一个操作，这个操作可能有多个，图片也可能不一样。点击对应图片执行对应Command。
写在模板里，如果只是简单的样式可以搞定。如果能通过xaml传递参数给模版，最好了。
水平有限，期待大神详细回复。
@xiaocong_soft: 图片可以通过绑定的。在后台你在去根据获取到的行对象的图片去判断是否需要做什么操作。这样可行吗？
@呓语星辰: 现在就想问通过触发器怎么实现。现在只是通过LoadingRow初始化行的时候绑定的事件。
@xiaocong_soft: 不是发给你了嘛 重写模板啊 在模板中重写事件。重写了后你的鼠标移动上去就会触发。。不懂你说的通过触发器怎么实现是什么意思
