Question

XAML和WPF中的一个完整的新蜜蜂从MVC转回1周

要求：

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

1客户可以拥有多个品牌

问题

无法显示相应的品牌

参考

Similar SO Thread

代码

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>

请指导我现在应该走向哪个方向

提前致谢

Answer 1

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

<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绑定或集合的渲染

1 个答案: