Expression Blend 中的数据绑定新手

Question

我在 Expression Blend 中有一个 WPF 应用程序。

在应用程序中，我想在右侧有一个列出单词的列表框。

当用户单击一个单词时，我想在左侧显示该单词的更大文本、描述和其他一些文本。

据我所知，要列出列表框中的所有单词，我需要对包含单词、描述和其他文本的数据进行数据绑定。

我是这个数据绑定的新手。

有人可以帮我如何在 Expression Blend 4 中执行此操作吗？

谢谢！

Answer 1

我构建了一个非常基本的 MVVM 示例，它将向您展示一些基本功能。

我首先创建了一个“汽车”对象。这就是我的列表框将包含的内容。

Car.cs

public class Car
{
    public Car(string make, string model, int year)
    {
        Model = model;
        Make = make;
        Year = year;
    }

    public string Model { get; set; }
    public string Make { get; set; }
    public int Year { get; set; }
}

接下来，我创建了一个 ViewModel 以设置为视图的 DataContext。 ViewModel 有两个属性：“Cars”和“SelectedCar”。视图将绑定到这两个属性。这是 ViewModel 的实现。

MainWindow_ViewModel.cs

public class MainWindow_ViewModel : INotifyPropertyChanged
{
    public MainWindow_ViewModel()
    {
        this.Cars = LoadInitialCarList();
        this.SelectedCar = this.Cars.First();
    }

    public List<Car> Cars
    {
        get { return cars; }
        set
        {
            if (cars != value)
            {
                cars = value;
                OnPropertyChanged("Cars");
            }
        }
    }
    private List<Car> cars;

    public Car SelectedCar
    {
        get { return selectedCar; }
        set
        {
            if (selectedCar != value)
            {
                selectedCar = value;
                OnPropertyChanged("SelectedCar");
            }
        }
    }
    private Car selectedCar;

    private List<Car> LoadInitialCarList()
    {
        List<Car> list = new List<Car>();

        list.Add(new Car("Chevrolet", "Camaro", 1968));
        list.Add(new Car("Ford", "Mustang", 1965));
        list.Add(new Car("Pontiac", "GTO", 1970));

        return list;
    }

    #region INotifyPropertyChanged Members

    public event PropertyChangedEventHandler PropertyChanged;

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

    #endregion
}

现在，在视图中，我能够创建一个 ListBox（就像您建议的那样）并用我的汽车列表填充它的 ItemSource。我还将 ListBox 的 SelectedItem 绑定到 ViewModel 上的 SelectedCar。我在视图中放置了一些其他文本，以显示有关所选汽车的更多数据。

MainWindow.xaml

<Window x:Class="ListBoxBinding.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="350" Width="525"
    xmlns:local="clr-namespace:ListBoxBinding"
    >

<Window.DataContext>
    <local:MainWindow_ViewModel/>
</Window.DataContext>

<StackPanel>
    <ListBox ItemsSource="{Binding Cars}" SelectedItem="{Binding SelectedCar, Mode=TwoWay}"/>

    <StackPanel Orientation="Horizontal">
        <TextBlock Margin="3" Text="{Binding SelectedCar.Year}"/>
        <TextBlock Margin="3" Text="{Binding SelectedCar.Make}"/>
        <TextBlock Margin="3" Text="{Binding SelectedCar.Model}"/>
    </StackPanel>
</StackPanel>

当您在 ListBox 中选择一个项目时，它将更新 ViewModel 上的 SelectedItem，因此，它会更新绑定到 SelectedCar 上的属性的 TextBlock。

我认为这与您想要实现的目标类似。希望这有帮助！