学海无涯

导航

数据绑定

元素绑定

 <StackPanel>
            <Slider x:Name="slider1" Width="200" ></Slider>
            <TextBox Name="txt" Text="{Binding ElementName=slider1,Path=Value,UpdateSourceTrigger=PropertyChanged ,Mode=TwoWay}"/>
            <TextBox>text</TextBox>
        </StackPanel>

参数说明:

UpdateSourceTrigger: 两个元素的值是实时同步,还是失去焦点后同步
Mode:单向绑定或双向绑定

静态资源绑定

 <Window.Resources>
        <TextBox x:Key="txt">Hello</TextBox>
    </Window.Resources>
    <Grid>
        <StackPanel>
            <TextBox  Text="{Binding Source={StaticResource txt}, Path=Text}"/>
        </StackPanel>
    </Grid>

 控件数据上下文 DataContext 绑定(单向绑定)

 <Grid>
        <StackPanel>
            <TextBox x:Name="txt" Text="{Binding Name,FallbackValue='默认值'}"  FontSize="30" />
        </StackPanel>
    </Grid>

  

 private void Window_Loaded(object sender, RoutedEventArgs e)
        {
            txt.DataContext=new Person() { Name="LiCi",Age=18};
        }

        public class Person
        {
            public string Name { get; set; }
            public int Age { get; set; }
        }

  

窗体数据上下文 DataContext 绑定(单向绑定)

public class MainViewModel
    {
        public MainViewModel()
        {
            Name = "Hello";
        }
        public string Name { get; set; }
    }

  

<Grid>
        <StackPanel>
            <TextBox x:Name="txt" Text="{Binding Name,FallbackValue='默认值'}"  FontSize="30" />
        </StackPanel>
    </Grid>

  

 public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            this.DataContext = new MainViewModel();
        }

   }

  

窗体数据上下文 DataContext 绑定,实现 INotifyPropertyChanged 接口达到双向绑定(双向绑定)

 

public class MainViewModel : INotifyPropertyChanged
    {
        public MainViewModel()
        {
            Name = "Hello";
        }
        private string name;
        public string Name
        {
            get { return name; }
            set
            {
                name = value;
                OnPropertyChanged(nameof(Name));
            }
        }


        public event PropertyChangedEventHandler? PropertyChanged;
        protected void OnPropertyChanged(string properName)
        {
            if (PropertyChanged != null)
                PropertyChanged(this, new PropertyChangedEventArgs(properName));
        }
    }

  

<Grid>
        <StackPanel>
            <TextBox x:Name="txt" Text="{Binding Name,FallbackValue='默认值'}"  FontSize="30" />
            <Button  Click="Button_Click">butt1</Button>
        </StackPanel>
    </Grid>

  

 public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            this.DataContext = new MainViewModel();
        }

        private void Button_Click(object sender, RoutedEventArgs e)
        {
            var model=(MainViewModel)this.DataContext;
            model.Name = "New Name";
        }
    }

  

窗体数据上下文 DataContext 绑定,使用 MvvmLight 程序包达到双向绑定(双向绑定)

 public class MainViewModel : ViewModelBase
    {
        public MainViewModel()
        {
            Name = "Hello";
        }
        private string name;
        public string Name
        {
            get { return name; }
            set
            {
                name = value;
                RaisePropertyChanged();
            }
        }
    }

 绑定事件

public class MainViewModel : ViewModelBase
    {
        public MainViewModel()
        {
            Name = "Hello";
            SaveCommand = new RelayCommand(() =>
            {
                Name = "事件已触发";
            });
        }
        private string name;
        public string Name
        {
            get { return name; }
            set
            {
                name = value;
                RaisePropertyChanged();
            }
        }
        public RelayCommand SaveCommand { get; private set; }

    }

  

 <Grid>
        <StackPanel>
            <TextBox x:Name="txt" Text="{Binding Name,FallbackValue='默认值'}"  FontSize="30" />
            <Button  Command="{Binding SaveCommand}" >butt1</Button>
        </StackPanel>
    </Grid>

  

 public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            this.DataContext = new MainViewModel();
        }

  }

  

 

 

posted on 2022-12-12 09:05  宁静致远.  阅读(20)  评论(0编辑  收藏  举报