Hello. I'm assigning a LabelPresenterStyle to one of my Fields in an XamDataGrid (the field displays a selection checkbox, so I want my label to display a "select all/unselect all" checkbox). This works fine, but the problem is when I display the FieldChooser, I want to show the name of the field; instead the FieldChooser shows my LabelPresenterStyle checkbox.
Is there a way to tell the FieldChooser to display the field as the normal text label instead?
Thanks,
Ed
[EDIT: Forgot the codebehind for the MainWindow.xaml.]
===============
<Window x:Class="WpfApplication1.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:igWPF="http://schemas.infragistics.com/xaml/wpf" xmlns:igEditors="http://infragistics.com/Editors" xmlns:igControls="http://schemas.infragistics.com/xaml/con" xmlns:igWindows="http://infragistics.com/Windows" xmlns:local="clr-namespace:WpfApplication1" Title="MainWindow" Height="350" Width="525"> <Window.Resources> <ResourceDictionary> <Style TargetType="{x:Type igWPF:LabelPresenter}" x:Key="SelectAllCheckbox"> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type igWPF:LabelPresenter}"> <CheckBox HorizontalAlignment="Center" IsThreeState="True" VerticalAlignment="Center" Click="CheckBox_Click_1" IsChecked="{Binding Path=DataPresenter.DataContext.EveryoneHired}" /> </ControlTemplate> </Setter.Value> </Setter> </Style> </ResourceDictionary> </Window.Resources> <Grid> <Grid.RowDefinitions> <RowDefinition Height="*" /> <RowDefinition Height="20" /> </Grid.RowDefinitions> <igWPF:XamDataGrid x:Name="DataGrid" DataSource="{Binding Employees}" > <igWPF:XamDataGrid.FieldLayoutSettings> <igWPF:FieldLayoutSettings AutoGenerateFields="False" HeaderPrefixAreaDisplayMode="FieldChooserButton"> </igWPF:FieldLayoutSettings> </igWPF:XamDataGrid.FieldLayoutSettings> <igWPF:XamDataGrid.FieldLayouts> <igWPF:FieldLayout> <igWPF:FieldLayout.Fields> <igWPF:Field Name="Name" Label="Name" Width="Auto"/> <igWPF:Field Name="Age" Label="Age" Width="Auto"/> <igWPF:Field Name="Hired" Width="Auto" Label="Hired"> <igWPF:Field.Settings> <igWPF:FieldSettings LabelPresenterStyle="{StaticResource SelectAllCheckbox}"> <igWPF:FieldSettings.EditorStyle> <Style TargetType="{x:Type igEditors:XamCheckEditor}"> <EventSetter Event="ValueChanged" Handler="ValueChanged"/> </Style> </igWPF:FieldSettings.EditorStyle> </igWPF:FieldSettings> </igWPF:Field.Settings> </igWPF:Field> </igWPF:FieldLayout.Fields> </igWPF:FieldLayout> </igWPF:XamDataGrid.FieldLayouts> </igWPF:XamDataGrid> </Grid></Window>
using Infragistics.Windows.DataPresenter;using Infragistics.Windows.Editors;using System;using System.Collections.Generic;using System.Windows;using System.Windows.Controls;namespace WpfApplication1{ ///
/// Interaction logic for MainWindow.xaml /// public partial class MainWindow : Window { public MainWindow() { InitializeComponent(); InitData(); } public Company Company { get; set; } public void InitData() { Company = new Company(); Company.AddEmployee(new Employee { Name = "ann", Age = 30, Hired = true }); Company.AddEmployee(new Employee { Name = "bob", Age = 40, Hired = false }); Company.AddEmployee(new Employee { Name = "carl", Age = 50, Hired = true }); Company.AddEmployee(new Employee { Name = "dave", Age = 60, Hired = true }); this.DataContext = Company; } void ValueChanged(object sender, RoutedPropertyChangedEventArgs
================
using Microsoft.Practices.Prism.ViewModel;using System;using System.Collections.Generic;using System.Linq;using System.Text;using System.Threading.Tasks;namespace WpfApplication1{ public class Company : NotificationObject { public Company(){ Employees = new List(); } public List Employees { get; set; } public void AddEmployee(Employee employee) { Employees.Add(employee); employee.PropertyChanged += OnEmployeeChanged; RaisePropertyChanged("Employees"); } private void OnEmployeeChanged(object sender, System.ComponentModel.PropertyChangedEventArgs e) { if (e.PropertyName.Equals("Hired")) { RaisePropertyChanged("EveryoneHired"); } } public bool? EveryoneHired { //Returns true if all the employees are hired, false if none of them are hired, or null (indeterminate) otherwise. get { Employee first = Employees.FirstOrDefault(); if (first != null) { if (Employees.All(employee => employee.Hired == first.Hired)) { return first.Hired; } } return null; } set { //The "select all" checkbox is three-state, so handle the "null" case. bool newValue = value ?? false; //If all items are already selected or deselected, toggle their state. bool? everyoneHired = EveryoneHired; if (everyoneHired == newValue) { newValue = !newValue; } Employees.ForEach(employee => employee.Hired = newValue); } } }}
==================
using Microsoft.Practices.Prism.ViewModel;using System;using System.Collections.Generic;using System.Linq;using System.Text;using System.Threading.Tasks;namespace WpfApplication1{ public class Employee : NotificationObject { public string Name { get; set; } public int Age { get; set; } private bool _hired; public bool Hired { get { return _hired; } set { _hired = value; RaisePropertyChanged("Hired"); } } }}
Hello Ed,
I am just checking your progress on the issue.
If you require any further assistance, please do not hesitate to ask.
In order to keep the functionality and visual representation of the FieldChooserEntry, the default style of the FieldChooser could be changed. This style is located in the DataPresenterGeneric_Express.xaml file (C:\Program Files (x86)\Infragistics\NetAdvantage 2012.2\WPF\DefaultStyles\DataPresenter). The Field property of the LabelPresenter could be bound to Field.Name and a TextBlock (“DisplayedText”) is added as content which is also bound to Field.Name property.
I used the provided code snippets to create a sample project with this functionality. Feel free to let me know whether it helps you in resolving your issue.
Thanks for your reply. I understand that modifying the LabelTemplate applies the same style to both the column header in the XamDataGrid and to the FieldChooserEntry in the FieldChooser, which is usually fine. In my case, I would like the two components to have different styles: the column header of the grid should be a "select all" checkbox, while the FieldChooserEntry should just display some text (i.e. "display the select all field?").
I found one of your examples for modifying the FieldChooserEntry with a DataTemplate. My first thought was to replace the LabelPresenter with a simple Label that just displays the field name; however this eliminates the useful "IsSelectedInFieldChooser" property of LabelPresenter, so the rows of the FieldChooser aren't highlighted when selected. I could add back some Triggers to achieve this, but...it just seems like I'm applying a VERY complex DataTemplate to accomplish this. Is there a simpler way of injecting a "just show the field name for each row" style into the FieldChooserEntry, than the method shown in your example?
============
I've stripped down my original, overcomplex example to a single xaml file to better illustrate the problem. It uses the "BindToSampleData" data, and just adds a checkbox column which isn't bound to any real data.
<Window x:Class="WpfApplication3.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:igWPF="http://schemas.infragistics.com/xaml/wpf" xmlns:igDP="http://schemas.infragistics.com/xaml/wpf" xmlns:igEditors="http://infragistics.com/Editors" xmlns:igControls="http://schemas.infragistics.com/xaml/con" xmlns:igWindows="http://infragistics.com/Windows" xmlns:local="clr-namespace:WpfApplication3" Title="MainWindow" Height="350" Width="525"> <Window.Resources> <ResourceDictionary> <Style TargetType="{x:Type igWPF:LabelPresenter}" x:Key="SelectAllCheckbox"> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type igWPF:LabelPresenter}"> <CheckBox HorizontalAlignment="Center" IsThreeState="True" VerticalAlignment="Center" /> </ControlTemplate> </Setter.Value> </Setter> </Style> </ResourceDictionary> </Window.Resources> <Grid> <igWPF:XamDataGrid x:Name="DataGrid" BindToSampleData="True" > <igWPF:XamDataGrid.FieldLayoutSettings> <igWPF:FieldLayoutSettings AutoGenerateFields="False" HeaderPrefixAreaDisplayMode="FieldChooserButton" /> </igWPF:XamDataGrid.FieldLayoutSettings> <igWPF:XamDataGrid.FieldLayouts> <igWPF:FieldLayout> <igWPF:FieldLayout.Fields> <igWPF:Field Name="Hired" Width="Auto" Label="Hired"> <igWPF:Field.Settings> <igWPF:FieldSettings LabelPresenterStyle="{StaticResource SelectAllCheckbox}"> <igWPF:FieldSettings.EditorStyle> <Style TargetType="{x:Type igEditors:XamCheckEditor}" /> </igWPF:FieldSettings.EditorStyle> </igWPF:FieldSettings> </igWPF:Field.Settings> </igWPF:Field> </igWPF:FieldLayout.Fields> </igWPF:FieldLayout> </igWPF:XamDataGrid.FieldLayouts> </igWPF:XamDataGrid> </Grid></Window>
===========
Here's a clumsy attempt at applying the custom DataTemplate from your example; note that row highlighting no longer works (also, there's lots of parts of the DataTemplate that I don't understand, so I just left in place. :)
<Window x:Class="WpfApplication3.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:igWPF="http://schemas.infragistics.com/xaml/wpf" xmlns:igDP="http://schemas.infragistics.com/xaml/wpf" xmlns:igEditors="http://infragistics.com/Editors" xmlns:igControls="http://schemas.infragistics.com/xaml/con" xmlns:igWindows="http://infragistics.com/Windows" xmlns:local="clr-namespace:WpfApplication3" Title="MainWindow" Height="350" Width="525"> <Window.Resources> <ResourceDictionary> <Style TargetType="{x:Type igWPF:LabelPresenter}" x:Key="SelectAllCheckbox"> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type igWPF:LabelPresenter}"> <CheckBox HorizontalAlignment="Center" IsThreeState="True" VerticalAlignment="Center" /> </ControlTemplate> </Setter.Value> </Setter> </Style> </ResourceDictionary> </Window.Resources> <Grid> <igWPF:XamDataGrid x:Name="DataGrid" BindToSampleData="True" > <igWPF:XamDataGrid.Resources> <Style TargetType="{x:Type igDP:FieldChooser}"> <Style.Resources> <!--Represents a field in the field chooser.--> <DataTemplate DataType="{x:Type igDP:FieldChooserEntry}"> <DockPanel> <igEditors:XamCheckEditor x:Name="checkBox" DockPanel.Dock="Left" IsThreeState="false" Value="{Binding Path=IsVisible, Mode=TwoWay}" /> <Label Content="{Binding Path=Field.Name}" /> </DockPanel> </DataTemplate> </Style.Resources> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type igDP:FieldChooser}"> <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Padding="{TemplateBinding Padding}" SnapsToDevicePixels="true" > <Grid> <Grid.RowDefinitions> <RowDefinition Height="Auto" /> <RowDefinition Height="*" /> </Grid.RowDefinitions> <DockPanel Visibility="{TemplateBinding FieldGroupSelectorVisibilityResolved}" > <igEditors:XamCheckEditor x:Name="toggleAllCheckBox" DockPanel.Dock="Left" IsThreeState="false" Value="{Binding Path=AllCurrentFieldsVisible, RelativeSource={x:Static RelativeSource.TemplatedParent}, Mode=TwoWay}" Margin="4,0,0,0" /> <!--Combo editor that has list of field layouts in its drop-down.--> <igEditors:XamComboEditor x:Name="fieldGroupSelector" DockPanel.Dock="Right" ItemsSource="{TemplateBinding FieldGroups}" ValueType="{x:Type igDP:FieldChooserGroup}" DisplayValueSource="Value" Value="{Binding Path=CurrentFieldGroup, RelativeSource={x:Static RelativeSource.TemplatedParent}, Mode=TwoWay}" HorizontalAlignment="Stretch" /> </DockPanel> <igWindows:CardPanel Grid.Row="1"> <!--List box that displays the fields--> <ListBox x:Name="fieldsListBox" ItemsSource="{TemplateBinding CurrentFields}" SelectionMode="Single" SelectedItem="{Binding Path=SelectedField, RelativeSource={x:Static RelativeSource.TemplatedParent}, Mode=TwoWay}" HorizontalContentAlignment="Stretch" > </ListBox> <Border x:Name="highlightBorder" BorderThickness="2" BorderBrush="Transparent" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" /> </igWindows:CardPanel> </Grid> </Border> </ControlTemplate> </Setter.Value> </Setter> </Style> </igWPF:XamDataGrid.Resources> <igWPF:XamDataGrid.FieldLayoutSettings> <igWPF:FieldLayoutSettings AutoGenerateFields="False" HeaderPrefixAreaDisplayMode="FieldChooserButton" /> </igWPF:XamDataGrid.FieldLayoutSettings> <igWPF:XamDataGrid.FieldLayouts> <igWPF:FieldLayout> <igWPF:FieldLayout.Fields> <igWPF:Field Name="Hired" Width="Auto" Label="Hired"> <igWPF:Field.Settings> <igWPF:FieldSettings LabelPresenterStyle="{StaticResource SelectAllCheckbox}"> <igWPF:FieldSettings.EditorStyle> <Style TargetType="{x:Type igEditors:XamCheckEditor}" /> </igWPF:FieldSettings.EditorStyle> </igWPF:FieldSettings> </igWPF:Field.Settings> </igWPF:Field> </igWPF:FieldLayout.Fields> </igWPF:FieldLayout> </igWPF:XamDataGrid.FieldLayouts> </igWPF:XamDataGrid> </Grid></Window>
Thank you for posting.
FieldChooser allows the user to customize which fields are displayed in the grid. The values that are shown in the FieldChooser correspond to the values of the fields’ labels so it is easier for the user to know which element from the chooser fits to which field of the grid. When the LabelTemplate is changed the items of the chooser are changed accordingly. Here more information regarding the Field Chooser class could be found: http://help.infragistics.com/Help/NetAdvantage/WPF/2012.2/CLR4.0/html/xamDataPresenter_About_the_Field_Chooser.html
Please feel free to ask if you have any questions.