MAUI: Change telerik button text based on property value

Question

I am quite new to MAUI, in the learning phase of it

I have a telerik button in a popup, like this

<telerik:RadButton Text="Add" CommandParameter="{Binding Source={x:Reference Name=AddNewNote}}" Command="{Binding OkCommand}"></telerik:RadButton>

And I have a property Name in my view model

What I want is that while opening the popup if the Name is empty then the button text should say Add else Update

Could somebody help me how to achieve this?

Answer 1

if the Name is empty then the button text should say Add else Update

You can achieve it by the following code:

Page.xaml:

...
<Entry Text="{Binding Name,Mode=TwoWay}"/>
<Button Text="{Binding BtnText}" Command="{Binding OkCommand}"/>
...

Page.xaml.cs:

public MainPage()
{
    InitializeComponent();
    BindingContext = new VM();
}    

ViewModel:

public class VM : INotifyPropertyChanged
{
    private string name;
    private string btnText;
    public string Name
    {
        get => name;
        set
        {
            if (name != value)
            {
                name = value;
                OnPropertyChanged();
            }
        }
    }
    public string BtnText
    {
        get => btnText;
        set
        {
            if (btnText != value)
            {
                btnText = value;
                OnPropertyChanged();
            }
        }
    }
    public Command OkCommand { get; }
    public VM()
    {
        OkCommand = new Command(OnOk, IsNull);
        PropertyChanged += (_, __) => OkCommand.ChangeCanExecute();
    }
    private bool IsNull()
    {
        if (!string.IsNullOrWhiteSpace(Name))
        {
            BtnText = "Update";
            return true;
        }
        BtnText = "Add";
        return true;
    }

    private void OnOk()
    {
        Console.WriteLine("ss");
    }
    public event PropertyChangedEventHandler PropertyChanged;
    public void OnPropertyChanged([CallerMemberName] string name = "") =>
    PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(name));
}

Here is the effect, and the button text can change dynamically(Add/Update) based on whether Name is empty or not.