集合集合的网格视图或ListView绑定或渲染 [英] Grid View or ListView Binding or Rendering of Collection of Collection

问题描述

XAML和WPF的完整新蜜蜂从MVC 1周后转移

要求：

显示客户名称和所有相应的品牌

Display Customer Name and all corresponding Brands

1客户可以拥有许多品牌

1 Customer can have Many Brands

问题

无法显示相应的品牌

参考

类似的SO线程

代码

public partial class MainWindow : Window
{

    public MainWindow()
    {
        DataContext = new MyDeviceList();
        InitializeComponent();
    }
}

public class MyDeviceList
{
    Entities ent = new Entities();
    public ObservableCollection<myCustomers> Customers { get; set; }

    public void GetCustomersBrand()
    {
        var custall = (from c in ent.Customers
                    select new myCustomers{ name = c.Name, brands = c.Brands.ToList() }).ToList();

        Customers = new ObservableCollection<myCustomers>(custall);

    }

    public MyDeviceList()
    {
        GetCustomersBrand();
    }
}

//just a dummy class
public class Brand
{
    public string Name { get; set; }
    public int Customerid { get; set; }
}


public class myCustomers
{
    public string name { get; set; }
    public List<Brand> brands { get; set; }
}   

XAML

<Window x:Class="DeviceListCreate.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:my="clr-namespace:DeviceListCreate"
    Title="MainWindow" WindowState="Maximized">

<Window.Resources>
    <DataTemplate x:Key="GroupTemplate" DataType="{x:Type my:myCustomers}">
        <ItemsControl ItemsSource="{Binding brands}">
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <TextBlock Text="{Binding name}"/>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
        </ItemsControl>
    </DataTemplate>
</Window.Resources>
<Grid>

    <ItemsControl ItemsSource="{Binding Customers}" Name="tStack" Grid.Column="0" Margin="33,10,42,10">
        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                <WrapPanel/>
            </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <Grid>
                    <TextBlock Text="{Binding name}"/>                      
                </Grid>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>
</Grid>

请指导我应该现在要走了

Kindly guide which direction I should be heading now

提前感谢

推荐答案

构建UI像这样，你只需要逐个构建它。单独集中每个部分使整个任务更易于管理。尝试这样：

When constructing a UI like this, you just have to build it up part by part. Concentrating on each part individually makes the whole task more manageable. Try this:

<Grid>
    <ItemsControl ItemsSource="{Binding Customers}">
        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                <WrapPanel />
            </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <Border CornerRadius="5" BorderBrush="RoyalBlue" BorderThickness="1" 
                    Padding="5" Margin="5">
                    <StackPanel Orientation="Horizontal">
                        <TextBlock Text="{Binding name}" Margin="5" />
                        <ItemsControl ItemsSource="{Binding brands}">
                            <ItemsControl.ItemsPanel>
                                <ItemsPanelTemplate>
                                    <StackPanel Orientation="Horizontal" />
                                </ItemsPanelTemplate>
                            </ItemsControl.ItemsPanel>
                            <ItemsControl.ItemTemplate>
                                <DataTemplate>
                                    <CheckBox Content="{Binding name}" Margin="5" />
                                </DataTemplate>
                            </ItemsControl.ItemTemplate>
                        </ItemsControl>
                    </StackPanel>
                </Border>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>
</Grid>

这篇关于集合集合的网格视图或ListView绑定或渲染的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！