Class DataFormItem

Represents the class that encapsulates the layout and editor setting for a data field appearing in DataForm.

Inheritance

System.Object

DataFormItem

DataFormTextEditorItem

DataFormTimeItem

Inherited Members

DataFormViewItem.ColumnSpan

DataFormViewItem.ColumnSpanProperty

DataFormViewItem.IsVisible

DataFormViewItem.IsVisibleProperty

DataFormViewItem.OnPropertyChanged(String)

DataFormViewItem.Padding

DataFormViewItem.PaddingProperty

DataFormViewItem.RowOrder

DataFormViewItem.RowOrderProperty

DataFormViewItem.RowSpan

DataFormViewItem.RowSpanProperty

Namespace: Syncfusion.Maui.DataForm

Assembly: Syncfusion.Maui.DataForm.dll

Syntax

public abstract class DataFormItem : DataFormViewItem, IThemeElement

Constructors

DataFormItem()

Initializes a new instance of the DataFormItem class.

Declaration

protected DataFormItem()

Fields

BackgroundProperty

Identifies the Background dependency property.

Declaration

public static readonly BindableProperty BackgroundProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for Background dependency property.

DefaultLayoutSettingsProperty

Identifies the DefaultLayoutSettings dependency property.

Declaration

public static readonly BindableProperty DefaultLayoutSettingsProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for DefaultLayoutSettings dependency property.

EditorHeightProperty

Identifies the EditorHeight dependency property.

Declaration

public static readonly BindableProperty EditorHeightProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for EditorHeight dependency property.

EditorTextStyleProperty

Identifies the EditorTextStyle dependency property.

Declaration

public static readonly BindableProperty EditorTextStyleProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for EditorTextStyle dependency property.

ErrorLabelTextStyleProperty

Identifies the ErrorLabelTextStyle dependency property.

Declaration

public static readonly BindableProperty ErrorLabelTextStyleProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for ErrorLabelTextStyle dependency property.

FieldNameProperty

Identifies the FieldName dependency property.

Declaration

public static readonly BindableProperty FieldNameProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for FieldName dependency property.

GroupNameProperty

Identifies the GroupName dependency property.

Declaration

public static readonly BindableProperty GroupNameProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for GroupName dependency property.

IsReadOnlyProperty

Identifies the IsReadOnly dependency property.

Declaration

public static readonly BindableProperty IsReadOnlyProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for IsReadOnly dependency property.

ItemsOrderInRowProperty

Identifies the ItemsOrderInRow dependency property.

Declaration

public static readonly BindableProperty ItemsOrderInRowProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for ItemsOrderInRow dependency property.

LabelTextProperty

Identifies the LabelText dependency property.

Declaration

public static readonly BindableProperty LabelTextProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for LabelText dependency property.

LabelTextStyleProperty

Identifies the LabelTextStyle dependency property.

Declaration

public static readonly BindableProperty LabelTextStyleProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for LabelTextStyle dependency property.

LayoutTypeProperty

Identifies the LayoutType dependency property.

Declaration

public static readonly BindableProperty LayoutTypeProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for LayoutType dependency property.

LeadingViewPositionProperty

Identifies the LeadingViewPosition dependency property.

Declaration

public static readonly BindableProperty LeadingViewPositionProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for LeadingViewPosition dependency property.

LeadingViewProperty

Identifies the LeadingView dependency property.

Declaration

public static readonly BindableProperty LeadingViewProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for LeadingView dependency property.

PlaceholderColorProperty

Identifies the PlaceholderColor dependency property.

Declaration

public static readonly BindableProperty PlaceholderColorProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for PlaceholderColor dependency property.

PlaceholderTextProperty

Identifies the PlaceholderText dependency property.

Declaration

public static readonly BindableProperty PlaceholderTextProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for PlaceholderText dependency property.

ShowLabelProperty

Identifies the ShowLabel dependency property.

Declaration

public static readonly BindableProperty ShowLabelProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for ShowLabel dependency property.

ShowLeadingViewProperty

Identifies the ShowLeadingView dependency property.

Declaration

public static readonly BindableProperty ShowLeadingViewProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for ShowLeadingView dependency property.

ShowTrailingViewProperty

Identifies the ShowTrailingView dependency property.

Declaration

public static readonly BindableProperty ShowTrailingViewProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for ShowTrailingView dependency property.

TextInputLayoutSettingsProperty

Identifies the TextInputLayoutSettings dependency property.

Declaration

public static readonly BindableProperty TextInputLayoutSettingsProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for TextInputLayoutSettings dependency property.

TrailingViewPositionProperty

Identifies the TrailingViewPosition dependency property.

Declaration

public static readonly BindableProperty TrailingViewPositionProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for TrailingViewPosition dependency property.

TrailingViewProperty

Identifies the TrailingView dependency property.

Declaration

public static readonly BindableProperty TrailingViewProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for TrailingView dependency property.

ValidMessageLabelTextStyleProperty

Identifies the ValidMessageLabelTextStyle dependency property.

Declaration

public static readonly BindableProperty ValidMessageLabelTextStyleProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for ValidMessageLabelTextStyle dependency property.

Properties

Background

Gets or sets the background to the data form item layout which is used to render label and editor for the data field.

Declaration

public Brush Background { get; set; }

Property Value

Type	Description
Microsoft.Maui.Controls.Brush	The default value is `null`.

Examples

The below examples shows, how to set the Background property of DataFormItem in the SfDataForm.

XAML
C#
C#
C#
C#

<dataForm:SfDataForm x:Name="dataForm">
</dataForm:SfDataForm>

public class DataFormViewModel
{
   public AccountInfo AccountInfo { get;set; }
}

public class AccountInfo
{
   public string UserName { get; set; }
   [DataType(DataType.Password)]
   public string Password { get; set; }
}

this.dataForm.AutoGenerateItems = true;
this.dataForm.DataObject = new DataFormViewModel().AccountInfo;
this.dataForm.GenerateDataFormItem += OnDataFormGenerateDataFormItem;
private void OnDataFormGenerateDataFormItem(object sender, GenerateDataFormItemEventArgs e)
{
   if (e.DataFormItem != null)
   {
      e.DataFormItem.Background = Colors.LightGreen;
   }
}

this.dataForm.AutoGenerateItems = false;
var items = new ObservableCollection<DataFormViewItem>();
items.Add(new DataFormTextItem() { FieldName = "UserName", Background = Colors.LightGreen });
items.Add(new DataFormPasswordItem() { FieldName = "Password", Background = Colors.LightGreen });
this.dataForm.Items = items;

DefaultLayoutSettings

Gets or sets the value of layout (holds label and editor) settings which is used to customize the label position, label width and editor width.

Declaration

public DataFormDefaultLayoutSettings DefaultLayoutSettings { get; set; }

Property Value

Type	Description
DataFormDefaultLayoutSettings	The default value is `null`.

Remarks

The DefaultLayoutSettings property takes precedence when explicitly defined to particular editor otherwise where DefaultLayoutSettings will be applied to the editor.

Examples

The below examples shows, how to set the DefaultLayoutSettings property of DataFormItem in the SfDataForm.

XAML
C#
C#
C#
C#

<dataForm:SfDataForm x:Name="dataForm"
                     AutoGenerateItems="False">
</dataForm:SfDataForm>

public class DataFormViewModel
{
   public AccountInfo AccountInfo { get;set; }
}

public class AccountInfo
{
   public string UserName { get; set; }
   [DataType(DataType.Password)]
   public string Password { get; set; }
}

this.dataForm.AutoGenerateItems = true;
this.dataForm.DataObject = new DataFormViewModel().AccountInfo;
this.dataForm.GenerateDataFormItem += OnDataFormGenerateDataFormItem;
private void OnDataFormGenerateDataFormItem(object sender, GenerateDataFormItemEventArgs e)
{
   if (e.DataFormItem != null)
   {
      e.DataFormItem.DefaultLayoutSettings = = new DataFormDefaultLayoutSettings()
      {
         LabelPosition = DataFormLabelPosition.Top,
         LabelWidth = new DataFormItemLength(0.3, DataFormItemLengthUnitType.Star),
         EditorWidth = new DataFormItemLength(0.10, DataFormItemLengthUnitType.Star)
      };
   }
}

var defaultLayoutSettings = new DataFormDefaultLayoutSettings()
{
   LabelPosition = DataFormLabelPosition.Top,
   LabelWidth = new DataFormItemLength(0.3, DataFormItemLengthUnitType.Star),
   EditorWidth = new DataFormItemLength(0.10, DataFormItemLengthUnitType.Star)
};
this.dataForm.AutoGenerateItems = false;
var items = new ObservableCollection<DataFormViewItem>();
items.Add(new DataFormTextItem() { FieldName = "UserName", DefaultLayoutSettings = defaultLayoutSettings });
items.Add(new DataFormPasswordItem() { FieldName = "Password", DefaultLayoutSettings = defaultLayoutSettings });
this.dataForm.Items = items;

EditorHeight

Gets or sets the height of the editor.

Declaration

public double EditorHeight { get; set; }

Property Value

Type	Description
System.Double	The default value is`double.NaN`.

Remarks

For Syncfusion.Maui.DataForm.DataFormMultilineTextEditor if the EditorHeight is explicitly set, the editor will expand to match the specified EditorHeight value, if text changed beyond EditorHeight, then the editor will expand based on text in both default and floating label layouts. For DataFormCustomItem if the height is mentioned in the custom view, the editor will expand to match the specified height added in both default and floating label layouts. Else, you can explicitly set the height using the EditorHeight property. For Syncfusion.Maui.DataForm.DataFormRadioGroupEditor height will be considered for each button in default layout. For the Default layout(Label and editor), the layout auto expands to the maximum size of the label and the editor height for the label position is left.

Examples

The below examples shows, how to set the height property of data form item.

<dataForm:SfDataForm x:Name="dataForm">
</dataForm:SfDataForm>

public class DataFormViewModel
{
   public AccountInfo AccountInfo { get;set; }
}

public class AccountInfo
{
   public string UserName { get; set; }
   [DataType(DataType.Password)]
   public string Password { get; set; }
}

this.dataForm.DataObject = new DataFormViewModel().AccountInfo;
this.dataForm.GenerateDataFormItem += OnDataFormGenerateDataFormItem;
private void OnDataFormGenerateDataFormItem(object sender, GenerateDataFormItemEventArgs e)
{
   if (e.DataFormItem != null)
   {
      e.DataFormItem.EditorHeight = 36;
   }
}

EditorTextStyle

Gets or sets the style of editor text, that used to customize the text color, font, font size, font family and font attributes.

Declaration

public DataFormTextStyle EditorTextStyle { get; set; }

Property Value

Type	Description
DataFormTextStyle	The default value is `null`.

Remarks

The EditorTextStyle property takes precedence when explicitly defined to particular editor otherwise where EditorTextStyle will be applied to the editor.

Examples

The below examples shows, how to set the EditorTextStyle property of DataFormItem in the SfDataForm.

XAML
C#
C#
C#
C#

<dataForm:SfDataForm x:Name="dataForm"
                     AutoGenerateItems="False">
</dataForm:SfDataForm>

public class DataFormViewModel
{
   public AccountInfo AccountInfo { get;set; }
}

public class AccountInfo
{
   public string UserName { get; set; }
   [DataType(DataType.Password)]
   public string Password { get; set; }
}

this.dataForm.AutoGenerateItems = true;
this.dataForm.DataObject = new DataFormViewModel().AccountInfo;
this.dataForm.GenerateDataFormItem += OnDataFormGenerateDataFormItem;
private void OnDataFormGenerateDataFormItem(object sender, GenerateDataFormItemEventArgs e)
{
   if (e.DataFormItem != null)
   {
      e.DataFormItem.EditorTextStyle = new DataFormTextStyle()
      {
         TextColor = Colors.Orange,
         FontSize = 12,
      };
   }
}

 var editorTextStyle = new DataFormTextStyle()
 {
   TextColor = Colors.Orange,
   FontSize = 12,
 };
 this.dataForm.AutoGenerateItems = false;
 var items = new ObservableCollection<DataFormViewItem>();
 items.Add(new DataFormTextItem() { FieldName = "UserName", EditorTextStyle = editorTextStyle });
 items.Add(new DataFormPasswordItem() { FieldName = "Password", EditorTextStyle = editorTextStyle });
 this.dataForm.Items = items;

ErrorLabelTextStyle

Gets or sets the style of error message label , that used to customize the text color, font, font size, font family and font attributes.

Declaration

public DataFormTextStyle ErrorLabelTextStyle { get; set; }

Property Value

Type	Description
DataFormTextStyle	The default value is `null`.

Remarks

The ErrorLabelTextStyle property takes precedence when explicitly defined to particular editor otherwise where ErrorLabelTextStyle will be applied to the editor.

Examples

The below examples shows, how to set the ErrorLabelTextStyle property of DataFormItem in the SfDataForm.

XAML
C#
C#
C#
C#

<dataForm:SfDataForm x:Name="dataForm"
                     AutoGenerateItems="False">
</dataForm:SfDataForm>

public class DataFormViewModel
{
    public AccountInfo AccountInfo { get;set; }
}

public class AccountInfo
{
   public string UserName { get; set; }
   [DataType(DataType.Password)]
   public string Password { get; set; }
}

this.dataForm.AutoGenerateItems = true;
this.dataForm.DataObject = new DataFormViewModel().AccountInfo;
this.dataForm.GenerateDataFormItem += OnDataFormGenerateDataFormItem;
private void OnDataFormGenerateDataFormItem(object sender, GenerateDataFormItemEventArgs e)
{
   if (e.DataFormItem != null)
   {
      e.DataFormItem.ErrorLabelTextStyle = new DataFormTextStyle()
      {
         TextColor = Colors.Orange,
         FontSize = 14,
      };
   }
}

 var errorLabelTextStyle = new DataFormTextStyle()
 {
   TextColor = Colors.Orange,
   FontSize = 14,
 };
 this.dataForm.AutoGenerateItems = false;
 var items = new ObservableCollection<DataFormViewItem>();
 items.Add(new DataFormTextItem() { FieldName = "UserName", ErrorLabelTextStyle = errorLabelTextStyle });
 items.Add(new DataFormPasswordItem() { FieldName = "Password", ErrorLabelTextStyle = errorLabelTextStyle });
 this.dataForm.Items = items;

FieldName

Gets or sets the editor's name in the data form.

Declaration

public string FieldName { get; set; }

Property Value

Type	Description
System.String	The default value is `System.String.Empty`.

Examples

The below examples shows, how to use the FieldName property of DataFormItem in the SfDataForm.

XAML
C#

<dataForm:SfDataForm x:Name="dataForm"
                     AutoGenerateItems="False">
   <dataForm:SfDataForm.Items>
       <dataForm:DataFormTextItem FieldName="UserName"/>
       <dataForm:DataFormPasswordItem FieldName="Password"/>
   </dataForm:SfDataForm.Items>
</dataForm:SfDataForm>

this.dataForm.AutoGenerateItems = false;
var items = new ObservableCollection<DataFormViewItem>();
items.Add(new DataFormTextItem() { FieldName = "UserName" });
items.Add(new DataFormPasswordItem() { FieldName = "Password" });
this.dataForm.Items = items;

GroupName

Gets or sets the name of the group to the editor.

Declaration

public string GroupName { get; set; }

Property Value

Type	Description
System.String	The default value is `System.String.Empty`.

Examples

The below examples shows, how to use the GroupName property of DataFormItem in the SfDataForm.

XAML
C#
C#
C#
C#

<dataForm:SfDataForm x:Name="dataForm">
</dataForm:SfDataForm>

public class DataFormViewModel
{
   public AccountInfo AccountInfo { get;set; }
}

public class AccountInfo
{
   public string UserName { get; set; }
   [DataType(DataType.Password)]
   public string Password { get; set; }
}

this.dataForm.AutoGenerateItems = true;
this.dataForm.DataObject = new DataFormViewModel().AccountInfo;
this.dataForm.GenerateDataFormItem += OnDataFormGenerateDataFormItem;
private void OnDataFormGenerateDataFormItem(object sender, GenerateDataFormItemEventArgs e)
{
   if (e.DataFormItem != null)
   {
      e.DataFormItem.GroupName = "SignIn";
   }
}

this.dataForm.AutoGenerateItems = false;
DataFormGroupItem dataFormGroupItem = new DataFormGroupItem();
dataFormGroupItem.Name = "SignIn";
dataFormGroupItem.IsExpanded = true;
dataFormGroupItem.Items = new ObservableCollection<DataFormItem>();
dataFormGroupItem.Items.Add(new DataFormTextItem() { FieldName = "UserName", GroupName = "SignIn" });
dataFormGroupItem.Items.Add(new DataFormPasswordItem() { FieldName = "Password", GroupName = "SignIn" });
this.dataForm.Items.Add(dataFormGroupItem);

IsReadOnly

Gets or sets a value indicating whether editor can be enabled or disabled.

Declaration

public Nullable<bool> IsReadOnly { get; set; }

Property Value

Type	Description
System.Nullable<System.Boolean>	The default value is `null`.

Remarks

The IsReadOnly property takes precedence when explicitly defined to particular editor otherwise where IsReadOnly will be applied to the editor.

Examples

The below examples shows, how to set the IsReadOnly property of DataFormItem in the SfDataForm.

XAML
C#
C#
C#
C#

<dataForm:SfDataForm x:Name="dataForm">
</dataForm:SfDataForm>

public class DataFormViewModel
{
    public AccountInfo AccountInfo { get;set; }
}

public class AccountInfo
{
   public string UserName { get; set; }
   [DataType(DataType.Password)]
   public string Password { get; set; }
}

this.dataForm.AutoGenerateItems = true;
this.dataForm.DataObject = new DataFormViewModel().AccountInfo;
this.dataForm.GenerateDataFormItem += OnDataFormGenerateDataFormItem;
private void OnDataFormGenerateDataFormItem(object sender, GenerateDataFormItemEventArgs e)
{
   if (e.DataFormItem != null)
   {
      e.DataFormItem.IsReadOnly = true;
   }
}

this.dataForm.AutoGenerateItems = false;
var items = new ObservableCollection<DataFormViewItem>();
items.Add(new DataFormTextItem() { FieldName = "UserName", IsReadOnly= true });
items.Add(new DataFormPasswordItem() { FieldName = "Password", IsReadOnly= true });
this.dataForm.Items = items;

IsValid

Gets a value indicating whether this DataFormItem is valid or not.

Declaration

public bool IsValid { get; }

Property Value

Type
System.Boolean

ItemsOrderInRow

Gets or sets the editor’s position in a row.

Declaration

public int ItemsOrderInRow { get; set; }

Property Value

Type	Description
System.Int32	The default value is `-1`.

Remarks

This property is applicable to only when the ColumnCount is greater than 1. The items on the data form are arranged in layout rows. Use the RowOrder property to specify the number of the layout row where the item should be displayed. Use the ItemsOrderInRow property to display multiple editors in a single row. Two items with the same RowOrder property value are placed in this row according to their ItemOrderInRow property values.

Examples

The below examples shows, how to set the ItemsOrderInRow property of DataFormItem in the SfDataForm.

XAML
C#
C#
C#
C#

<dataForm:SfDataForm x:Name="dataForm" AutoGenerateItems="False"
                     ColumnCount="2">
</dataForm:SfDataForm>

public class DataFormViewModel
{
   public AccountInfo AccountInfo { get;set; }
}

public class AccountInfo
{
   public string UserName { get; set; }
   [DataType(DataType.Password)]
   public string Password { get; set; }
}

this.dataForm.AutoGenerateItems = true;
this.dataForm.ColumnCount = 2;
this.dataForm.DataObject = new DataFormViewModel().AccountInfo;
this.dataForm.GenerateDataFormItem += OnDataFormGenerateDataFormItem;
private void OnDataFormGenerateDataFormItem(object sender, GenerateDataFormItemEventArgs e)
{
   if (e.DataFormItem != null)
   {
     if (e.DataFormItem.FieldName == "UserName")
     {
        e.DataFormItem.ItemsOrderInRow = 0;
     }
     else if(e.DataFormItem.FieldName == "Password")
     {
        e.DataFormItem.ItemsOrderInRow = 1;
     }
  }
}

this.dataForm.ColumnCount = 2;
this.dataForm.AutoGenerateItems = false;
var items = new ObservableCollection<DataFormViewItem>();
items.Add(new DataFormTextItem() { FieldName = "UserName", ItemsOrderInRow = 0 });
items.Add(new DataFormPasswordItem() { FieldName = "Password", ItemsOrderInRow = 1 });
this.dataForm.Items = items;

LabelText

Gets or sets the editor’s label text.

Declaration

public string LabelText { get; set; }

Property Value

Type	Description
System.String	The default value is `System.String.Empty`.

Remarks

If Label Text is not mentioned, the field name value will be considered as label text.

Examples

The below examples shows, how to use the LabelText property of DataFormItem in the SfDataForm.

XAML
C#
C#
C#
C#

<dataForm:SfDataForm x:Name="dataForm">
</dataForm:SfDataForm>

public class DataFormViewModel
{
   public AccountInfo AccountInfo { get;set; }
}

public class AccountInfo
{
   public string UserName { get; set; }
   [DataType(DataType.Password)]
   public string Password { get; set; }
}

this.dataForm.AutoGenerateItems = true;
this.dataForm.DataObject = new DataFormViewModel().AccountInfo;
this.dataForm.GenerateDataFormItem += OnDataFormGenerateDataFormItem;
private void OnDataFormGenerateDataFormItem(object sender, GenerateDataFormItemEventArgs e)
{
   if (e.DataFormItem != null && e.DataFormItem.FieldName == "UserName")
   {
      e.DataFormItem.LabelText = "User Name";
   }
}

this.dataForm.AutoGenerateItems = false;
var items = new ObservableCollection<DataFormViewItem>();
items.Add(new DataFormTextItem() { FieldName = "UserName", LabelText="User Name" });
items.Add(new DataFormPasswordItem() { FieldName = "Password", LabelText= "Password" });
this.dataForm.Items = items;

LabelTextStyle

Gets or sets the style of editor label text, that used to customize the text color, font, font size, font family and font attributes.

Declaration

public DataFormTextStyle LabelTextStyle { get; set; }

Property Value

Type	Description
DataFormTextStyle	The default value is `null`.

Remarks

The LabelTextStyle property takes precedence when explicitly defined to particular editor otherwise where LabelTextStyle will be applied to the editor.

Examples

The below examples shows, how to set the LabelTextStyle property of DataFormItem in the SfDataForm.

XAML
C#
C#
C#
C#

<dataForm:SfDataForm x:Name="dataForm"
                     AutoGenerateItems="False">
</dataForm:SfDataForm>

public class DataFormViewModel
{
    public AccountInfo AccountInfo { get;set; }
}

public class AccountInfo
{
   public string UserName { get; set; }
   [DataType(DataType.Password)]
   public string Password { get; set; }
}

this.dataForm.AutoGenerateItems = true;
this.dataForm.DataObject = new DataFormViewModel().AccountInfo;
this.dataForm.GenerateDataFormItem += OnDataFormGenerateDataFormItem;
private void OnDataFormGenerateDataFormItem(object sender, GenerateDataFormItemEventArgs e)
{
   if (e.DataFormItem != null)
   {
      e.DataFormItem.LabelTextStyle = new DataFormTextStyle()
      {
         TextColor = Colors.Orange,
         FontSize = 14,
      };
   }
}

 var labelTextStyle = new DataFormTextStyle()
 {
   TextColor = Colors.Orange,
   FontSize = 14,
 };
 var items = new ObservableCollection<DataFormViewItem>();
 items.Add(new DataFormTextItem() { FieldName = "UserName", LabelTextStyle = labelTextStyle });
 items.Add(new DataFormPasswordItem() { FieldName = "Password", LabelTextStyle = labelTextStyle });
 this.dataForm.Items = items;

LayoutType

Gets or sets layout option.

Declaration

public Nullable<DataFormLayoutType> LayoutType { get; set; }

Property Value

Type	Description
System.Nullable<DataFormLayoutType>	The default value is`null`.

Examples

The below examples shows, how to set the LayoutType property of DataFormItem in the SfDataForm.

<dataForm:SfDataForm x:Name="dataForm"
            AutoGenerateItems="False">
        <dataForm:DataFormTextItem FieldName="Name" LayoutType="TextInputLayout">
        </dataForm:DataFormTextItem>
</dataForm:SfDataForm>

public class DataFormViewModel
{
   public AccountInfo AccountInfo { get;set; }
}

public class AccountInfo
{
   public string UserName { get; set; }
   [DataType(DataType.Password)]
   public string Password { get; set; }
}

this.dataForm.AutoGenerateItems = true;
this.dataForm.DataObject = new DataFormViewModel().AccountInfo;
this.dataForm.GenerateDataFormItem += OnDataFormGenerateDataFormItem;
private void OnDataFormGenerateDataFormItem(object sender, GenerateDataFormItemEventArgs e)
{
   if (e.DataFormItem != null)
   {
     if (e.DataFormItem.FieldName == "UserName")
     {
        e.DataFormItem.LayoutType = DataFormLayoutType.TextInputLayout;
     }
   }
}

LeadingView

Gets or sets the view used as the editor's label for Default, and places it before the input view for TextInputLayout.

Declaration

public View LeadingView { get; set; }

Property Value

Type	Description
Microsoft.Maui.Controls.View	The default value is `null`.

Examples

The below examples shows, how to set the LeadingView property of DataFormItem in the SfDataForm.

<dataForm:SfDataForm x:Name="dataForm" AutoGenerateItems="False">
        <dataForm:DataFormTextItem FieldName="Name">
            <dataForm:DataFormTextItem.LeadingView>
                <Label Text="F" FontSize="18" FontFamily="MauiSampleFontIcon" HeightRequest="24" VerticalTextAlignment="End" />
            </dataForm:DataFormTextItem.LeadingView>
        </dataForm:DataFormTextItem>
</dataForm:SfDataForm>

public class DataFormViewModel
{
   public AccountInfo AccountInfo { get;set; }
}

public class AccountInfo
{
   public string UserName { get; set; }
   [DataType(DataType.Password)]
   public string Password { get; set; }
}

this.dataForm.AutoGenerateItems = true;
this.dataForm.DataObject = new DataFormViewModel().AccountInfo;
this.dataForm.GenerateDataFormItem += OnDataFormGenerateDataFormItem;
private void OnDataFormGenerateDataFormItem(object sender, GenerateDataFormItemEventArgs e)
{
   if (e.DataFormItem != null)
   {
     if (e.DataFormItem.FieldName == "UserName")
     {
        e.DataFormItem.LeadingView = new Label { Text = "F", FontSize = 18, HeightRequest = 24, VerticalTextAlignment = TextAlignment.End };
     }
   }
}

Declaration

public TextInputLayoutViewPosition LeadingViewPosition { get; set; }

Property Value

Type	Description
TextInputLayoutViewPosition	The default value is Outside.

Remarks

The LeadingViewPosition property is applicable only when LayoutType or LayoutType is TextInputLayout. The LeadingViewPosition property is not applicable when LayoutType or LayoutType is Default.

Examples

The below examples shows, how to set the LeadingViewPosition property of DataFormItem in the SfDataForm.

<dataForm:SfDataForm x:Name="dataForm" AutoGenerateItems="False">
        <dataForm:DataFormTextItem FieldName="Name" ShowLeadingView="True" LeadingViewPosition="Inside" LayoutType="TextInputLayout">
            <dataForm:DataFormTextItem.LeadingView>
                <Label Text="F" FontSize="18" FontFamily="MauiSampleFontIcon" HeightRequest="24" VerticalTextAlignment="End" />
            </dataForm:DataFormTextItem.LeadingView>
        </dataForm:DataFormTextItem>
</dataForm:SfDataForm>

public class DataFormViewModel
{
   public AccountInfo AccountInfo { get;set; }
}

public class AccountInfo
{
   public string UserName { get; set; }
   [DataType(DataType.Password)]
   public string Password { get; set; }
}

this.dataForm.AutoGenerateItems = true;
this.dataForm.DataObject = new DataFormViewModel().AccountInfo;
this.dataForm.GenerateDataFormItem += OnDataFormGenerateDataFormItem;
private void OnDataFormGenerateDataFormItem(object sender, GenerateDataFormItemEventArgs e)
{
   if (e.DataFormItem != null)
   {
     if (e.DataFormItem.FieldName == "UserName")
     {
        e.DataFormItem.LayoutType = DataFormLayoutType.TextInputLayout;
        e.DataFormItem.LeadingView = new Label { Text = "F", FontSize = 18, HeightRequest = 24, VerticalTextAlignment = TextAlignment.End };
        e.DataFormItem.ShowLeadingView = true;
        e.DataFormItem.LeadingViewPosition = TextInputLayoutViewPosition.Inside;
     }
   }
}

PlaceholderColor

Gets or sets the color of prompt string displayed or the water mark to provide hint for users in the editors.

Declaration

public Color PlaceholderColor { get; set; }

Property Value

Type	Description
Microsoft.Maui.Graphics.Color	The default value is `default(Color)`.

Remarks

This property is applicable to only when the PlaceholderText is applied.

Examples

The below examples shows, how to use the PlaceholderColor property of DataFormItem in the SfDataForm.

XAML
C#
C#
C#
C#

<dataForm:SfDataForm x:Name="dataForm">
</dataForm:SfDataForm>

public class DataFormViewModel
{
    public AccountInfo AccountInfo { get;set; }
}

public class AccountInfo
{
   public string UserName { get; set; }
   [DataType(DataType.Password)]
   public string Password { get; set; }
}

this.dataForm.AutoGenerateItems = true;
this.dataForm.DataObject = new DataFormViewModel().AccountInfo;
this.dataForm.GenerateDataFormItem += OnDataFormGenerateDataFormItem;
private void OnDataFormGenerateDataFormItem(object sender, GenerateDataFormItemEventArgs e)
{
   if (e.DataFormItem != null)
   {
      e.DataFormItem.PlaceholderColor = Colors.LightGreen;
      if (e.DataFormItem.FieldName == "UserName")
      {
         e.DataFormItem.PlaceholderText = "Enter the username";
      }
      else if(e.DataFormItem.FieldName == "Password")
      {
       e.DataFormItem.PlaceholderText = "Enter the password";
      }
   }
}

this.dataForm.AutoGenerateItems = false;
var items = new ObservableCollection<DataFormViewItem>();
items.Add(new DataFormTextItem() { FieldName = "UserName", PlaceholderText = "Enter the username", PlaceholderColor = Colors.LightGreen });
items.Add(new DataFormPasswordItem() { FieldName = "Password", PlaceholderText = "Enter the password", PlaceholderColor = Colors.LightGreen });
this.dataForm.Items = items;

PlaceholderText

Gets or sets the prompt string displayed or the water mark to provide hint for users in the editors.

Declaration

public string PlaceholderText { get; set; }

Property Value

Type	Description
System.String	The default value is `System.String.Empty`.

Examples

The below examples shows, how to use the PlaceholderText property of DataFormItem in the SfDataForm.

XAML
C#
C#
C#
C#

<dataForm:SfDataForm x:Name="dataForm">
</dataForm:SfDataForm>

public class DataFormViewModel
{
    public AccountInfo AccountInfo { get;set; }
}

public class AccountInfo
{
   public string UserName { get; set; }
   [DataType(DataType.Password)]
   public string Password { get; set; }
}

this.dataForm.AutoGenerateItems = true;
this.dataForm.DataObject = new DataFormViewModel().AccountInfo;
this.dataForm.GenerateDataFormItem += OnDataFormGenerateDataFormItem;
private void OnDataFormGenerateDataFormItem(object sender, GenerateDataFormItemEventArgs e)
{
   if (e.DataFormItem != null)
   {
      if (e.DataFormItem.FieldName == "UserName")
      {
         e.DataFormItem.PlaceholderText = "Enter the username";
      }
      else if(e.DataFormItem.FieldName == "Password")
      {
       e.DataFormItem.PlaceholderText = "Enter the password";
      }
   }
}

this.dataForm.AutoGenerateItems = false;
var items = new ObservableCollection<DataFormViewItem>();
items.Add(new DataFormTextItem() { FieldName = "UserName", PlaceholderText = "Enter the username" });
items.Add(new DataFormPasswordItem() { FieldName = "Password", PlaceholderText = "Enter the password" });
this.dataForm.Items = items;

PropertyInfo

Gets the property info of the data field.

Declaration

public PropertyInfo PropertyInfo { get; }

Property Value

Type
System.Reflection.PropertyInfo

ShowLabel

Gets or sets a value indicating whether to show the label to the editor.

Declaration

public bool ShowLabel { get; set; }

Property Value

Type	Description
System.Boolean	The default value is `true`.

Examples

The below examples shows, how to use the ShowLabel property of DataFormItem in the SfDataForm.

XAML
C#
C#
C#
C#

<dataForm:SfDataForm x:Name="dataForm">
</dataForm:SfDataForm>

public class DataFormViewModel
{
    public AccountInfo AccountInfo { get;set; }
}

public class AccountInfo
{
   public string UserName { get; set; }
   [DataType(DataType.Password)]
   public string Password { get; set; }
}

this.dataForm.AutoGenerateItems = true;
this.dataForm.DataObject = new DataFormViewModel().AccountInfo;
this.dataForm.GenerateDataFormItem += OnDataFormGenerateDataFormItem;
private void OnDataFormGenerateDataFormItem(object sender, GenerateDataFormItemEventArgs e)
{
   if (e.DataFormItem != null)
   {
      e.DataFormItem.ShowLabel = false;
   }
}

this.dataForm.AutoGenerateItems = false;
var items = new ObservableCollection<DataFormViewItem>();
items.Add(new DataFormTextItem() { FieldName = "UserName", ShowLabel=false });
items.Add(new DataFormPasswordItem() { FieldName = "Password", ShowLabel=false });
this.dataForm.Items = items;

ShowLeadingView

Gets or sets a value indicating whether to show the leading view to the editor.

Declaration

public bool ShowLeadingView { get; set; }

Property Value

Type	Description
System.Boolean	The default value is `true`.

Remarks

Use this ShowLeadingView property whether to display image as editor's label.

Examples

The below examples shows, how to set the ShowLeadingView property of DataFormItem in the SfDataForm.

<dataForm:SfDataForm x:Name="dataForm" AutoGenerateItems="False">
        <dataForm:DataFormTextItem FieldName="Name" ShowLeadingView="True">
            <dataForm:DataFormTextItem.LeadingView>
                <Label Text="F" FontSize="18" FontFamily="MauiSampleFontIcon" HeightRequest="24" VerticalTextAlignment="End" />
            </dataForm:DataFormTextItem.LeadingView>
        </dataForm:DataFormTextItem>
</dataForm:SfDataForm>

public class DataFormViewModel
{
   public AccountInfo AccountInfo { get;set; }
}

public class AccountInfo
{
   public string UserName { get; set; }
   [DataType(DataType.Password)]
   public string Password { get; set; }
}

this.dataForm.AutoGenerateItems = true;
this.dataForm.DataObject = new DataFormViewModel().AccountInfo;
this.dataForm.GenerateDataFormItem += OnDataFormGenerateDataFormItem;
private void OnDataFormGenerateDataFormItem(object sender, GenerateDataFormItemEventArgs e)
{
   if (e.DataFormItem != null)
   {
     if (e.DataFormItem.FieldName == "UserName")
     {
        e.DataFormItem.LeadingView = new Label { Text = "F", FontSize = 18, HeightRequest = 24, VerticalTextAlignment = TextAlignment.End };
        e.DataFormItem.ShowLeadingView = true;
     }
   }
}

ShowTrailingView

Gets or sets a value indicating whether to show or hide the trailing view of data form floating label layout.

Declaration

public bool ShowTrailingView { get; set; }

Property Value

Type	Description
System.Boolean	The default value is`true`.

Remarks

The ShowTrailingView property is applicable only when LayoutType or LayoutType is TextInputLayout.

Examples

The below examples shows, how to set the ShowTrailingView property of DataFormItem in the SfDataForm.

<dataForm:SfDataForm x:Name="dataForm" AutoGenerateItems="False">
        <dataForm:DataFormTextItem FieldName="Name" ShowTrailingView="True" LayoutType="TextInputLayout">
            <dataForm:DataFormTextItem.TrailingView>
                <Label Text="F" FontSize="18" FontFamily="MauiSampleFontIcon" HeightRequest="24" VerticalTextAlignment="End" />
            </dataForm:DataFormTextItem.TrailingView>
        </dataForm:DataFormTextItem>
</dataForm:SfDataForm>

public class DataFormViewModel
{
   public AccountInfo AccountInfo { get;set; }
}

public class AccountInfo
{
   public string UserName { get; set; }
   [DataType(DataType.Password)]
   public string Password { get; set; }
}

this.dataForm.AutoGenerateItems = true;
this.dataForm.DataObject = new DataFormViewModel().AccountInfo;
this.dataForm.GenerateDataFormItem += OnDataFormGenerateDataFormItem;
private void OnDataFormGenerateDataFormItem(object sender, GenerateDataFormItemEventArgs e)
{
   if (e.DataFormItem != null)
   {
     if (e.DataFormItem.FieldName == "UserName")
     {
        e.DataFormItem.LayoutType = DataFormLayoutType.TextInputLayout;
        e.DataFormItem.TrailingView = new Label { Text = "F", FontSize = 18, HeightRequest = 24, VerticalTextAlignment = TextAlignment.End };
        e.DataFormItem.ShowTrailingView = true;
     }
   }
}

TextInputLayoutSettings

Gets or sets text input layout settings.

Declaration

public TextInputLayoutSettings TextInputLayoutSettings { get; set; }

Property Value

Type	Description
TextInputLayoutSettings	The default value is `null`

Remarks

The TextInputLayoutSettings property is applicable only when LayoutType or LayoutType is TextInputLayout.

Examples

The below examples shows, how to set the TextInputLayoutSettings property of DataFormItem in the SfDataForm.

<dataForm:SfDataForm x:Name="dataForm" AutoGenerateItems="False">
        <dataForm:DataFormTextItem FieldName="Name" LayoutType="TextInputLayout">
            <dataForm:DataFormTextItem.TextInputLayoutSettings>
                <dataForm:TextInputLayoutSettings ContainerType="Outlined"/>
            </dataForm:DataFormTextItem.TextInputLayoutSettings>
        </dataForm:DataFormTextItem>
</dataForm:SfDataForm>

public class DataFormViewModel
{
   public AccountInfo AccountInfo { get;set; }
}

public class AccountInfo
{
   public string UserName { get; set; }
   [DataType(DataType.Password)]
   public string Password { get; set; }
}

this.dataForm.AutoGenerateItems = true;
this.dataForm.DataObject = new DataFormViewModel().AccountInfo;
this.dataForm.GenerateDataFormItem += OnDataFormGenerateDataFormItem;
private void OnDataFormGenerateDataFormItem(object sender, GenerateDataFormItemEventArgs e)
{
   if (e.DataFormItem != null)
   {
     if (e.DataFormItem.FieldName == "UserName")
     {
        e.DataFormItem.LayoutType = DataFormLayoutType.TextInputLayout;
        e.DataFormItem.TextInputLayoutSettings = new TextInputLayoutSettings { ContainerType = TextInputLayoutContainerType.Outlined };
     }
   }
}

TrailingView

Gets or sets a value for a view to place after input view of data form floating label layout.

Declaration

public View TrailingView { get; set; }

Property Value

Type	Description
Microsoft.Maui.Controls.View	The default value is `null`.

Remarks

The TrailingView property is applicable only when LayoutType or LayoutType is TextInputLayout.

Examples

The below examples shows, how to set the TrailingView property of DataFormItem in the SfDataForm.

<dataForm:SfDataForm x:Name="dataForm" AutoGenerateItems="False">
        <dataForm:DataFormTextItem FieldName="Name" LayoutType="TextInputLayout">
            <dataForm:DataFormTextItem.TrailingView>
                <Label Text="F" FontSize="18" FontFamily="MauiSampleFontIcon" HeightRequest="24" VerticalTextAlignment="End" />
            </dataForm:DataFormTextItem.TrailingView>
        </dataForm:DataFormTextItem>
</dataForm:SfDataForm>

public class DataFormViewModel
{
   public AccountInfo AccountInfo { get;set; }
}

public class AccountInfo
{
   public string UserName { get; set; }
   [DataType(DataType.Password)]
   public string Password { get; set; }
}

this.dataForm.AutoGenerateItems = true;
this.dataForm.DataObject = new DataFormViewModel().AccountInfo;
this.dataForm.GenerateDataFormItem += OnDataFormGenerateDataFormItem;
private void OnDataFormGenerateDataFormItem(object sender, GenerateDataFormItemEventArgs e)
{
   if (e.DataFormItem != null)
   {
     if (e.DataFormItem.FieldName == "UserName")
     {
        e.DataFormItem.LayoutType = DataFormLayoutType.TextInputLayout;
        e.DataFormItem.TrailingView = new Label { Text = "F", FontSize = 18, HeightRequest = 24, VerticalTextAlignment = TextAlignment.End };
     }
   }
}

Declaration

public TextInputLayoutViewPosition TrailingViewPosition { get; set; }

Property Value

Type	Description
TextInputLayoutViewPosition	The default value is Outside.

Remarks

The TrailingViewPosition property is applicable only when LayoutType or LayoutType is TextInputLayout.

Examples

The below examples shows, how to set the TrailingViewPosition property of DataFormItem in the SfDataForm.

<dataForm:SfDataForm x:Name="dataForm" AutoGenerateItems="False">
        <dataForm:DataFormTextItem FieldName="Name" ShowTrailingView="True" TrailingViewPosition="Inside" LayoutType="TextInputLayout">
            <dataForm:DataFormTextItem.TrailingView>
                <Label Text="F" FontSize="18" FontFamily="MauiSampleFontIcon" HeightRequest="24" VerticalTextAlignment="End" />
            </dataForm:DataFormTextItem.TrailingView>
        </dataForm:DataFormTextItem>
</dataForm:SfDataForm>

public class DataFormViewModel
{
   public AccountInfo AccountInfo { get;set; }
}

public class AccountInfo
{
   public string UserName { get; set; }
   [DataType(DataType.Password)]
   public string Password { get; set; }
}

this.dataForm.AutoGenerateItems = true;
this.dataForm.DataObject = new DataFormViewModel().AccountInfo;
this.dataForm.GenerateDataFormItem += OnDataFormGenerateDataFormItem;
private void OnDataFormGenerateDataFormItem(object sender, GenerateDataFormItemEventArgs e)
{
   if (e.DataFormItem != null)
   {
     if (e.DataFormItem.FieldName == "UserName")
     {
        e.DataFormItem.LayoutType = DataFormLayoutType.TextInputLayout;
        e.DataFormItem.TrailingView = new Label { Text = "F", FontSize = 18, HeightRequest = 24, VerticalTextAlignment = TextAlignment.End };
        e.DataFormItem.ShowTrailingView = true;
        e.DataFormItem.TrailingViewPosition = TextInputLayoutViewPosition.Inside;
     }
   }
}

ValidMessageLabelTextStyle

Gets or sets the style of valid message label, that used to customize the text color, font, font size, font family and font attributes.

Declaration

public DataFormTextStyle ValidMessageLabelTextStyle { get; set; }

Property Value

Type	Description
DataFormTextStyle	The default value is `null`.

Remarks

The ValidMessageLabelTextStyle property takes precedence when explicitly defined to particular editor otherwise where ValidMessageLabelTextStyle will be applied to the editor.

Examples

The below examples shows, how to set the ValidMessageLabelTextStyle property of DataFormItem in the SfDataForm.

XAML
C#
C#
C#
C#

<dataForm:SfDataForm x:Name="dataForm"
                     AutoGenerateItems="False">
</dataForm:SfDataForm>

public class DataFormViewModel
{
   public AccountInfo AccountInfo { get;set; }
}

public class AccountInfo
{
   public string UserName { get; set; }
   [DataType(DataType.Password)]
   public string Password { get; set; }
}

this.dataForm.AutoGenerateItems = true;
this.dataForm.DataObject = new DataFormViewModel().AccountInfo;
this.dataForm.GenerateDataFormItem += OnDataFormGenerateDataFormItem;
private void OnDataFormGenerateDataFormItem(object sender, GenerateDataFormItemEventArgs e)
{
   if (e.DataFormItem != null)
   {
      e.DataFormItem.ValidMessageLabelTextStyle = new DataFormTextStyle()
      {
         TextColor = Colors.Blue,
         FontSize = 14,
      };
   }
}

 var validMessageLabelTextStyle = new DataFormTextStyle()
 {
     TextColor = Colors.Blue,
     FontSize = 14,
 };
 this.dataForm.AutoGenerateItems = false;
 var items = new ObservableCollection<DataFormViewItem>();
 items.Add(new DataFormTextItem() { FieldName = "UserName", ValidMessageLabelTextStyle = validMessageLabelTextStyle });
 items.Add(new DataFormPasswordItem() { FieldName = "Password", ValidMessageLabelTextStyle = validMessageLabelTextStyle });
 this.dataForm.Items = items;

Methods

GetValue()

Gets the property value from business object.

Declaration

public object GetValue()

Returns

Type	Description
System.Object	The property value.

OnBindingContextChanged()

Invokes on the binding context of the view changed.

Declaration

protected override void OnBindingContextChanged()

SetValue(Object)

Sets the property value to business object.

Declaration

public void SetValue(object value)

Parameters

Type	Name	Description
System.Object	value	The property value.