WPF Treeview Databinding Hierarchal Data con tipos mixtos

hierarchical-data hierarchicaldatatemplate

Question

Tengo una situación algo compleja con WPF Treeview Binding. He pasado los últimos 2 días intentando Google, y this es el cierre que se me ocurrió, pero no resuelve el problema.

Aquí está la situación:

Tengo un objeto que se ve así:

public class Category
{
  public string Name { get; set; }
  public List<Category> Categories { get; set; }
  public List<Product> Products { get; set; }
}

public class Product
{
  public string Name { get; set;
}

Cada categoría puede tener una lista de objetos y categorías secundarias. Tengo una razón para hacer esto que tiene mucho sentido para mí y para la aplicación que estoy escribiendo.

La construcción real del objeto puede parecerse a algo como esto:

Category - Pharmacy
  |-Product - Aspirin
  |-Product - Tylenol
  |-Category - Tooth Paste
  |  |-Product - Crest
  |  |-Product - Colgate
  |-Category - Paper Products
   |-Category - Toilet Paper
   |  |-Product - NoName
   |  |-Product - Charmin
   |-Category - Facial Tissue
      |-Product - Kleenex
Category - Household
  |-Product - Pinesol Cleaner
  |-Product - Garbage Bags

Ahora, estoy tratando de relacionar esta relación con un árbol. Me gustaría que el TreeView se vea casi idéntico al constructo de objetos anterior.

Hasta ahora tengo mi XAML Treeview así:

  <TreeView x:Name="CategoryList" Margin="8" Grid.Row="2" Grid.RowSpan="2" ItemsSource="{Binding Path=Categories}">
            <TreeView.Resources>
                <HierarchicalDataTemplate DataType="{x:Type src:Category}" ItemsSource="{Binding Products}">
                    <StackPanel>
                        <TextBlock Text="{Binding Path=Name}" />
                    </StackPanel>
                </HierarchicalDataTemplate>
                <HierarchicalDataTemplate DataType="{x:Type src:Product}">
                    <StackPanel>
                        <TextBlock Text="{Binding Path=Name}" />
                    </StackPanel>
                </HierarchicalDataTemplate>
            </TreeView.Resources>
        </TreeView>

Esto funciona muy bien para la lista principal de categorías, y cada uno de sus subproductos. Pero no profundiza y muestra las subcategorías de cada categoría.

¿Hay alguna forma de hacerlo directamente con las plantillas para que cada elemento (categoría o producto) esté seleccionado? Estoy usando un patrón MVVM y no quiero recurrir al uso del código, pero lo haré si es necesario.

Answer 1

Dado que desea que los elementos en TreeView tengan una lista de elementos secundarios que consta de ambos Productos de Categorías, querrá que su Categoría ViewModel tenga una colección que consta de Categorías y Productos. Por ejemplo, podría usar CompositeCollection para combinar sus colecciones existentes:

public class Category
{
    public string Name { get; set; }
    public List<Category> Categories { get; set; }
    public List<Product> Products { get; set; }

    public IList Children
    {
        get
        {
            return new CompositeCollection()
            {
                new CollectionContainer() { Collection = Products },
                new CollectionContainer() { Collection = Categories }
            };
        }
    }
}

(En el código real, es probable que desee mantener una referencia al mismo objeto de colección en lugar de crear uno nuevo cada vez).

Luego, en su HierarchicalDataTemplate, use la lista combinada como ItemsSource:

<HierarchicalDataTemplate DataType="{x:Type src:Category}"
                          ItemsSource="{Binding Children}">

Los artículos serán una mezcla de objetos de Producto y Categoría, y WPF usará el DataTemplate apropiado para cada uno.