WPF DataGrid: привязка видимости DataGridColumn к ContextMenu MenuItems IsChecked (MVVM)

Question

WPF DataGrid: привязка видимости DataGridColumn к ContextMenu MenuItems IsChecked (MVVM)

Я хочу контролировать DataGrid видимость столбца через ContextMenu доступно для пользователя, щелкнув правой кнопкой мыши заголовок столбца. ContextMenu отображает имена всех доступных столбцов. Я использую шаблон проектирования MVVM.

Мой вопрос: как мне связать DataGridColumn"s Visibility собственность на IsChecked свойство MenuItem расположенный в ContextMenu,

Некоторый макет кода:

<UserControl.Resources>         
    <ContextMenu x:Key="ColumnHeaderContextMenu">  
        <MenuItem Header="Menu Item..1" IsCheckable="True" />  
    </ContextMenu>  
    <Style x:Key="ColumnHeaderStyle" 
           TargetType="{x:Type toolkit:DataGridColumnHeader}">  
        <Setter Property="ContextMenu" 
                Value="{StaticResource ColumnHeaderContextMenu}" />  
    </Style>  
    <BooleanToVisibilityConverter x:Key="booleanToVisibilityConverter" />  
</UserControl.Resources>

... Flaf Flaf Flaf

<toolkit:DataGrid x:Name="MyGrid" AutoGenerateColumns="False" 
    ItemsSource="{Binding MyCollection, Mode=Default}" 
    EnableColumnVirtualization="True" IsReadOnly="True" 
    ColumnHeaderStyle="{StaticResource ColumnHeaderStyle}">  
    <toolkit:DataGrid.Columns>  
        <toolkit:DataGridTextColumn Binding="{Binding Path=MyEntry}" 
            Header="MyEntry" Visibility="{Binding IsChecked, Converter=
                {StaticResource booleanToVisibilityConverter}.... />
    </toolkit:DataGrid.Columns>     
</toolkit:DataGrid>

Если мне неясно, пожалуйста, дайте мне знать, и я постараюсь уточнить.

Ура,

11

wpf xaml mvvm binding datagrid

Источник

user181113 13 окт '09 в 15:12

6 ответов

Решение

Я искал общий, XAML (то есть, без кода), автоматический и простой пример контекстного меню выбора столбца, которое привязывается к заголовку столбца WPF DataGrid. Я прочитал буквально сотни статей, но ни одна из них, кажется, не делает абсолютно правильную вещь, или они не достаточно универсальны. Вот что я считаю лучшим комбинированным решением:

Сначала поместите их в словарь ресурсов. Я оставлю читателю в качестве упражнения написание конвертера Visibility/Boolean, чтобы флажки устанавливались, когда столбец виден, и наоборот. Обратите внимание, что, определив x:Shared="False" для ресурса контекстного меню, он получит специфичное для экземпляра состояние, что означает, что вы можете использовать этот единственный шаблон / ресурс для всех ваших таблиц данных, и они все будут поддерживать свое собственное состояние.

<Converters:VisiblityToInverseBooleanConverter x:Key="VisiblityToInverseBooleanConverter"/>

<ContextMenu x:Key="ColumnChooserMenu" x:Shared="False"
             DataContext="{Binding Path=PlacementTarget, RelativeSource={RelativeSource Self}}" 
             ItemsSource="{Binding Columns, RelativeSource={RelativeSource AncestorType={x:Type sdk:DataGrid}}}">
    <ContextMenu.ItemContainerStyle>
        <Style TargetType="MenuItem">
            <Setter Property="Header" Value="{Binding Header}"/>
            <Setter Property="AutomationProperties.Name" Value="{Binding Header}"/>
            <Setter Property="IsCheckable" Value="True" />
            <Setter Property="IsChecked" Value="{Binding Visibility, Mode=TwoWay, Converter={StaticResource VisiblityToInverseBooleanConverter}}" />
        </Style>
    </ContextMenu.ItemContainerStyle>
</ContextMenu>

<Style x:Key="ColumnHeaderStyle" TargetType="{x:Type Primitives:DataGridColumnHeader}">
    <Setter Property="ContextMenu" Value="{StaticResource ColumnChooserMenu}" />
</Style>

<ContextMenu x:Key="GridItemsContextMenu" >
    <MenuItem Header="Launch Do Some other action"/>
</ContextMenu>

Затем определите DataGrid следующим образом (где OrdersQuery - это некоторый источник данных, предоставляемый моделью представления):

<sdk:DataGrid ItemsSource="{Binding OrdersQuery}"
              AutoGenerateColumns="True" 
              ColumnHeaderStyle="{StaticResource ColumnHeaderStyle}"
              ContextMenu="{StaticResource GridItemsContextMenu}">

  <!-- rest of datagrid stuff goes here -->

</sdk:DataGrid>

Это даст вам следующее:

Контекстное меню, связанное с заголовками столбцов, которое действует как средство выбора столбцов.
Контекстное меню, привязанное к элементам в сетке (для выполнения действий над самими элементами - опять же, привязка действий является упражнением для читателя).

Надеюсь, это поможет людям, которые искали такой пример.

18

Источник

user399218 04 июл '12 в 12:20

Я знаю, что это немного старо. Но я пытался сделать это, и этот пост намного проще: http://iimaginec.wordpress.com/2011/07/25/binding-wpf-toolkit%E2%80%99s-datagridcolumn-to-a-viewmodel-datacontext-propogation-for-datagrid-columns-the-mvvm-way-to-interact-with-datagridcolumn/

Все, что вам нужно сделать, это установить DataContext для столбцов, а затем привязать Visibility к вашей ViewModel, как обычно!:) Просто и эффективно

6

Источник

user861371 25 июл '11 в 10:45

Хорошо, это было довольно упражнение для WPF n00b.

IanR спасибо за предложение, которое я использовал аналогичный подход, но он не займет у вас весь путь.

Вот то, что я придумал, если кто-то сможет найти более последовательный способ сделать это, я буду благодарен за любые комментарии:

Препятствия:

DataGridColumnHeader не поддерживает контекстное меню. Поэтому контекстное меню нужно применять как стиль.
Контекстное меню имеет свой собственный текстовый текст, поэтому мы должны использовать findancestor, чтобы связать его с текстовым текстом ViewModels.
ATM элемент управления DataGrid не выполняет синтаксический анализ своего текста данных со своими столбцами. Это может быть решено в codebehind, однако мы используем шаблон MVVM, поэтому я решил придерживаться подхода jamiers

Решение:

Поместите следующие два блока кода в Window.Resources

    <Style x:Key="ColumnHeaderStyle"
           TargetType="{x:Type toolkit:DataGridColumnHeader}">
        <Setter Property="ContextMenu" 
                Value="{StaticResource ColumnHeaderContextMenu}" />
    </Style>  

    <ContextMenu x:Key="ColumnHeaderContextMenu">
        <MenuItem x:Name="MyMenuItem"
                  IsCheckable="True"
                  IsChecked="{Binding DataContext.IsHidden, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type toolkit:DataGrid}}}"/>
    </ContextMenu>

Затем сетка данных выглядит примерно так в XAML

        <toolkit:DataGrid x:Name="MyGrid"
                          AutoGenerateColumns="False"
                          ItemsSource="{Binding SampleCollection, Mode=Default}"
                          EnableColumnVirtualization="True"
                          IsReadOnly="True"
                          ColumnHeaderStyle="{StaticResource ColumnHeaderStyle}">
            <toolkit:DataGrid.Columns>
                <toolkit:DataGridTextColumn Binding="{Binding Path=SamplingUser}"
                                            Header="{Binding (FrameworkElement.DataContext).IsHidden, RelativeSource={x:Static RelativeSource.Self}}"
                                            Visibility="{Binding (FrameworkElement.DataContext).IsHidden,
                                                RelativeSource={x:Static RelativeSource.Self},
                                                Converter={StaticResource booleanToVisibilityConverter}}"/>

Таким образом, свойство видимости в DataGridColumn и свойство ischeked связаны данными со свойством IsHidden в viewModel.

В ViewModel:

    public bool IsHidden
    {
        get { return isHidden; }
        set 
        { if (value != isHidden)
            {
                isHidden = value;
                OnPropertyChanged("IsHidden");
                OnPropertyChanged("IsVisible");
            }
        }
    }

Класс Helper, определенный Хаймером:

class DataGridSupport
{
    static DataGridSupport() 
    {

        DependencyProperty dp = FrameworkElement.DataContextProperty.AddOwner(typeof(DataGridColumn)); 
        FrameworkElement.DataContextProperty.OverrideMetadata ( typeof(DataGrid), new FrameworkPropertyMetadata(null, FrameworkPropertyMetadataOptions.Inherits, new PropertyChangedCallback(OnDataContextChanged)));

    }

    public static void OnDataContextChanged ( DependencyObject d, DependencyPropertyChangedEventArgs e)
    { 
        DataGrid grid = d as DataGrid ; 
        if ( grid != null  ) 
        {                 
            foreach ( DataGridColumn col in grid.Columns ) 
            { 
                col.SetValue ( FrameworkElement.DataContextProperty,  e.NewValue ); 
            } 
        } 
    }
}

Instanciated в viewmodel (просто чтобы показать, что сделано через Unity в реальном проекте)

    private static DataGridSupport dc = new DataGridSupport();

Ура,

1

Источник

user181113 16 окт '09 в 09:31

Вместо booleanToVisibilityConverter вы можете использовать x:static

<Setter TargetName="UIElement"  Property="UIElement.Visibility" Value="x:Static Visibility.Hidden" />

Статика в XAML: http://msdn.microsoft.com/en-us/library/ms742135.aspx

0

Источник

user312419 13 май '10 в 22:17

Я попытался получить это для привязки к ContextMenu, используя "ElementName", но, в конце концов, заставил его работать, используя свойства в виртуальной машине, например

bool _isHidden;
public bool IsHidden
{
  get { return _isHidden; }
  set
  {
    if (value != _isHidden)
    {
      _isHidden = value;
      RaisePropertyChanged("IsHidden");
      RaisePropertyChanged("IsVisible");
    }
  }
}

public Visibility IsVisible
{
  get { return IsHidden ? Visibility.Hidden : Visibility.Visible; }
}

и в XAML:

<Window.ContextMenu>
  <ContextMenu>
    <MenuItem Header="Hidden" IsCheckable="True" IsChecked="{Binding IsHidden}" />
  </ContextMenu>
</Window.ContextMenu>

<toolkit:DataGrid x:Name="MyGrid" AutoGenerateColumns="False" ItemsSource="{Binding MyCollection, Mode=Default}" EnableColumnVirtualization="True" IsReadOnly="True" ColumnHeaderStyle="{StaticResource ColumnHeaderStyle}">
  <toolkit:DataGrid.Columns>
    <toolkit:DataGridTextColumn Binding="{Binding Path=MyEntry}" Header="MyEntry" Visibility="{Binding Path=IsVisible, Mode=OneWay}" />
  </toolkit:DataGrid.Columns>
</toolkit:DataGrid>

-1

Источник

user163916 13 окт '09 в 20:30

Другие вопросы по тегам wpf xaml mvvm binding datagrid

user563264 11 янв '11 в 22:22 2011-01-11 22:22 · Accepted Answer · 2011-01-11 22:22

Я только что написал пост в блоге на эту тему. Он позволяет отображать или скрывать DataGridColumns через ContextMenu, доступ к которому можно получить, щелкнув правой кнопкой мыши любой заголовок столбца. Эта задача решается исключительно с помощью прикрепленных свойств, поэтому она совместима с MVVM.

Смотрите сообщение в блоге