Переключатели Switch и CheckBox

Последнее обновление: 17.07.2022

Класс Switch представляет кнопку-переключатель, который может находиться в двух состояниях: включенном и выключенном.

Среди свойств класса Switch стоит выделить следующие:

  • IsToggled: указывает, находится ли Switch во включенном состоянии (значение true) или выключенном (значение false)

  • ThumbColor: цвет кнопки переключателя

  • OnColor: цвет переключателя во включенном состоянии

Для отслеживания изменения состояния элемента Switch класс определяет событие Toggled. Его параметр ToggledEventArgs с помощью свойства Value позволяет получить новое состояние - новое значения свойства IsToggled.

Создадим элемент Switch в коде C#:

namespace HelloApp;

class StartPage : ContentPage
{
    Label label;
    public StartPage()
    {
        Switch switcher = new Switch { IsToggled = true};
        switcher.Toggled += switcher_Toggled;
        label = new Label
        {
            FontSize = 16,
            Text = $"Значение {switcher.IsToggled}"
        };
        Content = new StackLayout { Children = { switcher, label }, Padding=8 };
    }
    void switcher_Toggled(object sender, ToggledEventArgs e)
    {
        label.Text = $"Значение {e.Value}";
    }
}
Switch и переключение состояния в .NET MAUI и C#

Аналог в xaml:

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="HelloApp.MainPage">
    <StackLayout Padding="8">
        <Switch x:Name="switcher" IsToggled="True" Toggled="switcher_Toggled" />
        <Label x:Name="label" FontSize="16" />
    </StackLayout>
</ContentPage>

и в файле связанного кода пропишем обработчик события Toggled:

namespace HelloApp;

public partial class MainPage : ContentPage
{
	public MainPage()
	{
        InitializeComponent();
    }
    void switcher_Toggled(object sender, ToggledEventArgs e)
    {
        label.Text = $"Значение {e.Value}";
    }
}

Checkbox

Похожую функциональность предоставляет другой класс - CheckBox - он представляет флажок, который может находиться в двух состояниях: отмеченном и неотмеченном. Среди свойств данного класса следует выделить следующие:

  • IsChecked: указывает, находится ли флажок в отмеченном состоянии (значение true) или неотмеченном (значение false)

  • Color: цвет флажка

Для отслеживания изменения состояния флажка класс Checkbox определяет событие CheckedChanged. Его параметр CheckedChangedEventArgs с помощью свойства Value позволяет получить новое состояние - новое значения свойства IsChecked.

Пример CheckBox в коде C#:

namespace HelloApp;

class StartPage : ContentPage
{
    Label statusLabel;
    public StartPage()
    {
        CheckBox statusCheckBox = new CheckBox { IsChecked = false};
        statusCheckBox.CheckedChanged += CheckBox_CheckedChanged;
        Label statusHeaderLabel = new Label { FontSize = 16, Text = "женат/замужем", Margin=4 };
        StackLayout checkboxStack = new StackLayout 
        { 
            Orientation = StackOrientation.Horizontal,
            Children = { statusCheckBox, statusHeaderLabel }
        };
        statusLabel = new Label 
        { 
            FontSize = 18, 
            Text = "Статус: холост/не замужем" 
        };
        Content = new StackLayout { Children = { statusLabel, checkboxStack}, Padding=8 };
    }

    private void CheckBox_CheckedChanged(object sender, CheckedChangedEventArgs e)
    {
        statusLabel.Text = $"Статус: {(e.Value ? "женат/замужем":"холост/не замужем")}";
    }
}
Элемент CheckBox и переключение состояния в .NET MAUI и C#

Аналог в xaml:

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="HelloApp.MainPage">
    <StackLayout Padding="8">
        <Label x:Name="statusLabel" FontSize="18" Text="Статус: холост/не замужем" />
        
        <StackLayout Padding="8" Orientation="Horizontal">
            <CheckBox x:Name="statusCheckBox" CheckedChanged="CheckBox_CheckedChanged" />
            <Label FontSize="16"  Text="женат/замужем" />
        </StackLayout>

    </StackLayout>
</ContentPage>

и в файле связанного кода пропишем обработчик события CheckedChanged:

namespace HelloApp;

public partial class MainPage : ContentPage
{
	public MainPage()
	{
        InitializeComponent();
    }
    void CheckBox_CheckedChanged(object sender, CheckedChangedEventArgs e)
    {
        statusLabel.Text = $"Статус: {(e.Value ? "женат/замужем" : "холост/не замужем")}";
    }
}
Помощь сайту
Юмани:
410011174743222
Перевод на карту
Номер карты:
4048415020898850