Lesson 2: Define Editors

• May 14, 2021
• 3 minutes to read

This lesson explains how a data form generates editors, lists supported editor types, and demonstrates how to assign a specific editor to the property of a data form’s underlying data object.

Editors - Overview

DataFormView stores its editors in the Items collection. An individual editor is a DataFormItem class descendant.

When you assign a data object to the DataFormView.DataObject property, the data form generates editors for all object properties and populates the Items collection with objects that correspond to property types.

Property Value Type	Data Form Item	Editor
String, Char	DataFormTextItem	TextEdit
Numeric*	DataFormNumericItem	NumericEdit
Bool	DataFormSwitchItem	Switch
DateTime	DataFormDateItem	DateEdit
TimeSpan	DataFormTimeItem	TimeEdit
Enum	DataFormComboBoxItem	ComboBoxEdit

Numeric* - Byte, Decimal, Double, Int16, Int32, Int64, SByte, Single, UInt16, UInt32, UInt64.

To explicitly specify the data form editor for a data object’s property, use one of the approaches below:

• In C# code, apply an attribute to a property of the data object’s class.
• In XAML or C# code, add a data form item object to the DataFormView.Items collection and use the DataFormItem.FieldName property to bind the editor to the data object’s property.

The following table lists supported attributes and data form items used to define data form editors.

Attribute	Data Form Item	Editor
DataFormTextEditorAttribute DataFormMaskedEditorAttribute	DataFormTextItem DataFormMaskedItem	TextEdit
DataFormNumericEditorAttribute	DataFormNumericItem	NumericEdit
DataFormMultilineEditorAttribute	DataFormMultilineItem	MultilineEdit
DataFormPasswordEditorAttribute	DataFormPasswordItem	PasswordEdit
DataFormCheckBoxEditorAttribute	DataFormCheckBoxItem	CheckEdit
DataFormSwitchEditorAttribute	DataFormSwitchItem	Switch
DataFormDateEditorAttribute	DataFormDateItem	DateEdit
DataFormTimeEditorAttribute	DataFormTimeItem	TimeEdit
DataFormComboBoxEditorAttribute	DataFormComboBoxItem	ComboBoxEdit
-	DataFormCustomItem	Any editor that you specify

Each attribute and data form item object has properties to specify editor-specific settings. For example:

Classes	Properties	Descriptions
Descendants: DataFormTextEditorAttributeBase DataFormTextItemBase	InplaceLabelText Placeholder Prefix/Suffix Keyboard	Input prompt strings, prefix and suffix, and the keyboard type for a text editor.
DataFormMultilineEditorAttribute DataFormMultilineItem	MinLineCount MaxLineCount	The minimum and maximum number of lines in the MultilineEdit editor.
DataFormMaskedEditorAttribute DataFormMaskedItem	Mask	The input mask for the TextEdit editor.
DataFormDateEditorAttribute DataFormDateItem	MinDate MaxDate	The earliest and latest date that can be selected in the DateEdit editor.

Example

Open the solution created in Lesson 1 and assign the following editors to PersonalInfo object properties:

• PasswordEdit - to the Password property.
• TextEdit with a specified input mask and Telephone keyboard - to the Phone property.

Before	After

Apply attributes to the PersonalInfo class properties in C# code, or set up data form item objects in XAML markup.

Use Attributes

1. Place the DataFormPasswordEditorAttribute attribute before the Password property declaration.
2. Place the DataFormMaskedEditorAttribute attribute with the specified Mask and Keyboard parameters before the Phone property declaration.

C#

using DevExpress.XamarinForms.DataForm;
// ... 

namespace DataFormExample {
    public class PersonalInfo {
        public string FirstName { get; set; }
        public string LastName { get; set; }
        public DateTime BirthDate { get; set; }
        public virtual Gender Gender { get; set; }

        [DataFormPasswordEditor]
        public string Password { get; set; }

        public string Email { get; set; }

        [DataFormMaskedEditor(Mask = "[phone]", Keyboard = "Telephone")]
        public string Phone { get; set; }
    }
    public enum Gender { Female, Male, RatherNotSay }
}

Set Up Data Form Items

Add the following items to the data form’s Items collection:

• The DataFormPasswordItem object with the FieldName property set to Password.
• The DataFormMaskedItem object with the FieldName property set to Phone, and specified Mask and Keyboard settings.

XAML

<dxdf:DataFormView x:Name="dataForm">
    <dxdf:DataFormPasswordItem FieldName="Password"/>
    <dxdf:DataFormMaskedItem FieldName="Phone" Mask="[phone]" Keyboard="Telephone"/>
</dxdf:DataFormView>

When you add data form items to the Items collection, specify the RowOrder property for these items to set their position. Otherwise, corresponding editors are located at the top of the data form. The next lesson explains how to arrange editors.