ユニバーサルWindowsプラットフォーム（Windows 10アプリ）でListViewを使用する方法

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; } 
} 

C。何十、何百、何千もの生徒がいるので、静的にUIを定義することはできません。あなたは通常、そのような生徒をコードビハインドで何らかの種類のリスト/コレクションに保管します。

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; 
} 

このリストは/コレクションは、リストビューの項目のソースとして機能し、設定して、私はデモの目的のために今何だろうと同じように、データベース、Webサービス、またはハードコードそれ - あなたはさまざまなソースからそれらを取得しますListViewのItemsSourceプロパティは、2つを接続し、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}" ... /> 

このBASICA llyの意味：オブジェクトのプロパティがNameであるかどうかをチェックし、オブジェクトの場合はTextBlock.Textとしてレンダリングします。

物事はもっと複雑になりますので、1つのリストなどの中のさまざまなアイテムに異なるテンプレートを使用できますが、それは私が考える質問の範囲にはありません。

TLDR：ListViewは、アイテムのリストを動的にレンダリングします。 ItemsSourceは、ListViewのアイテムソースを定義します。 DataTemplateは、何かをレンダリングするために使用されるテンプレートを定義します。このDataTemplateはListViewのItemTemplateプロパティに割り当てられ、ListViewはそのテンプレートを使用してそのアイテムをレンダリングする必要があることが分かります。