Binding for Button.Text does not work Xamarin.Forms

I'm trying to bind a Button.Text property to a C# property using data binding but the view does not update, if I change the value of the C# Property.

Here are some Code snippets:

    <ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" xmlns:viewmodel="clr-namespace:Xamarin_App.ViewModel"
             x:Class="Xamarin_Lernen.MainPage">

    <ContentPage.BindingContext>
        <viewmodel:MainViewModel/>
    </ContentPage.BindingContext>
    
    <StackLayout>

        <Button Text="{Binding Text}" Command="{Binding Command}"/>

In the XAML is just the Button inside a StackLayout and I set the DataContext

View Model:

private string _Text;

        public string Text
        {
            get => _Text;

            set
            {
                if (_Text == value)
                {
                    return;
                }

                _Text = value;
                OnPropertyChanged();
            }
        }

public event PropertyChangedEventHandler PropertyChanged;

        protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null)
        {
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
        }

    public ICommand Command { get; }

public MainViewModel()
{
    Command = new NewCommand();
}

Here is the property, the Property changed event and the command for the button

MainViewModel mainVM = new MainViewModel();

            mainVM.Text = "Test";

and that is what the button command does.

Where is the problem and how to fix it?

Upvotes: 0

Views: 500

Answers (2)

Hongxin Sui-MSFT
Hongxin Sui-MSFT

Reputation: 199

You need to assign the bindingcontext of the XAML file to the mainviewmodel type object mainvm instead of creating a new mainviewmodel class object,such as:

MainViewModel  mainVM = (MainViewModel)this.BindingContext;
mainVM.Text = "Test";

Upvotes: 1

Alexandar May - MSFT
Alexandar May - MSFT

Reputation: 10063

The key is that you need add a method to the Command and then update the Text Property for the button. You can refer to sample snippets below:

ViewModel:


 public class MainPageViewModel : INotifyPropertyChanged
    {
        
      public event PropertyChangedEventHandler PropertyChanged;

      private string _Text;
      public ICommand Command { get; set; }
      public string Text
        {
            get { return _Text; }
            set {
                if(_Text != value) { _Text = value; }
                PropertyChanged?.Invoke(this, new PropertyChangedEventArgs("Text"));

           }
        }


       public MainPageViewModel()
        {
            Command = new Command(mytext);
        }


       private void mytext(object obj)
        {
           //update the Text Property
           Text = "This is a test";
        }
    }

Xaml:

<Button Text="{Binding Text}" Command="{Binding Command}"></Button>

Last but not least, don't forget to bind the view with viewmodel in Code-behind below or in Xaml.

BindingContext = new MainPageViewModel();

Upvotes: 1

Related Questions