Forums Ultimate UI for WPF
Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
Close
Ed Beaty
390
LabelPresenterStyle with the FieldChooser
posted

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");
            }
        }
    }
}

Parents
  • 17475
    Offline posted

    Hello Ed, 

    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.

     

  • 390
    posted in reply to Maria Tsvyatkova

    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?

    Thanks,

    Ed

    ============

    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>

Reply Children
No Data