WPF 将 2 列绑定到 ListView

Question

XAML：

<ListBox x:Name="MyTitleBox" ItemsSource="{Binding}"/>
<ListBox x:Name="MyInfoBox" ItemsSource="{Binding}"/>

在 C# 中：

 MyTitleBox.ItemsSource = new List<string>(new string[] {"ID:", "Info:", "More Info:"});
 MyInfoBox.ItemsSource = new ObservableCollection<string>(MyMainInfo.ToString().Split(',').ToList<string>());

我目前有 2 个彼此相邻的列表框，因为我需要以编程方式处理它们的 ItemsSource。

我知道必须有更好的方法来合并两者。本质上，“左侧”的列表框是 ID 之类的标题：而“右侧”的列表框是信息。

我认为我可以像我所见的那样执行 MyTitleBox.Columns.Add 之类的操作，但它不允许我执行 .Columns。我正在使用 .NET 4。

Answer 1

这是一个使用更多 MVVM 方法的示例：

域（您要放入列表的项目类型）：

public class Movie : INotifyPropertyChanged
{
    public event PropertyChangedEventHandler PropertyChanged;

    private string _title;

    public string Title
    {
        get { return _title; }
        set
        {
            if (_title != value)
            {
                _title = value;

                RaisePropertyChanged("Title");
            }                
        }
    }

    private string _info;

    public string Info
    {
        get { return _info; }
        set
        {
            if (_info != value)
            {
                _info = value;

                RaisePropertyChanged("Info");
            }                
        }
    }

    protected void RaisePropertyChanged(string propertyName)
    {
        if (PropertyChanged != null)
        {
            PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
        }
    }
}

视图模型：

public class MyViewModel : INotifyPropertyChanged
{
    public event PropertyChangedEventHandler PropertyChanged;

    private ObservableCollection<Movie> _movies;

    /// <summary>
    /// Collection of movies.
    /// </summary>
    public ObservableCollection<Movie> Movies
    {
        get { return _movies; }
        set
        {
            if (_movies != value)
            {
                _movies = value;

                RaisePropertyChanged("Movies");
            }
        }
    }

    /// <summary>
    /// Constructor
    /// </summary>
    public MyViewModel()
    {
        Movies = new ObservableCollection<Movie>();

        Movies.Add(new Movie() { Title = "Gravity", Info = "Gravity is about..." });
        Movies.Add(new Movie() { Title = "Avatar", Info = "Avatar is about..." });
    }

    protected void RaisePropertyChanged(string propertyName)
    {
        if (PropertyChanged != null)
        {
            PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
        }
    }
}

XAML：

<Window x:Class="StackOverflow.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="clr-namespace:StackOverflow"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition />
            <RowDefinition Height="Auto" />
        </Grid.RowDefinitions>
        <ListBox ItemsSource="{Binding Movies}">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <TextBlock>
                        <Run Text="{Binding Title}" /><Run Text=" - " /><Run Text="{Binding Info}" />
                    </TextBlock>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>

        <Button Grid.Row="1" Content="Click To Change Info" Margin="5" Click="Button_Click" />
    </Grid>
</Window>

代码隐藏：

public partial class MainWindow : Window
{
    public MyViewModel ViewModel { get; private set; }

    public MainWindow()
    {
        InitializeComponent();

        ViewModel = new MyViewModel();

        DataContext = ViewModel;
    }

    private void Button_Click(object sender, RoutedEventArgs e)
    {
        Movie movie = ViewModel.Movies.FirstOrDefault();

        if (movie != null)
        {
            movie.Info = "This is the new information";
        } 
    }
}

实现 INotifyPropertyChanged 允许代码在发生变化时通知 UI。

如果您测试此代码，您将看到单击该按钮会更新第一部电影的信息，并且此更改会立即反映在 UI 中。 （通常您会使用命令之类的约定来处理按钮单击，但为简单起见，我这样做了）

如果您有任何问题，请告诉我。