How to set intermediate state in the .NET MAUI CheckBox?

This section explains how to set intermediate state in .NET MAUI CheckBox. The intermediate state is useful for indicating a partially selected state, commonly utilized with a “Select All” CheckBox to reflect the state of its child checkboxes.

Step 1: Create CheckBoxes
Define the CheckBoxes in your XAML layout. When the “Select All” checkbox is checked, it triggers the StateChanged event. In the event handler, the IsChecked property of the “Select All” checkbox is used to determine whether it is checked or unchecked.

<StackLayout Padding="20">
    <Label x:Name="label" Margin="10" Text="Pizza Toppings"/>
    <buttons:SfCheckBox x:Name="selectAll" Text="Select All" IsChecked="{x:Null}" IsThreeState="True" StateChanged="SelectAll_StateChanged"/>
    <buttons:SfCheckBox x:Name="pepperoni" Text="Pepperoni" StateChanged="CheckBox_StateChanged" Margin="30,0"/>
    <buttons:SfCheckBox x:Name="beef" Text="Beef" IsChecked="True" StateChanged="CheckBox_StateChanged" Margin="30,0"/>
    <buttons:SfCheckBox x:Name="mushroom" Text="Mushrooms" StateChanged="CheckBox_StateChanged" Margin="30,0"/>
    <buttons:SfCheckBox x:Name="onion" Text="Onions" IsChecked="True" StateChanged="CheckBox_StateChanged" Margin="30,0"/>
</StackLayout>

Step 2: Handle CheckBox State Changes
Handle the CheckBox state changes to set the intermediate state and synchronize the “Select All” CheckBox with the child CheckBoxes.

C#

bool skip = false;
private void SelectAll_StateChanged(object sender, Syncfusion.Maui.Buttons.StateChangedEventArgs e)
{
   if (!skip)
   {
      skip = true;
      pepperoni.IsChecked = beef.IsChecked = mushroom.IsChecked = onion.IsChecked = e.IsChecked;
      skip = false;
    }
}

private void CheckBox_StateChanged(object sender, Syncfusion.Maui.Buttons.StateChangedEventArgs e)
{
   if (!skip)
   {
     skip = true;
     if (pepperoni.IsChecked.Value && beef.IsChecked.Value && mushroom.IsChecked.Value && onion.IsChecked.Value)
        selectAll.IsChecked = true;
     else if (!pepperoni.IsChecked.Value && !beef.IsChecked.Value && !mushroom.IsChecked.Value && !onion.IsChecked.Value)
	selectAll.IsChecked = false;
      else
         selectAll.IsChecked = null;
         skip = false;
    }
 }

Output

Download the complete sample from the GitHub

Conclusion
I hope you enjoyed learning how to set intermediate state in .NET MAUI CheckBox.

Refer to our .NET MAUI CheckBox feature tour page to learn about its other groundbreaking feature representations. You can explore our .NET MAUI CheckBox documentation to understand how to present and manipulate data.

For current customers, check out our .NET MAUI components from the License and downloads page. If you are new to Syncfusion®, try our 30-day free trial to check out our .NET MAUI CheckBox and other .NET MAUI components.

Please let us know in the following comments section if you have any queries or require clarifications. You can also contact us through our support forums, Direct - Trac, or feedback portal. We are always happy to assist you!