Skip to main content

DataFormSwitchItem Class

Stores settings of the data form’s switch control.

Namespace: DevExpress.Maui.DataForm

Assembly: DevExpress.Maui.Editors.dll

NuGet Package: DevExpress.Maui.Editors

Declaration

public class DataFormSwitchItem :
    DataFormItem

Remarks

The DataFormView component automatically creates a DataFormSwitchItem for the bound data object’s properties of the bool type. You can also add a switch editor and modify its properties manually in XAML or C# code.

The following image shows a Data Form with four switch items:

DevExpress MAUI DataForm -- Switch editor

For a list with all supported editors in the DataFormView, refer to the following topic: Data Form – Editors.

Get Started

The following help topic describes how to create your first app with the DevExpress Data Form component for MAUI:

Read Tutorial: Get Started with Data Form

Define Switch Editor Settings in XAML

Specify the DataFormView.DataObject property to define an object whose properties are to be edited in the DataFormView.

To show a switch editor in a DataFormView, add a DataFormSwitchItem object to the DataFormView.Items collection.

Use the item’s FieldName property to specify the name of the property to be edited in the Data Form.

Note: The DataFormView.Items property is a content property. You can skip the <Items> tag in your markup.

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:dxdf="clr-namespace:DevExpress.Maui.DataForm;assembly=DevExpress.Maui.Editors"
             x:Class="SwitchItemSample.MainPage" Shell.NavBarIsVisible="False"
             xmlns:local="clr-namespace:SwitchItemSample">
    <StackLayout>
        <dxdf:DataFormView x:Name="dataForm" CommitMode="Input" IsAutoGenerationEnabled="False">
            <dxdf:DataFormView.DataObject>
                <local:UserInfo/>
            </dxdf:DataFormView.DataObject>
            <dxdf:DataFormTextItem FieldName="Username" LabelText="Username" />
            <dxdf:DataFormTextItem FieldName="Email" LabelText="Email" />
            <dxdf:DataFormSwitchItem FieldName="NotificationsEnabled" LabelText="Receive notifications" OnColor="Coral" 
                                     ThumbColor="Gray" LabelIcon="envelope" IsLabelVisible="True"/> 
        </dxdf:DataFormView>
    </StackLayout>
</ContentPage>
using System.ComponentModel;
using System.Runtime.CompilerServices;
namespace SwitchItemSample {
    public class UserInfo : INotifyPropertyChanged {
        string username;
        public string Username {
            get { return this.username; }
            set {
                if (value != this.username) {
                    this.username = value;
                    NotifyPropertyChanged();
                }
            }
        }
        string email;
        public string Email {
            get { return this.email; }
            set {
                if (value != this.email) {
                    this.email = value;
                    NotifyPropertyChanged();
                }
            }
        }
        bool notificationsEnabled = false;
        public bool NotificationsEnabled {
            get { return this.notificationsEnabled; }
            set {
                if (value != this.notificationsEnabled) {
                    this.notificationsEnabled = value;
                    NotifyPropertyChanged();
                }
            }
        }
        public event PropertyChangedEventHandler PropertyChanged;
        private void NotifyPropertyChanged([CallerMemberName] String propertyName = "") {
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
        }
    }
    public partial class MainPage : ContentPage {
        public MainPage() {
            InitializeComponent();
        }
    }
}

Use Attributes to Generate the Editor

You can apply the DataFormSwitchEditorAttribute to the Data Object’s property whose values you want to edit in a switch editor in the DataFormView. Additionally, you can use the DataFormDisplayOptionsAttribute and DataFormItemPositionAttribute to configure display settings for the editor:

using DevExpress.Maui.DataForm;
using System.ComponentModel;
using System.Runtime.CompilerServices;
namespace SwitchItemSample {
    public class UserInfo : INotifyPropertyChanged {
        string username;
        public string Username {
            get { return this.username; }
            set {
                if (value != this.username) {
                    this.username = value;
                    NotifyPropertyChanged();
                }
            }
        }
        string email;
        public string Email {
            get { return this.email; }
            set {
                if (value != this.email) {
                    this.email = value;
                    NotifyPropertyChanged();
                }
            }
        }
        bool notificationsEnabled = false;
        [DataFormSwitchEditor (OnColor = "Coral", ThumbColor ="Gray")]
        [DataFormDisplayOptions (LabelText = "Receive notifications", LabelIcon = "envelope")]
        public bool NotificationsEnabled {
            get { return this.notificationsEnabled; }
            set {
                if (value != this.notificationsEnabled) {
                    this.notificationsEnabled = value;
                    NotifyPropertyChanged();
                }
            }
        }
        public event PropertyChangedEventHandler PropertyChanged;
        private void NotifyPropertyChanged([CallerMemberName] String propertyName = "") {
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
        }
    }
    public partial class MainPage : ContentPage {
        public MainPage() {
            InitializeComponent();
            dataForm.DataObject = new UserInfo();
        }
    }
}
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:dxdf="clr-namespace:DevExpress.Maui.DataForm;assembly=DevExpress.Maui.Editors"
             x:Class="SwitchItemSample.MainPage" Shell.TabBarIsVisible="False" Shell.NavBarIsVisible="False"
             xmlns:local="clr-namespace:SwitchItemSample">
    <dxdf:DataFormView x:Name="dataForm" CommitMode="Input"/>
</ContentPage>

Validate Input

You can use the following techniques to validate user input values:

For more information about input data validation, refer to the following help topic: Validate User Input in Data Form.

Manage the Display Item Value

You can use the following methods to specify or obtain the editor value or display text:

Specify Layout

Refer to the following help topic for more information on how to position editors in a DataFormView:

Read Tutorial: Layout in Data Form

Implements

Microsoft.Maui.IFrameworkElement
Microsoft.Maui.Controls.ITabStopElement
See Also