Evrensel Windows Platformunda ListView kullanımı (Windows 10 uygulaması)

Question

Herkes, ItemTemplate.DataTemplate ve ListView'u açıklayabilir. Bu kod snippet'inde. Templates kavramını gerçekten anlamıyorum, birisi de biraz ışık tutabilirse tam yardımcı olacaktır. Ben bu soruya bakmak vardı:

Metro app: ListView ItemTemplate DataTemplate for selected item

Ama yine karıştı. Teşekkür ederiz! :(

<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 kullanıcılarının görebileceği ve ihtiyaç duydukları ne olursa olsun bulmak için öğelerin o listesinde dolaşmak böylece dinamik öğelerin bir listesini göstermesini sağlayan bir kontroldür. Bunu tanımlamak için gerçekten basit XAML:.

<ListView x:Name="StudentsList" /> 

Şimdi de, üniversite öğrencileri bir listesi var diyelim Her öğrencinin basit Öğrenci sınıfı ile temsil edilmektedir Orada

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

c. Düzinelerce, yüzlerce veya binlerce öğrenci olabilir, dolayısıyla UI'yi statik olarak tanımlayamazsınız. Bu öğrencileri genellikle arka planda bir liste/koleksiyonda tutuyorsunuz.

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

Bu liste/koleksiyon ListView için bir ürün kaynağı olarak hizmet vermektedir ayarladığınız böylece: Ben demo amaçlı şimdi yapacak gibi, veritabanı, web hizmetleri veya sabit kod it - Çeşitli kaynaklardan şekilde alın ListView’in ItemsSource özelliğine sahip ve bu ikisi de UI’de listeyi gösterir. ListView kullanarak tüm öğeler, öğelerin sayısına bakılmaksızın dinamik olarak oluşturulur. Şimdi uygulamayı çalıştırırsanız

, olsa oldukça çirkin olacaktır:

Bunu güzel hale getirmek için bir DataTemplate tanımlamanız gerekir. Her öğrencinin adı ve yaşı olduğundan, bu özellikleri daha güzel görünmesini sağlamak isteyeceksiniz. Bu DataTemplate, ListView.ItemTemplate özelliğine atanır ve ListView, listedeki her öğe için bunu kullanır. Bu oldukça gerçekten değil kabul edeceğiz ben vb font boyutu, yazı tipi renkleri, marjlar ile oynadı ama -

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

bakın, ben göstermek ve bunların nasıl işlemek için hangi özellikleri tanımlamak için DataTemplate kullanılan noktası olsun eminim:

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

Bu basica:

fark edeceğiniz bir şey daha ben böyle inşa bağlayıcı kullanılmış olmasıdır lly demektir: Nesnenin Name numaralı özelliğe sahip olup olmadığını ve varsa TextBlock.Text olarak oluşturup oluşturmadığını kontrol edin.

Öğelerin daha karmaşık hale gelebileceğini unutmayın, böylece tek bir listede farklı öğeler için farklı şablonlar kullanabilirsiniz. Ancak bu, sanırım soru kapsamı içinde değil.

TLDR: ListView dinamik olarak bir öğe listesi oluşturur. ItemsSource, ListView ürününün kaynak kodunu tanımlar. DataTemplate, bir şeyi işlemek için kullanılacak şablonu tanımlar. Bu DataTemplate, ListView öğesinin ItemTemplate özelliğine atandığından, ListView öğesinin, öğelerini oluşturmak için tam olarak bu şablonu kullanması gerektiğini bilir.