Question

任何人都可以解释ItemTemplate.DataTemplate和ListView。在此代码段中。我真的不理解Templates的概念，如果有人可能对此有所了解，那将会有所帮助。我看过这个问题：

Metro app: ListView ItemTemplate DataTemplate for selected item

但仍然困惑。谢谢！：（

<ListView Margin="10" Name="lvDataBinding">
     <ListView.ItemTemplate>
           <DataTemplate>
                <WrapPanel>
                    <TextBlock Text="Name: " />
                    <TextBlock Text="{Binding Name}" FontWeight="Bold" />
                    <TextBlock Text=", " />
                    <TextBlock Text="Age: " />
                    <TextBlock Text="{Binding Age}" FontWeight="Bold" />
                    <TextBlock Text=" (" />
                    <TextBlock Text="{Binding Mail}" TextDecorations="Underline" Foreground="Blue" Cursor="Hand" />
                    <TextBlock Text=")" />
                    </WrapPanel>
            </DataTemplate>
     </ListView.ItemTemplate>
</ListView>

Answer 1

ListView是一个控件，允许您动态显示项目列表，以便用户可以滚动查看项目列表以查看它们并找到它们可能需要的任何内容。在XAML中定义它非常简单：

<ListView x:Name="StudentsList" />

现在，让我们说你有一份大学生名单。每个学生都有一个简单的学生班。

public class Student
{
    public string Name { get; set; }
    public int Age { get; set; }
}

可能有数十，数百或数千名学生，因此您无法静态定义UI。您通常会将这些学生保留在代码隐藏中的某种列表/集合中。您可以从各种来源获取它们 - 数据库，Web服务或硬编码，就像我现在为演示目的所做的那样：

private List<Student> listOfStudents = new List<Student>();

public MainPage()
{
    this.InitializeComponent();

    listOfStudents.Add(new Student { Name = "John", Age = 20 });
    listOfStudents.Add(new Student { Name = "Bob", Age = 21 });
    listOfStudents.Add(new Student { Name = "Steve", Age = 19 });
    listOfStudents.Add(new Student { Name = "Marko", Age = 18 });
    listOfStudents.Add(new Student { Name = "Igor", Age = 20 });
    listOfStudents.Add(new Student { Name = "Ivan", Age = 20 });
    listOfStudents.Add(new Student { Name = "Nina", Age = 21 });
    listOfStudents.Add(new Student { Name = "Paul", Age = 20 });
    listOfStudents.Add(new Student { Name = "Ana", Age = 23 });
    listOfStudents.Add(new Student { Name = "Ivana", Age = 20 });

    StudentsList.ItemsSource = listOfStudents;
}

该列表/集合用作ListView的项目源，因此您可以设置ListView的ItemsSource属性以连接两者并在UI中显示列表。使用ListView，无论项目数如何，都会动态呈现所有项目。

如果我们现在运行应用程序，那将会非常难看：

您需要定义DataTemplate以使其更漂亮。由于每个学生都有姓名和年龄，因此您需要使用这些属性使其看起来更漂亮。此DataTemplate已分配给ListView.ItemTemplate属性，ListView将将其用于列表中的每个项目。

<ListView x:Name="StudentsList">
    <ListView.ItemTemplate>
        <DataTemplate>
            <StackPanel>
                <TextBlock Text="{Binding Name}" 
                           Margin="20,0,20,8"
                           FontSize="24" 
                           FontStyle="Italic" 
                           FontWeight="SemiBold"
                           Foreground="DarkBlue" />
                <TextBlock Text="{Binding Age}" 
                           Margin="20,0,20,8"
                           FontSize="16"
                           Foreground="DarkGray" 
                           Opacity="0.8" />
            </StackPanel>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

请参阅，我使用DataTemplate来定义要显示的属性以及如何渲染它们 - 我使用字体大小，字体颜色，边距等等。我承认这并不是很漂亮，但是我相信你会明白这一点：

你要注意的另一件事是我使用了这样的绑定结构：

<TextBlock Text="{Binding Name}" ... />

这基本上意味着：检查对象是否具有属性Name，如果有，请将其呈现为TextBlock.Text。

请注意，事情会变得更复杂，因此您可以在一个列表中为不同的项目使用不同的模板等，但我认为这不在问题范围内。

TLDR：ListView动态呈现项目列表。 ItemsSource定义了ListView的商品来源。 DataTemplate定义了一个用于呈现内容的模板。此DataTemplate已分配给ItemTemplate的{{1}}属性，以便ListView知道它应该使用该模板来呈现其项目。

如何在通用Windows平台（Windows 10应用程序）中使用ListView

1 个答案: