CODEWITHSUNDEEP
c#wpftreeview
Niklas Gschaider
Niklas Gschaider

Reputation: 126

WPF - Categorized ListView

Data Types

My MainWindow has a property called Project project which has a property ObservableCollection<Drawable> Drawables

public class Drawable {
    public enum DrawableType { Top, Head, Feet };

    public bool IsMale {get; set;}
    public bool IsFemale {get; set;}
    public DrawableType DrawableType {get; set;}

    public string DisplayName {get; set;}
}

For all Data types and properties I properly implemented the INotifyPropertyChanged interface.

Current situation

The ObservableCollection is displayed in a ListView but as it contains up to about 500 items it is hard to use the application. I would like to display the items in a TreeView-like structure categorized by the gender (IsMale, IsFemale) and the DrawableType like this:

In this example Drawable 2 has IsFemale=true, the others have false.

My problem

During research I found that ListView actually supports grouping but I don't think this is what I want as a single instance of Drawable can be a children of up to two nodes (as with Drawable 2 belongs both to Male->Top and Female->Top)

What I have tried

I tried using a TreeView which provides all the visuals I need for this task but I can not get it to categorize the Drawable instances. I tried subscribing to the PropertyChanged and CollectionChanged events to create an ObservableCollection in order to create a structure that I can directly bind the TreeView to:

public class DrawableListEntry : INotifyPropertyChanged {
    public enum Sex {Male, Female}

    public Drawable Drawable;
    public DrawableType DrawableType = DrawableType.None;
    public Sex Sex = Sex.None;

    public string Label {
        get {
            if(Drawable != null) { return Drawable.DisplayName; }
            if(DrawableType != null) { return DrawableType.ToString(); }
            return Sex.ToString();
        }
    }

    public ObservableCollection<DrawableListEntry> Children {get; set;}
}

My Question

Is it possible to directly bind to the ObservableCollection and let a TreeView do the categorization automatically?

Please keep in mind, that I'm currently not adhering to any patterns like MVVM but I try to keep my business logic apart from the UI.

Upvotes: 0

Views: 67

Answers (1)

mm8
mm8

Reputation: 169420

During research I found that ListView actually supports grouping but I don't think this is what I want as a single instance of Drawable can be a children of up to two nodes (as with Drawable 2 belongs both to Male->Top and Female->Top)

Create a DrawableViewModel class with Gender, DrawableType and DisplayName properties and then add an instance of this class for each leaf entry that you want to display in the grouped ListView.

In this particular example you will then end up with a source collection of four items; Drawable 1, Drawable 2, Drawable 3 and another Drawable 2 (with the Gender property set to Female unlike the first one).

In other words, you should use the MVVM design pattern to basically transform your data model into something that works with the ListView control in the view.

Upvotes: 1

Related Questions