上善若水

水善利万物而不争
  博客园  :: 首页  :: 新随笔  :: 联系 :: 订阅 订阅  :: 管理

WPF | 跟着视频敲代码5 | 数据模板 DataTemplate

Posted on 2022-07-17 22:17  董锡振  阅读(33)  评论(0编辑  收藏  举报

视频链接:https://www.bilibili.com/video/BV1nY411a7T8?p=4

笔记:

DataTemplate:数据模板 

 <ListBox x:Name="list" >
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <StackPanel Orientation="Horizontal">
                        <Border Width="10" Height="10" Background="Red"></Border>
                        <TextBlock Margin="10,0" Text="Red"></TextBlock>
                    </StackPanel>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>        List<int> test = new List<int>();
            for (var i = 0; i < 10; i++)
            {
                test.Add(i);
            }
            list.ItemsSource = test;


或者:前端使用Binding连接

public class Color
{
public string Code { get; set; }
public string Name { get; set; }
}

 

List<Color> test = new List<Color>();
test.Add(new Color() { Code = "#FFB6C1", Name = "粉红色" });
test.Add(new Color() { Code = "#FF0000", Name = "红色" });
list.ItemsSource = test;

 

<ListBox x:Name="list" >
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<Border Width="10" Height="10" Background="{Binding Code}"></Border>
<TextBlock Margin="10,0" Text="{Binding Name}"></TextBlock>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>