wpf应用程序中的简单数据绑定

本文关键字:简单 数据绑定 应用程序 wpf | 更新日期: 2023-09-27 17:53:06

你好,我正在尝试在wpf中研究简单的数据绑定。我试过了,但没有成功。

<Window x:Class="WpfTestApp.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="250" Width="350">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="70"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="50"/>
            <RowDefinition Height="50"/>
            <RowDefinition Height="50"/>
            <RowDefinition Height="50"/>
        </Grid.RowDefinitions>
        <Label Content="First Name" Grid.Row="0" Grid.Column="0" Height="25" HorizontalAlignment="Stretch"/>
        <Label Content="Last Name" Grid.Row="1" Grid.Column="0" Height="25" HorizontalAlignment="Stretch"/>
        <Label Content="Full Name" Grid.Row="2" Grid.Column="0" Height="25" HorizontalAlignment="Stretch"/>
        <TextBox x:Name="fName" Text="{Binding FirstName, UpdateSourceTrigger=PropertyChanged}" Grid.Row="0" Grid.Column="1" Height="25" HorizontalAlignment="Stretch"/>
        <TextBox x:Name="lName" Text="{Binding LastName, UpdateSourceTrigger=PropertyChanged}" Grid.Row="1" Grid.Column="1"  Height="25" HorizontalAlignment="Stretch"/>
        <Label x:Name="lblFullName" Content="{Binding FirstName}" Grid.Row="2" Grid.Column="1" Height="25" HorizontalAlignment="Stretch"/>
        <Button x:Name="cmdCommand" Content="Command" Grid.Row="3" Grid.Column="1" Margin="2" VerticalAlignment="Center" HorizontalAlignment="Center" Click="cmdCommand_Click"/>
    </Grid>
</Window>

现在您看到了,我希望标签lblFullName在我在文本框中输入name时自动更新。

现在我的代码隐藏文件看起来像这样:
  public partial class MainWindow : Window, INotifyPropertyChanged
    {
        private string _firstName;
        public string FirstName
        {
            get { return _firstName; }
            set
            {
                if (value != _firstName)
                {
                    _firstName = value;
                    OnPropertyChanged("FirstName");
                }
            }
        }
        private string _lastName;
        public string LastName
        {
            get { return _lastName; }
            set
            {
                if (value != _lastName)
                {
                    _lastName = value;
                    OnPropertyChanged("LastName");
                }
            }
        }
        public event PropertyChangedEventHandler PropertyChanged;
        /// <summary>
        /// Notifies objects registered to receive this event that a property value has changed.
        /// </summary>
        /// <param name="propertyName">The name of the property that was changed.</param>
        protected virtual void OnPropertyChanged(string propertyName)
        {
            if (this.PropertyChanged != null)
            {
                this.PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
            }
        }
        public MainWindow()
        {
            InitializeComponent();
        }
        private void cmdCommand_Click(object sender, RoutedEventArgs e)
        {
            lblFullName.Content = FirstName + " " + LastName;
        }
    }

不用说,即使点击命令按钮也不起作用…

有什么建议吗?

wpf应用程序中的简单数据绑定

设置DataContext指向窗口本身将解决当前的问题:

public MainWindow()
{
    InitializeComponent();
    this.DataContext = this;
}

Xaml中Binding表达式中的路径都是相对于控件的DataContext的,因此必须设置DataContext。

然而,我强烈建议你把名字和姓氏放在一个单独的类中(例如PersonViewModel),这将使代码更容易阅读和维护。

public class PersonViewModel : INotifyPropertyChanged
{
    private string _firstName;
    public string FirstName
    {
        get { return _firstName; }
        set
        {
            if (value != _firstName)
            {
                _firstName = value;
                OnPropertyChanged("FirstName");
            }
        }
    }
    private string _lastName;
    public string LastName
    {
        get { return _lastName; }
        set
        {
            if (value != _lastName)
            {
                _lastName = value;
                OnPropertyChanged("LastName");
            }
        }
    }
    public event PropertyChangedEventHandler PropertyChanged;
    protected virtual void OnPropertyChanged(string propertyName)
    {
        var handler = this.PropertyChanged;
        if (handler != null)
        {
            handler(this, new PropertyChangedEventArgs(propertyName));
        }
    }
}
public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
        this.DataContext = new PersonViewModel();
    }
    private void cmdCommand_Click(object sender, RoutedEventArgs e)
    {
        lblFullName.Content = FirstName + " " + LastName;
    }
}

现在这段代码的最后一部分不再工作了。有两种解决方案。

快速和肮脏的解决方案:

    private void cmdCommand_Click(object sender, RoutedEventArgs e)
    {
         var person = this.DataContext as PersonViewModel;
         if(person == null) return;
         lblFullName.Content = string.Format("{0} {1}", person.FirstName, person.LastName);
    }

一个更好的方法,当试图做适当的MVVM是在ViewModel中添加一个额外的属性(注意在First和Last name属性的变化!):

public class PersonViewModel : INotifyPropertyChanged
{
    public string FullName
    {
        get 
        {
            return string.Format("{0} {1}", FirstName, LastName);
        }
    }
    private string _firstName;
    public string FirstName
    {
        get { return _firstName; }
        set
        {
            if (value != _firstName)
            {
                _firstName = value;
                OnPropertyChanged("FirstName");
                OnPropertyChanged("FullName");
            }
        }
    }
    private string _lastName;
    public string LastName
    {
        get { return _lastName; }
        set
        {
            if (value != _lastName)
            {
                _lastName = value;
                OnPropertyChanged("LastName");
                OnPropertyChanged("FullName");
            }
        }
    }
    // remainder of the class remains the same
}

删除按钮及其点击处理程序。将标签绑定到这个新属性:

<Label Content="{Binding FullName}" 
       Grid.Row="2" Grid.Column="1" 
       Height="25" HorizontalAlignment="Stretch"/>