XAML要素をエンティティにバインドするTwoWay

XAML 要素( TextBox.Text のような)のプロパティにエンティティプロパティ( Salary )をバインドしたい このバインディングを使用して TextBox のエンティティプロパティとして 'text'にバインドされた給与項目に TextBox を保存します。

次のようなもの:


    

2

3 答え

xamlのPropertiesをバインドするだけで、給料はプロパティでなくフィールドでなければなりません。あなたの従業員が給料のクラスであれば、そのインスタンスにdatacontextを設定することができます。 xamlやコードビハインドやバインディングでそれを行うことができます。

public class Employee //implement INotifyPropertyChanged to get the power of binding :)
{
    public decimal Salary {get;set}
}

view.xaml


 
        
  
   
 

多くの方法でdatacontextを設定することができます

3
追加された

XAML双方向バインディング、「Windowsユニバーサル」スタイル、ステップバイステップ

Visual Studio 2017で、Visual C#ブランクアプリケーション(ユニバーサルWindows)を作成します。名前を 'MyProject'にします。

Employee クラスを追加し、次のように定型句コードを変更します。

// Employee.cs

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Linq;
using System.Runtime.CompilerServices;
using System.Text;
using System.Threading.Tasks;

namespace MyProject
{
    public class Employee : INotifyPropertyChanged
    {
        private string salary;
        public string Salary
        {
            get
            {
                return this.salary;
            }
            set
            {

                if (value != this.salary)
                {
                    this.salary = value;
                    NotifyPropertyChanged();
                }
            }
        }

        public event PropertyChangedEventHandler PropertyChanged;

       //This method MUST BE called by the Set accessor of each property for TwoWay binding to work.
       //The CallerMemberName attribute that is applied to the optional propertyName
       //parameter causes the property name of the caller to be substituted as an argument.
        private void NotifyPropertyChanged([CallerMemberName] String propertyName = "")
        {
            if (PropertyChanged != null)
            {
                PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
            }
        }

       //Constructor with one parameter
        public Employee(string annualSalary) { salary = annualSalary; }
    }
}

Employee クラスは INotifyPropertyChanged インタフェースを実装していることに注意してください。

プロジェクトにクラス EmployeeViewModel を追加し、次のように定型句コードを変更します。

// EmployeeViewModel.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

namespace MyProject
{
    public class EmployeeViewModel
    {
        private Employee defaultEmployee = new Employee("50000");

        public Employee DefaultEmployee { get { return this.defaultEmployee; } }

    }
}

次のように MainPage.xaml.cs ボイラープレートコードを変更します

//MainPage.xaml.cs

using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Runtime.InteropServices.WindowsRuntime;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;

// The Blank Page item template is documented at https://go.microsoft.com/fwlink/?LinkId=402352&clcid=0x409

namespace MyProject
{
    /// 
    /// An empty page that can be used on its own or navigated to within a Frame.
    /// 
    public sealed partial class MainPage : Page
    {
        public MainPage()
        {
            this.InitializeComponent();
            this.ViewModel = new EmployeeViewModel();


        }
        public EmployeeViewModel ViewModel { get; set; }
    }
}

MainPage.xaml の定型文を次のように変更します。



    
        
            
            
            
            
        
        
            
            
            
        

        <!--TextBlock will provide visual feedback that the two-way binding is working-->
        

        <!--TextBox has two-way binding-->
        

        <!--Button does nothing other than allow TextBox to lose focus-->
        <button x:Name="btn1" Content="Hello" Grid.Column="1" Grid.Row="3"
          Foreground="Green"
          HorizontalAlignment="Center"/>

    

DefaultEmployee Salary プロパティに 'Input' TextBoxと 'Control' TextBlockの両方がバインドされていることに注意してください。考え方は、 '入力' TextBoxの給与を編集して変更することです。その後、 'Control' TextBlockが更新されます。これは、 'Hello' ボタンが追加されたことなど、 '入力' ボタン自体はまったく何もしません)。

ビルドと実行。給与を変更し、タブをクリックするか、ボタンをクリックします。

0
追加された

そんなことはできません。クラス名をDataContextに設定します。 Employeeクラスのインスタンスである必要があります。

0
追加された