WPF 绑定项控件中的字符串值列表

本文关键字：字符串 列表 绑定 控件 WPF | 更新日期: 2023-09-27 18:32:27

我有以下模型类 

 ResultViewModel
 public string word {get;set;}
 public List<string> meanings {get;set;}

具有 2 个属性。如何将含义列表字符串绑定到堆栈面板？

我的数据会像

单词="a" ， 含义= "a1"，"a2"，"a3"

单词="b" ， 含义= "b1"，"b2"，"b3"....

单词="c" ， 含义= "c1"，"c2"，"c3"....

我

有以下 xaml，它将帮助我绑定"a"b"c"等，但现在我想将含义展示到它的底部 

    <ItemsControl Name="lviewLookupResult"  Background="#363636">
        <ItemsControl.ItemTemplate>
            <DataTemplate>                  
                    <StackPanel Orientation="Horizontal" Margin="5 5 5 0">                          
                        <Label Margin="5 0" Padding="0"  Content="{Binding word}" />
                    </StackPanel>
                    <StackPanel Orientation="Vertical" Margin="5 5 5 0">                            
                        ??????HOW CAN I SHOW Meanings HERE???????????

                    </StackPanel>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>

我正在使用下面的代码来绑定模型，并且在运行时绑定很好

  List<ResultViewModel> view_model = new List<ResultViewModel>();           
   lviewLookupResult.ItemsSource = view_model;

WPF 绑定项控件中的字符串值列表

使用另一个ItemsControl，如下所示：

   <ItemsControl Name="lviewLookupResult"  Background="#363636">
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <StackPanel Orientation="Vertical">
                    <StackPanel Orientation="Horizontal" Margin="5 5 5 0">
                        <Label Margin="5 0" Padding="0"  Content="{Binding word}" />
                    </StackPanel>
                    <ItemsControl Margin="5 5 5 0" ItemsSource="{Binding meanings}">
                        <ItemsControl.ItemTemplate>
                            <DataTemplate>
                                <TextBlock Text="{Binding}"/>
                            </DataTemplate>
                        </ItemsControl.ItemTemplate>
                    </ItemsControl>
                </StackPanel>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>

请尝试此更新的 XAML。

<ItemsControl Name="lviewLookupResult"  Background="#363636">
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <StackPanel Orientation="Horizontal" Margin="5 5 5 0">
                    <Label Margin="5 0" Padding="0"  Content="{Binding word}" />
                    <ListView ItemsSource="{Binding meanings}">
                        <ListView.ItemTemplate>
                            <DataTemplate>
                                <StackPanel Orientation="Horizontal">
                                    <Label Content="{Binding}"/>
                                </StackPanel>
                            </DataTemplate>
                        </ListView.ItemTemplate>
                    </ListView>
                </StackPanel>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>

我的建议是创建一个名为 MeaningsCollection 的类并覆盖 ToString 方法。

public class MeaningsCollection
{
    public List<string> meanings {get;set;}
    public override string ToString()
    {
        return "the collection in your preferred format";
    }
}
public class ResultViewModel 
{
     public string word {get;set;}
     public MeaningsCollection Meanings {get;set;}
}

在你的 XAML 中应该是这样的：

<ItemsControl Name="lviewLookupResult"  Background="#363636">
        <ItemsControl.ItemTemplate>
            <DataTemplate>                  
                    <StackPanel Orientation="Horizontal" Margin="5 5 5 0">                          
                        <Label Margin="5 0" Padding="0"  Content="{Binding word}" />
                        <Label Margin="5 0" Padding="0"  Content="{Binding Meanings}" />
                    </StackPanel>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>

使用 ItemsControl 并设置 ItemsPanel 属性。

<ItemsControl Name="lviewLookupResult"  Background="#363636">
    <ItemsControl.ItemTemplate>
        <DataTemplate>                  
                <StackPanel Orientation="Horizontal" Margin="5 5 5 0">                          
                    <Label Margin="5 0" Padding="0"  Content="{Binding word}" />
                </StackPanel>
                <ItemsControl ItemsSource="{Binding meanings}">                            
                      <ItemsControl.ItemsPanel>
                          <ItemsPanelTemplate>
                               <StackPanel Orientation="Vertical" Margin="5 5 5 0" />
                          </ItemsPanelTemplate>
                      </ItemsControl.ItemsPanel>
                </ItemsControl>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>
相关文章：