Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How do I display the property name in the group header in wpf

<!-- GroupHeaderStyle -->
<Style x:Key="GroupHeaderStyle" TargetType="{x:Type GroupItem}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type GroupItem}">
                <Expander IsExpanded="False" Margin="15,0,0,0">
                    <Expander.Header>
                        <StackPanel Orientation="Horizontal">
                            <TextBlock Text="{Binding ????????????}"/>
                            <TextBlock Text="-->"/>
                            <TextBlock Text="{Binding Name}"/>
                        </StackPanel>
                    </Expander.Header>
                    <ItemsPresenter />
                </Expander>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

In the above code I wish to display the property name by which it is grouped. E.g. Gender --> Boy ; Gender --> Girl.

public class Test
{
    string gender;
    public string Gender
    {
        get { return gender; }
        set { gender = value; }
    } 
}

What should i provide for ???????????? in the above xaml?

Also, please let me know if there is any good book or link which explains the internal details of grouping in ListCollectionView.

like image 930
Sudhakar Singh Avatar asked Nov 04 '22 13:11

Sudhakar Singh


1 Answers

The DataContext should be an instance of CollectionViewGroup, which will have it's Name property set to the "group" (i.e. the value of Gender). But there is no correlation between the CollectionViewGroup and what property it came from. Technically, the property could be multiple levels deep.

The only good alternative is to sort on another property that has all the information you need. The CollectionViewGroup.Name property is an object, not a string. So you could do something like:

public class GenderGroup {

    public GenderGroup(string gender) {
        this.Gender = gender;
    }

    public string Gender { get; private set; }
    public string Title {
        get {
            return "Gender";
        }
    }

    public override bool Equals(object obj) {
        var other = obj as GenderGroup;
        return (other != null && string.Equals(this.Gender, other.Gender));
    }
}

public class Test {
    string gender;
    GenderGroup genderGroup = new GenderGroup("none");

    public string Gender {
        get { return gender; }
        set {
            gender = value;
            genderGroup = new GenderGroup(gender);
        }
    } 

    public GenderGroup GenderGroup {
        get { return genderGroup; }
    }

}

And then access it like this:

<!-- GroupHeaderStyle -->
<Style x:Key="GroupHeaderStyle" TargetType="{x:Type GroupItem}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type GroupItem}">
                <Expander IsExpanded="False" Margin="15,0,0,0">
                    <Expander.Header>
                        <StackPanel Orientation="Horizontal">
                            <TextBlock Text="{Binding Name.Title}"/>
                            <TextBlock Text="-->"/>
                            <TextBlock Text="{Binding Name.Gender}"/>
                        </StackPanel>
                    </Expander.Header>
                    <ItemsPresenter />
                </Expander>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

That's the basic idea, but you could make GenderGroup more generic. So instead of hard-coding "Gender" you could pass that has a parameter.

like image 163
CodeNaked Avatar answered Nov 15 '22 08:11

CodeNaked