The ListView control binds to a data source through the ItemsSource property.
Item rendering is controlled by a DataTemplate. The template defines the structure and appearance of each item in the list.
Changes in the data source are reflected in the UI based on the binding configuration.
| XAML |
コードのコピー
|
|---|---|
<UserControl.Resources>
<!-- Item template-->
<DataTemplate x:Key="ListViewItemTemplate">
<StackPanel Orientation="Horizontal" >
<Image Source="{Binding imagePath}" Height="100" Width="175" />
<StackPanel>
<TextBlock FontSize="14" TextWrapping="Wrap" Height="90" Width="175">
<Run Text="{Binding Name }" />
<LineBreak/>
<Run Text="{Binding Description}" FontStyle="Italic" Foreground="LightSlateGray"/>
<LineBreak/>
<Run Text="{Binding Price}" />
</TextBlock>
<Button Content="ADD" Width="100"></Button>
</StackPanel>
</StackPanel>
</DataTemplate>
</UserControl.Resources>
<Grid>
<!--Setting item template and binding with Products-->
<c1:C1ListView x:Name="listView" ShowSelectAll="True" ItemsSource="{Binding Products}" SelectionMode="Extended" ItemTemplate="{StaticResource ListViewItemTemplate}">
</c1:C1ListView>
</Grid>
|
|
| C# |
コードのコピー
|
|---|---|
Products = new List<Product>(); // Add products to the list Products.Add(new Product() { Name = "Ipoh Coffee", Description = "Frothy coffee in condensed milk", imagePath = "../Assets/image1.png", Price = "$46.00" }); Products.Add(new Product() { Name = "Pavlova", Description = "Frozen meringue topped with fruits", imagePath = "../Assets/image2.png", Price = "$17.45" }); Products.Add(new Product() { Name = "Scottish LongBreads", Description = "Cheese-filled baguettes for decadent brunches", imagePath = "../Assets/image3.png", Price = "$12.50" }); Products.Add(new Product() { Name = "Teatime Chocolate Biscuits", Description = "Chocolate biscuits baked in generous dollops of butter", imagePath = "../Assets/image4.png", Price = "$9.20" }); |
|