在WPF中将项目添加到ListView(自定义'项目')

时间:2018-04-28 14:02:26

标签: wpf xaml listview

我是WPF的新手,只是学习。如何将项目添加到列表视图以保持构建样式?

我想以这种风格添加项目。

XAMLCode:

 <ListView x:Name="listv_Main" Width="740" Height="400">
            <ListViewItem>
                <Grid x:Name="Grid_Main_series" Height="70" Width="723" Background="#FF0299D1">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="*" />
                    </Grid.RowDefinitions>

                    <StackPanel Margin="10 0 0 0" Orientation="Horizontal" VerticalAlignment="Center">
                        <Image Width="74" Height="68" Stretch="Uniform"  HorizontalAlignment="Left" Source="https://myanimelist.cdn-dena.com/images/anime/2/75259.jpg"/>
                        <Separator Style="{StaticResource {x:Static ToolBar.SeparatorStyleKey}}" Width="2" Height="50" Background="#FF93999B" />

                        <StackPanel Orientation="Vertical">
                            <TextBlock Height="20" Margin="0 10 0 5" FontFamily="Arial" FontSize="11" Foreground="AntiqueWhite"><Run Text="Full Metal Panic!"/></TextBlock>
                            <TextBlock Height="20" Margin="0 5 0 4" FontFamily="Arial" FontSize="11" Foreground="AntiqueWhite"><Run Text="Full Metal Panic!"/></TextBlock>
                        </StackPanel>

                        <Separator Style="{StaticResource {x:Static ToolBar.SeparatorStyleKey}}" Width="2" Height="50" Background="#FF93999B" />

                        <StackPanel x:Name="stack_Main_series" Height="70" Width="530" VerticalAlignment="Top" HorizontalAlignment="Right">
                            <TextBlock Margin="0 5 10 0" Text="Episodes: 24/12" FontWeight="Thin" HorizontalAlignment="Right" Foreground="AntiqueWhite"/>
                            <TextBlock Margin="0 5 10 0" Text="Finished Airing" FontWeight="Thin" HorizontalAlignment="Right" Foreground="AntiqueWhite"/>
                        </StackPanel>

                    </StackPanel>
                </Grid>
            </ListViewItem>
        </ListView>

2 个答案:

答案 0 :(得分:1)

使用itemtemplate是简短的答案。 你也可以使用一个列表框,因为这不是列中的事情。

看看这个:

https://social.technet.microsoft.com/wiki/contents/articles/32164.wpf-mvvm-step-by-step-2.aspx

使用可观察的集合。 如果您想要文本块的多个属性,那么您需要一个具有多个公共属性的更复杂的类,而不仅仅是一个字符串。您可以将文本块的Text属性绑定到每个文本块。

答案 1 :(得分:1)

这是一个非常简单的示例,您可以根据自己的需要进行扩展。如果你有任何问题需要了解,请告诉我。

<强> MainWindow.xaml

<Window x:Class="WpfApp5.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"
    xmlns:local="clr-namespace:WpfApp5"
    mc:Ignorable="d"
    Title="MainWindow" Height="450" Width="800">
<Grid>
  <ListView Width="740" Height="400" ItemsSource="{Binding MyListItems}">
    <ListView.View>
      <GridView>
        <GridViewColumn DisplayMemberBinding="{Binding Path=Title}"
                        Header="Title" />
        <GridViewColumn DisplayMemberBinding="{Binding Path=Description}"
                        Header="Description" />
        <GridViewColumn DisplayMemberBinding="{Binding Path=ReleaseDate}"
                        Header="Release" />

      </GridView>

    </ListView.View>
  </ListView>
</Grid>

<强> MainWindow.cs

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
        DataContext = new MyClass();
    }
}

ViewModel

public class MyClass : INotifyPropertyChanged
{
    private ObservableCollection<MyListItem> _myListItems;

    public ObservableCollection<MyListItem> MyListItems
    {
        get => _myListItems;
        set
        {
            _myListItems = value;
            OnPropertyChanged(nameof(MyListItems));
        }
    }

    public MyClass()
    {
        MyListItems = new ObservableCollection<MyListItem>();

        MyListItems.Add( new MyListItem()
                         {
                             Title = "Title1",
                             Description = "This is description nr1",
                             ReleaseDate = DateTime.Now
                         } );
        MyListItems.Add( new MyListItem()
                         {
                             Title = "Title2",
                             Description = "This is description nr2",
                             ReleaseDate = DateTime.Now
                         } );
        MyListItems.Add( new MyListItem()
                         {
                             Title = "Title3",
                             Description = "This is description nr3",
                             ReleaseDate = DateTime.Now
                         } );
    }



    public event PropertyChangedEventHandler PropertyChanged;

    [NotifyPropertyChangedInvocator]
    protected virtual void OnPropertyChanged( [CallerMemberName] string propertyName = null )
    {
        PropertyChanged?.Invoke( this, new PropertyChangedEventArgs( propertyName ) );
    }

代表列表中一个条目的类:

public class MyListItem : INotifyPropertyChanged
{
    private string _title;

    public string Title
    {
        get => _title;
        set
        {
            _title = value;
            OnPropertyChanged( nameof( Title ) );
        }
    }

    private string _description;
    public string Description
    {
        get => _description;
        set
        {
            _description = value;
            OnPropertyChanged( nameof( Description ) );
        }
    }

    private DateTime _releaseDate;
    public DateTime ReleaseDate
    {
        get => _releaseDate;
        set
        {
            _releaseDate = value;
            OnPropertyChanged(nameof(ReleaseDate));
        }
    }

    public event PropertyChangedEventHandler PropertyChanged;

    [NotifyPropertyChangedInvocator]
    protected virtual void OnPropertyChanged( [CallerMemberName] string propertyName = null )
    {
        PropertyChanged?.Invoke( this, new PropertyChangedEventArgs( propertyName ) );
    }
}

如果您在Google上搜索“MVVM”和“Wpf Databinding”,您会发现很多教程和示例。