在数据网格的最后一个数据列上放置上下文菜单以控制 WPF 中其他列的可见性
Placing a context menu on the last Data Column of Data Grid to control the visibility of other columns in WPF
如何在 DataGrid 的最后一个数据列上放置上下文菜单,以便它可以控制其他列的可见性。
我有一个总共有 8 列的数据网格。如何在最后一列放置上下文菜单?
需要了解是否存在从上下文菜单中控制其他列的可见性的可能性(如下图所示)?
<DataGrid x:Name="MyGrid" ItemsSource="{Binding obvCollection}" AutoGenerateColumns="False" >
<DataGridTemplateColumn Header = "Column 1"/>
<DataGridTemplateColumn Header = "Column 2"/>
<DataGridTemplateColumn Header = "Column 3"/>
<DataGridTemplateColumn Header = "Column 4"/>
<DataGridTemplateColumn Header = "Column 5"/>
<DataGridTemplateColumn Header = "Column 6"/>
<DataGridTemplateColumn Header = "Column 7"/>
<DataGridTemplateColumn Header = "Column 8"/>
<DataGridTemplateColumn Header = ""/>
</Datagrid>
您可以使用转换器来实现:
class VisibilityToBooleanConverter : IValueConverter
{
public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
Visibility visibility = (Visibility)value;
return visibility == Visibility.Visible;
}
public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
bool b = (bool)value;
return b ? Visibility.Visible : Visibility.Hidden;
}
}
...和一些 XAML 标记:
<DataGridTemplateColumn>
<DataGridTemplateColumn.Header>
<Grid Background="Gray" Width="25" Height="25"
Tag="{Binding Columns, ElementName=MyGrid}">
<Grid.ContextMenu>
<ContextMenu ItemsSource="{Binding PlacementTarget.Tag, RelativeSource={RelativeSource Self}}">
<ContextMenu.ItemTemplate>
<DataTemplate>
<CheckBox x:Name="chk">
<CheckBox.IsChecked>
<Binding Path="Visibility">
<Binding.Converter>
<local:VisibilityToBooleanConverter />
</Binding.Converter>
</Binding>
</CheckBox.IsChecked>
<CheckBox.Content>
<TextBlock Text="{Binding Header}" />
</CheckBox.Content>
</CheckBox>
<DataTemplate.Triggers>
<!-- hide the last column in the ContentMenu-->
<DataTrigger Binding="{Binding DisplayIndex}" Value="5">
<Setter TargetName="chk" Property="Visibility" Value="Collapsed" />
</DataTrigger>
</DataTemplate.Triggers>
</DataTemplate>
</ContextMenu.ItemTemplate>
</ContextMenu>
</Grid.ContextMenu>
</Grid>
</DataGridTemplateColumn.Header>
</DataGridTemplateColumn>
将示例标记中的 Grid
替换为汉堡包按钮或您希望用户单击以显示 ContextMenu
.
的任何元素
您可以使用以下内容:
<Expander Grid.Column="0" ExpandDirection="Right" Width="auto" IsExpanded="false" Header="Options" Background="#ececec" Padding="5">
<StackPanel>
<Label Content="Columns:" FontWeight="SemiBold" />
<ItemsControl ItemsSource="{Binding ElementName=DataGridName, Path=Columns}" Grid.IsSharedSizeScope="True" Margin="5">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel Orientation="Vertical" />
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition SharedSizeGroup="A"/>
<ColumnDefinition SharedSizeGroup="B"/>
</Grid.ColumnDefinitions>
<TextBlock Text="{Binding Header}" Margin="20, 5, 5, 0"/>
<CheckBox Grid.Column="1" IsChecked="{Binding Visibility, Converter=cnv:CustomVisibilityToBool CollapsedValue=False, VisibleValue=True}}"
Margin="5" HorizontalAlignment="Center" VerticalAlignment="Center"/>
</Grid>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</StackPanel>
</Expander>
转换器:
class CustomVisibilityToBool : MarkupExtension, IValueConverter
{
public bool VisibleValue { get; set; }
public bool CollapsedValue { get; set; }
public bool HiddenValue { get; set; }
public override object ProvideValue(IServiceProvider serviceProvider)
{
return this;
}
public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
{
if ((value as Visibility?) == Visibility.Visible) return VisibleValue;
else if ((value as Visibility?) == Visibility.Hidden) return HiddenValue;
else if ((value as Visibility?) == Visibility.Collapsed) return CollapsedValue;
return Binding.DoNothing;
}
public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
if ((value as bool?) == VisibleValue) return Visibility.Visible;
else if ((value as bool?) == HiddenValue) return Visibility.Hidden;
else if ((value as bool?) == CollapsedValue) return Visibility.Collapsed;
return Binding.DoNothing;
}
}
如果您将其放在 DataGrid
旁边,将如下所示:
如何在 DataGrid 的最后一个数据列上放置上下文菜单,以便它可以控制其他列的可见性。
我有一个总共有 8 列的数据网格。如何在最后一列放置上下文菜单? 需要了解是否存在从上下文菜单中控制其他列的可见性的可能性(如下图所示)?
<DataGrid x:Name="MyGrid" ItemsSource="{Binding obvCollection}" AutoGenerateColumns="False" >
<DataGridTemplateColumn Header = "Column 1"/>
<DataGridTemplateColumn Header = "Column 2"/>
<DataGridTemplateColumn Header = "Column 3"/>
<DataGridTemplateColumn Header = "Column 4"/>
<DataGridTemplateColumn Header = "Column 5"/>
<DataGridTemplateColumn Header = "Column 6"/>
<DataGridTemplateColumn Header = "Column 7"/>
<DataGridTemplateColumn Header = "Column 8"/>
<DataGridTemplateColumn Header = ""/>
</Datagrid>
您可以使用转换器来实现:
class VisibilityToBooleanConverter : IValueConverter
{
public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
Visibility visibility = (Visibility)value;
return visibility == Visibility.Visible;
}
public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
bool b = (bool)value;
return b ? Visibility.Visible : Visibility.Hidden;
}
}
...和一些 XAML 标记:
<DataGridTemplateColumn>
<DataGridTemplateColumn.Header>
<Grid Background="Gray" Width="25" Height="25"
Tag="{Binding Columns, ElementName=MyGrid}">
<Grid.ContextMenu>
<ContextMenu ItemsSource="{Binding PlacementTarget.Tag, RelativeSource={RelativeSource Self}}">
<ContextMenu.ItemTemplate>
<DataTemplate>
<CheckBox x:Name="chk">
<CheckBox.IsChecked>
<Binding Path="Visibility">
<Binding.Converter>
<local:VisibilityToBooleanConverter />
</Binding.Converter>
</Binding>
</CheckBox.IsChecked>
<CheckBox.Content>
<TextBlock Text="{Binding Header}" />
</CheckBox.Content>
</CheckBox>
<DataTemplate.Triggers>
<!-- hide the last column in the ContentMenu-->
<DataTrigger Binding="{Binding DisplayIndex}" Value="5">
<Setter TargetName="chk" Property="Visibility" Value="Collapsed" />
</DataTrigger>
</DataTemplate.Triggers>
</DataTemplate>
</ContextMenu.ItemTemplate>
</ContextMenu>
</Grid.ContextMenu>
</Grid>
</DataGridTemplateColumn.Header>
</DataGridTemplateColumn>
将示例标记中的 Grid
替换为汉堡包按钮或您希望用户单击以显示 ContextMenu
.
您可以使用以下内容:
<Expander Grid.Column="0" ExpandDirection="Right" Width="auto" IsExpanded="false" Header="Options" Background="#ececec" Padding="5">
<StackPanel>
<Label Content="Columns:" FontWeight="SemiBold" />
<ItemsControl ItemsSource="{Binding ElementName=DataGridName, Path=Columns}" Grid.IsSharedSizeScope="True" Margin="5">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel Orientation="Vertical" />
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition SharedSizeGroup="A"/>
<ColumnDefinition SharedSizeGroup="B"/>
</Grid.ColumnDefinitions>
<TextBlock Text="{Binding Header}" Margin="20, 5, 5, 0"/>
<CheckBox Grid.Column="1" IsChecked="{Binding Visibility, Converter=cnv:CustomVisibilityToBool CollapsedValue=False, VisibleValue=True}}"
Margin="5" HorizontalAlignment="Center" VerticalAlignment="Center"/>
</Grid>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</StackPanel>
</Expander>
转换器:
class CustomVisibilityToBool : MarkupExtension, IValueConverter
{
public bool VisibleValue { get; set; }
public bool CollapsedValue { get; set; }
public bool HiddenValue { get; set; }
public override object ProvideValue(IServiceProvider serviceProvider)
{
return this;
}
public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
{
if ((value as Visibility?) == Visibility.Visible) return VisibleValue;
else if ((value as Visibility?) == Visibility.Hidden) return HiddenValue;
else if ((value as Visibility?) == Visibility.Collapsed) return CollapsedValue;
return Binding.DoNothing;
}
public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
if ((value as bool?) == VisibleValue) return Visibility.Visible;
else if ((value as bool?) == HiddenValue) return Visibility.Hidden;
else if ((value as bool?) == CollapsedValue) return Visibility.Collapsed;
return Binding.DoNothing;
}
}
如果您将其放在 DataGrid
旁边,将如下所示: