如何在MVVM WPF中对组合框项进行分组

时间:2014-11-12 16:55:07

标签: c# wpf

在我的主视图模型中,我有人员列表

class MainViewModel
{
    publc List<People> PeopleList
    {
        get;
        set;
    }
}

并且每个人都有旅行方式

Class People
{
   public List<TravelMode> TravelModes
    {
     get;
      set;  
    }

    public string Name{get;set;}
}

Class TravelMode
{
  public string VehicleName{get;set;}  
}

这是XAML代码

<ComboBox ItemsSource="{Binding Path= PeopleList, Mode=TwoWay}   DisplayMemberPath="VehicleName"  >

现在组合框显示所有车辆数据 像这样

Car
Bike
Bus
Train

是否可以对组合框项目进行分组,如下所述。只需通过xaml中的数据绑定后面的任何代码?

John
-------Car
-------Bike
Jerry
-------Bus
-------Train

我怎么能这样做?

1 个答案:

答案 0 :(得分:0)

试试这个。但这实际上完全使用了树视图。因为当你在组合框内部使用组合框时,很难检测到你是在改变旅行节点,还是在你放下组合框时正在改变人。 MainViewModel.cs:

public class MainViewModel
{
    public List<People> PeopleList { get; set; }

    public MainViewModel() { GenerateList(); }

    public void GenerateList()
    {
        PeopleList = new List<People>();
        TravelNode car = new TravelNode { VehicleName = "Car" };
        TravelNode bus = new TravelNode { VehicleName = "Bus" };
        TravelNode bike = new TravelNode { VehicleName = "Bike" };
        TravelNode train = new TravelNode { VehicleName = "Train" };
        People john = new People();
        john.Name = "John";
        john.TravelNodes = new List<TravelNode>();
        john.TravelNodes.Add(car); john.TravelNodes.Add(bike);
        People jerry=new People();
        jerry.Name="Jerry";
        jerry.TravelNodes=new List<TravelNode>();
        jerry.TravelNodes.Add(bus); jerry.TravelNodes.Add(train);
        PeopleList.Add(john); PeopleList.Add(jerry);
    }
}
public class People
{
    public List<TravelNode> TravelNodes { get; set; }
    public string Name { get; set; }
}
public class TravelNode
{
    public string VehicleName { get; set; }
}

MainWindow.xaml.cs

public partial class MainWindow : Window
{
    MainViewModel viewmodel = new MainViewModel();
    public MainWindow()
    {
        InitializeComponent();
        this.DataContext = viewmodel;

    }
}

MainWindow.xaml

<Window x:Class="treeViewTest.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="350" Width="525">

<Grid>
    <TreeView ItemsSource="{Binding PeopleList}">
        <TreeView.ItemTemplate>
            <DataTemplate>
                <TreeViewItem ItemsSource="{Binding TravelNodes}" Header="{Binding Name}">
                    <TreeViewItem.ItemTemplate>
                        <DataTemplate>
                            <StackPanel Orientation="Vertical">
                                <TextBlock Text="{Binding VehicleName}"></TextBlock>
                            </StackPanel>
                        </DataTemplate>
                    </TreeViewItem.ItemTemplate>
                </TreeViewItem>
            </DataTemplate>
        </TreeView.ItemTemplate>
    </TreeView>
</Grid>

如果选择不是很重要,但你只想在组合框中使用组合框来显示人物和旅行节点,那么你将改变MainWindow.xaml,如下所示

<Window x:Class="treeViewTest.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="350" Width="525">

<StackPanel>

    <ComboBox ItemsSource="{Binding PeopleList}" SelectedIndex="0">
        <ComboBox.ItemTemplate>
            <DataTemplate>
                <StackPanel Orientation="Vertical">
                    <TextBlock Text="{Binding Name}">    
                    </TextBlock>
                    <ComboBox ItemsSource="{Binding TravelNodes}" >
                        <ComboBox.ItemTemplate>
                            <DataTemplate>
                                <TextBlock Text="{Binding VehicleName}"/>
                            </DataTemplate>
                        </ComboBox.ItemTemplate>
                    </ComboBox>
                </StackPanel>
            </DataTemplate>
        </ComboBox.ItemTemplate>
    </ComboBox>
</StackPanel>