Enable and disable Xamarin Forms Switch by MVVM

Question

I have 5 form switches one of them are select all which should do selecting all other switesh to true. I have a logic when after select all switch is on it cannot be switch back to off manually. only way that button(Select all) can be switch off is by changing the other button to false/Off.

I have handle it from the view-model with a logic if my other 4 buttons are true i want let the user to set the button select all to false by get set logic.But with IOS if user can forcefully change and hold the switch to false for several seconds button stopped at false. I have tried with behaviors that also giving me the same results even i can disable the button and enable the button also im fine with but according to xamarine documentation it is not possible to add the commands

 bool _selectAll;

        public bool SelectAll
        {
            get
            {
                return _selectAll;
            }
            set
            {
                SetProperty(ref _selectAll, value);
                if (_activeAll && !(_button1 && _button2 && _button3 && _button4))
                {

                    Button1= true;
                    Button2= = true;
                    Button3= = true;
                    Button4= = true;
                }

                if (!_selectAll && (_emailStatus && _textStatus && _callStatus && _postStatus))
                {
                    SelectAll= true;
                }


            }
        }

Hi , have you sloved it ? If answer works remember to mark it, else continue to show doubts . — Junior Jiang, Sep 09 '19 at 07:42

score 3 · Answer 1 · answered Sep 08 '19 at 20:09

I created a quick sample using what I could understand from your request.

The SelectAll will Toggle-True all the 4 options but the user will not be able to Toggle-False the SelectAll Switch.

I did the above by disabling the SelectAll Switch and enabling it only when one of the options is set to false. For this, I just bound the inverted value of the SelectAll property. To invert the value I used a Converter but it could also be made with another property from the ViewModel

Check if this works for you.

Code:

ViewModel

public class MainViewModel : ViewModelBase
{
    private bool option1;
    public bool Option1
    {
        get => option1;
        set
        {
            if (!value) SelectAll = false;
            SetProperty(ref option1, value, nameof(Option1));
        }
    }

    private bool option2;
    public bool Option2
    {
        get => option2;
        set
        {
            if (!value) SelectAll = false;
            SetProperty(ref option2, value, nameof(Option2));
        }
    }

    private bool option3;
    public bool Option3
    {
        get => option3;
        set
        {
            if (!value) SelectAll = false;
            SetProperty(ref option3, value, nameof(Option3));
        }
    }

    private bool option4;
    public bool Option4
    {
        get => option4;
        set
        {
            if (!value) SelectAll = false;
            SetProperty(ref option4, value, nameof(Option4));
        }
    }

    private bool selectAll;
    public bool SelectAll
    {
        get => selectAll;
        set
        {
            SetProperty(ref selectAll, value, nameof(SelectAll));

            if (value)
            {
                Option1 = true;
                Option2 = true;
                Option3 = true;
                Option4 = true;
            }
        }
    }

  ....

}

The XAML

<StackLayout Orientation="Vertical"
                Padding="20,0"
                Spacing="10"
                VerticalOptions="CenterAndExpand">

    <Switch HorizontalOptions="FillAndExpand"
            IsToggled="{Binding Option1}" />

    <Switch HorizontalOptions="FillAndExpand"
            IsToggled="{Binding Option2}" />

    <Switch HorizontalOptions="FillAndExpand"
            IsToggled="{Binding Option3}" />

    <Switch HorizontalOptions="FillAndExpand"
            IsToggled="{Binding Option4}" />

    <StackLayout Orientation="Horizontal"
                    HorizontalOptions="FillAndExpand">                         
        <Switch HorizontalOptions="Start"
                IsEnabled="{Binding SelectAll, Converter={StaticResource Invert}}"
                IsToggled="{Binding SelectAll}"
                VerticalOptions="CenterAndExpand"/>
        <Label Text="Select All"
                VerticalOptions="CenterAndExpand" />
    </StackLayout>
</StackLayout>

But in the XAML you will also need:

<ContentPage.Resources>
    <ResourceDictionary>
        <local:InvertBooleanConverter x:Key="Invert" />
    </ResourceDictionary>
</ContentPage.Resources>

This is the Converter Registration.

And the Converter Code:

public class InvertBooleanConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        return !(bool)value;
    }

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
        return !(bool)value;
    }
}

Sorry I introduced the Converter into the solution but I believe it is cleaner this way. More about Xamarin Forms converters can be seen here.

Hope this helps.-

thanks in my scenario user should not be able to make false for all at once.theoretically though user set select all to all but user should not be able to make it false (Make all the element false at onece) — Black, Sep 09 '19 at 04:51
@Black in the code above the user cannot make it all **false** at once. The SelectAll button gets disabled when All-The-Options are selected. — pinedax, Sep 09 '19 at 04:59

Junior Jiang · Answer 2 · 2019-09-09T09:40:41.303

You can create a Model as follow :

public class ViewModel : INotifyPropertyChanged
{

    private bool swithOne;
    public bool SwithOne
    {
        set
        {
            if (swithOne != value)
            {
                swithOne = value;
                OnPropertyChanged("SwithOne");
            }
        }
        get
        {
            return swithOne;
        }
    }

    private bool swithTwo;
    public bool SwithTwo
    {
        set
        {
            if (swithTwo != value)
            {
                swithTwo = value;
                OnPropertyChanged("SwithTwo");
            }
        }
        get
        {
            return swithTwo;
        }
    }

    private bool swithThree;
    public bool SwithThree
    {
        set
        {
            if (swithThree != value)
            {
                swithThree = value;
                OnPropertyChanged("SwithThree");
            }
        }
        get
        {
            return swithThree;
        }
    }

    private bool swithFour;
    public bool SwithFour
    {
        set
        {
            if (swithFour != value)
            {
                swithFour = value;
                OnPropertyChanged("SwithFour");
            }
        }
        get
        {
            return swithFour;
        }
    }

    private bool swithFive;
    public bool SwithFive
    {
        set
        {
            if (swithFive != value)
            {
                swithFive = value;
                OnPropertyChanged("SwithFive");
                if(value == true)
                {
                    swithOne = true;
                    swithTwo = true;
                    swithThree = true;
                    swithFour = true;
                    OnPropertyChanged("SwithOne");
                    OnPropertyChanged("SwithTwo");
                    OnPropertyChanged("SwithThree");
                    OnPropertyChanged("SwithFour");
                }
                else
                {
                    swithOne = false;
                    swithTwo = false;
                    swithThree = false;
                    swithFour = false;
                    OnPropertyChanged("SwithOne");
                    OnPropertyChanged("SwithTwo");
                    OnPropertyChanged("SwithThree");
                    OnPropertyChanged("SwithFour");
                }
            }
        }
        get
        {
            return swithFive;
        }
    }

    public ViewModel()
    {
        swithOne = false;
        swithTwo = false;
        swithThree = false;
        swithFour = false;
        swithFive = false;
    }

    public event PropertyChangedEventHandler PropertyChanged;

    protected virtual void OnPropertyChanged(string propertyName)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
}

Then in XAML add Switch :

<StackLayout Padding="50">
    <!-- Place new controls here -->
    <Label Text="Welcome to Xamarin.Forms!" 
       HorizontalOptions="Center"
       VerticalOptions="CenterAndExpand" />

    <Switch IsToggled="{Binding SwithOne}" HorizontalOptions="Center"/>
    <Switch IsToggled="{Binding SwithTwo}" HorizontalOptions="Center"/>
    <Switch IsToggled="{Binding SwithThree}" HorizontalOptions="Center"/>
    <Switch IsToggled="{Binding SwithFour}" HorizontalOptions="Center"/>
    <StackLayout Orientation="Vertical">
        <Label Text="Select All" HorizontalOptions="CenterAndExpand"/>
        <Switch IsToggled="{Binding SwithFive}" HorizontalOptions="Center"/>
    </StackLayout>

</StackLayout>

Finally , in ContentPage binding Model :

BindingContext = new ViewModel();

Here is the effect :

Enable and disable Xamarin Forms Switch by MVVM

2 Answers2