DataFormDateItem Class

Stores settings of the data form’s date editor.

Assembly: DevExpress.Maui.Editors.dll

NuGet Package: DevExpress.Maui.Editors

Declaration

public class DataFormDateItem :
    DataFormTextItemBase

Remarks

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

The following image shows a Data Form with a date-time editor:

DevExpress DataForm for MAUI -- Date editor

For a list of 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 Date-Time 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 date-time editor in a DataFormView, add a DataFormDateItem 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.

XAML

<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="DateItemSample.MainPage" Shell.NavBarIsVisible="False"
             xmlns:local="clr-namespace:DateItemSample">
    <dxdf:DataFormView x:Name="dataForm" CommitMode="Input" IsAutoGenerationEnabled="False">
        <dxdf:DataFormView.DataObject>
            <local:UserInfo/>
        </dxdf:DataFormView.DataObject>
        <dxdf:DataFormDateItem FieldName="BirthDate" LabelText="Birth Date" 
                               AutofillContentType="AndroidBirthDate"
                               ClearIconVisibility="Always"
                               DisplayFormat="m"
                               MinDate="1920,01,01"
                               UseNativePicker="False"
                               EditorWidth="300"
                               HelpText="Your date of birth"/>
    </dxdf:DataFormView>    
</ContentPage>

using DevExpress.Maui.Core;
using DevExpress.Maui.DataForm;
using DevExpress.Maui.Editors;
using System.ComponentModel;
using System.Runtime.CompilerServices;

namespace DateItemSample {
    public class UserInfo : INotifyPropertyChanged {
        string username;
        public string Username {
            get { return this.username; }
            set {
                if (value != this.username) {
                    this.username = value;
                    NotifyPropertyChanged();
                }
            }
        }
        DateTime birthDate;
        public DateTime BirthDate {
            get { return this.birthDate; }
            set {
                if (value != this.birthDate) {
                    this.birthDate = 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 DataFormDateEditorAttribute to the Data Object’s property whose values you want to edit in a date 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 DateItemSample {
    public class UserInfo : INotifyPropertyChanged {
        string username;
        public string Username {
            get { return this.username; }
            set {
                if (value != this.username) {
                    this.username = value;
                    NotifyPropertyChanged();
                }
            }
        }
        DateTime birthDate;
        [DataFormDateEditor (AutofillContentType = DateAutofillContentType.AndroidBirthDate, ClearIconVisibility = IconVisibility.Always,
            DisplayFormat = "m", MinDate = "1920,01,01", UseNativePicker = false)]
        [DataFormDisplayOptions (EditorWidth = "300", HelpText = "Your date of birth", LabelText = "Birth Date")]
        public DateTime BirthDate {
            get { return this.birthDate; }
            set {
                if (value != this.birthDate) {
                    this.birthDate = 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();
        }
    }
}

XAML

<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="DateItemSample.MainPage" Shell.NavBarIsVisible="False"
             xmlns:local="clr-namespace:DateItemSample">
    <dxdf:DataFormView x:Name="dataForm" CommitMode="Input" IsAutoGenerationEnabled="True">
        <!--...-->
    </dxdf:DataFormView>    
</ContentPage>

Validate Input

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

Use data annotations.
Handle the DataFormView.ValidateProperty and/or DataFormView.ValidateForm event.
Implement the IDataErrorInfo or INotifyDataErrorInfo interface in the Data Object.

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:

DataFormItem.SetValue(Object newValue) – Specifies the Data Form editor value.
DataFormItem.GetValue() – Returns the current value of the data form editor.
DataFormView.GetValue(String propertyName) – Returns the current value of a Data Form editor by the name of the property to which the editor is bound.