换行分组ListBoxItems(Stackpanel问题)

时间:2016-07-17 19:01:32

标签: c# .net wpf vb.net listboxitem

我正在尝试将分组列表框项目包装在列表框中。我在一个wrappanel中使用一个stackpanel来完成这个,但问题是在列表框中选择了stackpanel,导致问题。以下是问题的一个示例:

Example of issue
这是我的代码,简化:

<ListBox>
    <ListBox.ItemsPanel>
        <ItemsPanelTemplate>
            <WrapPanel ItemWidth="120" Width="400" IsItemsHost="True" />
        </ItemsPanelTemplate>
    </ListBox.ItemsPanel>

    <StackPanel>
        <ListBoxItem Style="{StaticResource label}">Header 1</ListBoxItem>
        <ListBoxItem>Item 1</ListBoxItem>
        <ListBoxItem>Item 2</ListBoxItem>
        <ListBoxItem>Item 3</ListBoxItem>
        <ListBoxItem>Item 4</ListBoxItem>
    </StackPanel>
    <StackPanel>
        <ListBoxItem Style="{StaticResource label}">Header 2</ListBoxItem>
        <ListBoxItem>Item 1</ListBoxItem>
        <ListBoxItem>Item 2</ListBoxItem>
        <ListBoxItem>Item 3</ListBoxItem>
        <ListBoxItem>Item 4</ListBoxItem>
    </StackPanel>
</ListBox>

我该怎么做才能解决这个问题?

谢谢!

1 个答案:

答案 0 :(得分:0)

如果我理解你的问题我有一个有效的解决方案。

您设计的方式不正确。

请查看我的代码,如果这是您想要的,请告诉我。

   <ListBox SelectionMode="Multiple" x:Name="ListBox1" ItemsSource="{Binding ListToBind}" >
        <ListBox.ItemsPanel>
            <ItemsPanelTemplate>
                <WrapPanel ItemWidth="120" Width="400" IsItemsHost="True" />
            </ItemsPanelTemplate>
        </ListBox.ItemsPanel>

        <ListBox.ItemTemplate>
            <DataTemplate>
                <StackPanel Orientation="Vertical">
                    <TextBlock Text="{Binding Header}"></TextBlock>
                    <ListBox ItemsSource="{Binding Collection}">

                    </ListBox>
                </StackPanel>

            </DataTemplate>
        </ListBox.ItemTemplate>

    </ListBox>



This is my UI and here is connecting Data model. I set the datacontext in code behind and fill up a model.

背后的代码看起来像这样

       public MainWindow()
    {
        InitializeComponent();
        ListToBind = new ObservableCollection<DataModel>
        {
            new DataModel { Header = "header 1",
                Collection = new List<string>{"Item 1","Item 2", "Item 3"}},
            new DataModel { Header = "header 2",
                Collection = new List<string>{"Item 1","Item 2", "Item 3"}},
            new DataModel { Header = "header 3",
                Collection = new List<string>{"Item 1","Item 2", "Item 3"}},

        };
        this.DataContext = this;
        var para1 = new Form1();
        var check = ListBox1;
   }

这是数据模型

 public class DataModel
{


    public string Header { get; set; }

    public List<string> Collection { get; set; }


}

这就是跑步后的样子

enter image description here