WPF Dynamic добавить ListViewItem с деталями

Question

Я хочу добавить ListViewItem с измененными деталями, такими как ссылка на изображение, текст в текстовом поле и т. Д. Как я могу это сделать?

    <ListView VerticalAlignment="Bottom" Margin="10" Height="170" Foreground="LightSteelBlue">
        <ListViewItem>
            <StackPanel Orientation="Horizontal">
                <TextBlock Text="01" VerticalAlignment="Center"/>
                <Ellipse Margin="20,0" Width="30" Height="30" VerticalAlignment="Center">
                    <Ellipse.Fill>
                        <ImageBrush ImageSource="images/pobrane.jpg"/>
                    </Ellipse.Fill>
                </Ellipse>
                <TextBlock Text="Three Days Grace - I Hate Everything About You (Official Music Video)" Width="115" TextTrimming="CharacterEllipsis" VerticalAlignment="Center" />
                <TextBlock Text="3:45" Margin="10,0" VerticalAlignment="Center" />
            </StackPanel>
        </ListViewItem>
    </ListView>

Я хочу создать функцию, которая добавит тот же код, который я показал вам с измененными деталями.

Answer 1

Можно использовать свойства ItemTemplate и ItemsSource представления WPF Listview и концепции Binding .

Просто для примера, начиная с вашего вопроса:

Вы можете добавить следующий код в файлы MainWindow нового проекта WPF: Файл MainWindow.xaml должен выглядеть следующим образом:

<Window x:Class="WpfApp1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">
    <Grid>
        <Button Click="Button_Click" 
                VerticalAlignment="Top"
                HorizontalAlignment="Left"
                Margin="10"
                Content="Add item"/>
        <ListView VerticalAlignment="Bottom"
                  Margin="10"
                  Height="170"
                  ItemsSource="{Binding Tracks}"
                  Foreground="LightSteelBlue">
            <ListView.ItemTemplate>
                <DataTemplate>
                    <StackPanel Orientation="Horizontal">
                        <TextBlock Text="{Binding Number}"
                                   VerticalAlignment="Center" />
                        <Ellipse Margin="20,0"
                                 Width="30"
                                 Height="30"
                                 VerticalAlignment="Center">
                            <Ellipse.Fill>
                                <ImageBrush ImageSource="{Binding Image}" />
                            </Ellipse.Fill>
                        </Ellipse>
                        <TextBlock Text="{Binding Name}"
                                   Width="115"
                                   TextTrimming="CharacterEllipsis"
                                   VerticalAlignment="Center" />
                        <TextBlock Text="{Binding Length}"
                                   Margin="10,0"
                                   VerticalAlignment="Center" />
                    </StackPanel>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
    </Grid>
</Window>

И файл MainWindow.xaml.cs должен выглядеть так:

using System;
using System.Collections.ObjectModel;
using System.Windows;
using System.Windows.Media;
using System.Windows.Media.Imaging;

namespace WpfApp1
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        public ObservableCollection<Track> Tracks { get; set; }
        public MainWindow()
        {
            InitializeComponent();
            this.DataContext = this;

            Tracks = new ObservableCollection<Track>();
            AddTrack("01","Three Days Grace - I Hate Everything About You (Official Music Video)", "3:45", new BitmapImage(new Uri("pack://application:,,,/WpfApp1;component/Resources/pobrane.jpg")));
        }

        public void AddTrack (string number, string name, string length, ImageSource image)
        {
            var track = new Track();
            track.Number = number;
            track.Name = name;
            track.Length = length;
            track.Image = image;
            Tracks.Add(track);
        }

        private void Button_Click(object sender, RoutedEventArgs e)
        {
            AddTrack("01", "Three Days Grace - I Hate Everything About You (Official Music Video)", "3:45", new BitmapImage(new Uri("pack://application:,,,/WpfApp1;component/Resources/pobrane.jpg")));
        }
    }

    public class Track
    {
        public string Number { get; set; }

        public string Name { get; set; }

        public string Length { get; set; }

        public ImageSource Image { get; set; }
    }
}

Конечно, это просто отправная точка. Вам следует продолжить поиск и чтение концепций MVVM и переместить логику в модель представления.