Class SfExpander

Represents a collapsible container that can be expanded or collapsed to show or hide its content.

Inheritance

System.Object

SfView

SfExpander

Implements

IDrawableLayout

Microsoft.Maui.Graphics.IDrawable

Microsoft.Maui.IAbsoluteLayout

Microsoft.Maui.ILayout

Microsoft.Maui.IView

Microsoft.Maui.IElement

Microsoft.Maui.ITransform

Microsoft.Maui.IContainer

System.Collections.Generic.IList<Microsoft.Maui.IView>

System.Collections.Generic.ICollection<Microsoft.Maui.IView>

System.Collections.Generic.IEnumerable<Microsoft.Maui.IView>

System.Collections.IEnumerable

Microsoft.Maui.ISafeAreaView

Microsoft.Maui.IPadding

Microsoft.Maui.ICrossPlatformLayout

Microsoft.Maui.IVisualTreeElement

Inherited Members

SfView.Children

SfView.ClipToBounds

SfView.Padding

Namespace: Syncfusion.Maui.Toolkit.Expander

Assembly: Syncfusion.Maui.Toolkit.dll

Syntax

public class SfExpander : SfView, IDrawableLayout, IDrawable, IAbsoluteLayout, ILayout, IView, IElement, ITransform, IContainer, IList<IView>, ICollection<IView>, IEnumerable<IView>, IEnumerable, ISafeAreaView, IPadding, ICrossPlatformLayout, IVisualTreeElement, ISemanticsProvider, IParentThemeElement, IThemeElement

Constructors

SfExpander()

Initializes a new instance of the SfExpander class.

Declaration

public SfExpander()

Fields

AnimationDurationProperty

Identifies the AnimationDuration bindable property.

Declaration

public static readonly BindableProperty AnimationDurationProperty

Field Value

Type
Microsoft.Maui.Controls.BindableProperty

Remarks

The AnimationDurationProperty property specifies the duration of the animation in milliseconds.

AnimationEasingProperty

Identifies the AnimationEasing bindable property.

Declaration

public static readonly BindableProperty AnimationEasingProperty

Field Value

Type
Microsoft.Maui.Controls.BindableProperty

Remarks

The AnimationEasingProperty property specifies the easing function to be applied during the animation of the control.

ContentProperty

Identifies the Content bindable property.

Declaration

public static readonly BindableProperty ContentProperty

Field Value

Type
Microsoft.Maui.Controls.BindableProperty

Remarks

The ContentProperty property determines the content that will be displayed.

HeaderBackgroundProperty

Identifies the HeaderBackground bindable property.

Declaration

public static readonly BindableProperty HeaderBackgroundProperty

Field Value

Type
Microsoft.Maui.Controls.BindableProperty

Remarks

The HeaderBackgroundProperty property specifies the background appearance of the header.

HeaderIconColorProperty

Identifies the HeaderIconColor bindable property.

Declaration

public static readonly BindableProperty HeaderIconColorProperty

Field Value

Type
Microsoft.Maui.Controls.BindableProperty

Remarks

The HeaderIconColorProperty property specifies the color of the header icon.

HeaderIconPositionProperty

Identifies the HeaderIconPosition bindable property.

Declaration

public static readonly BindableProperty HeaderIconPositionProperty

Field Value

Type
Microsoft.Maui.Controls.BindableProperty

Remarks

The HeaderIconPositionProperty property determines the position of the header icon.

HeaderProperty

Identifies the Header bindable property.

Declaration

public static readonly BindableProperty HeaderProperty

Field Value

Type
Microsoft.Maui.Controls.BindableProperty

Remarks

The HeaderProperty property specifies the header content that will be displayed.

IsExpandedProperty

Identifies the IsExpanded bindable property.

Declaration

public static readonly BindableProperty IsExpandedProperty

Field Value

Type
Microsoft.Maui.Controls.BindableProperty

Remarks

The IsExpandedProperty property determines whether the control is expanded or collapsed.

Properties

AnimationDuration

Gets or sets the duration of the expand and collapse animations in milliseconds for the SfExpander.

Declaration

public double AnimationDuration { get; set; }

Property Value

Type	Description
System.Double	It accepts System.Double. The default value is 250 milliseconds.

Remarks

The AnimationDuration property allows you to customize the speed of the animation when the expander toggles between its expanded and collapsed states. Adjusting this value can provide a faster or slower animation experience based on your application's needs.

Examples

Here is an example of how to set the AnimationDuration property:

• XAML
• C#

<local:SfExpander x:Name="expander"
                  IsExpanded="True"
                  AnimationDuration="500">
</local:SfExpander>

AnimationEasing

Gets or sets the ExpanderAnimationEasing function for an expand and collapse animation.

Declaration

public ExpanderAnimationEasing AnimationEasing { get; set; }

Property Value

Type	Description
ExpanderAnimationEasing	It accepts a ExpanderAnimationEasing.The default value is ExpanderAnimationEasing.Linear.

Remarks

Set this property to None to disable the animation for SfExpander.

Examples

Here is an example demonstrating how to set the AnimationEasing property:

• XAML
• C#

<syncfusion:SfExpander AnimationEasing="SinIn"/>

See Also

AnimationDuration

Content

Gets or sets the content to be displayed when the SfExpander is expanded.

Declaration

public View Content { get; set; }

Property Value

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

Remarks

The Content property specifies the content to be displayed inside the control, such as text, images, or custom views.

Examples

Here is an example of how to set the Content property in XAML and C#:

• XAML
• C#

<syncfusion:SfExpander.Content>
    <Grid Padding="18,8,0,18">
        <Label 
            CharacterSpacing="0.25" 
            FontFamily="Roboto-Regular"
            Text="11:03 AM, 15 January 2019" 
            FontSize="14" />                  
    </Grid>
</syncfusion:SfExpander.Content>

See Also

Header

Header

Gets or sets the view that is displayed in the header of the SfExpander.

Declaration

public View Header { get; set; }

Property Value

Type	Description
Microsoft.Maui.Controls.View	It accepts a Microsoft.Maui.Controls.View. The default value is false.

Remarks

Use this property to customize the header of the SfExpander. You can set any view, such as a layout or a specific control, as the header. This provides flexibility in designing the UI to match the application's theme and functionality. Ensure that the view used for the header is appropriately sized to fit within the layout constraints of the SfExpander.

Examples

Here is an example demonstrating how to use the SfExpander with the IsExpanded property:

• XAML
• C#

<syncfusion:SfExpander x:Name="expander"
                       IsExpanded="True">
    <syncfusion:SfExpander.Header>
        <Label Text="Tap to expand" FontSize="16" />
    </syncfusion:SfExpander.Header>
</syncfusion:SfExpander>

See Also

Content

HeaderBackground

Gets or sets the background color of the header area in the SfExpander control.

Declaration

public Brush HeaderBackground { get; set; }

Property Value

Type	Description
Microsoft.Maui.Controls.Brush	It accepts the Microsoft.Maui.Controls.Brush. The default value is Transparent.

Remarks

The HeaderBackground property specifies the background appearance of the header, allowing customization with solid colors, gradients, or images.

Examples

Here is an example demonstrating how to set the HeaderBackground property:

• XAML
• C#

 <syncfusion:SfExpander HeaderBackground = "Red"/>

See Also

HeaderIconColor

HeaderIconColor

Gets or sets the color of the header icon in the SfExpander control.

Declaration

public Color HeaderIconColor { get; set; }

Property Value

Type	Description
Microsoft.Maui.Graphics.Color	It accepts the Microsoft.Maui.Graphics.Color. The default value is dark grayish-purple.

Remarks

The HeaderIconColor property specifies the color of the icon displayed in the header, allowing customization to match the theme or design of the control.

Examples

Here is an example demonstrating how to set the HeaderIconColor property:

• XAML
• C#

 <syncfusion:SfExpander HeaderIconColor = "Red"/>

See Also

HeaderIconPosition

HeaderBackground

HeaderIconPosition

Gets or sets the ExpanderIconPosition of the header icon in the SfExpander control.

Declaration

public ExpanderIconPosition HeaderIconPosition { get; set; }

Property Value

Type	Description
ExpanderIconPosition	Accepts a ExpanderIconPosition. The default value is ExpanderIconPosition.End.

Remarks

The HeaderIconPosition property determines the position of the icon within the header, such as at the start or end of the header content.

Examples

Here is an example demonstrating how to set the HeaderIconPosition:

• XAML
• C#

<syncfusion:SfExpander HeaderIconPosition="Start"/>

See Also

HeaderBackground

IsExpanded

Gets or sets a value indicating whether the SfExpander control's content is expanded.

Declaration

public bool IsExpanded { get; set; }

Property Value

Type	Description
System.Boolean	Accepts a System.Boolean. The default value is false.

Remarks

The IsExpanded property determines whether the content of the Expander control is displayed expanded or collapsed. When set to true, the content is displayed expanded; when set to false, the content is displayed collapsed.

Examples

Here is an example demonstrating how to use the SfExpander with the IsExpanded property:

• XAML
• C#

<syncfusion:SfExpander x:Name="expander"
                       IsExpanded="True">
    <syncfusion:SfExpander.Header>
        <Label Text="Tap to expand" FontSize="16" />
    </syncfusion:SfExpander.Header>
    <syncfusion:SfExpander.Content>
        <Label Text="This content is visible because IsExpanded is set to True."
               FontSize="14"
               TextColor="Black" />
    </syncfusion:SfExpander.Content>
</syncfusion:SfExpander>

Methods

AnimationCompleted()

Triggers after the animation has been completed.

Declaration

protected virtual void AnimationCompleted()

ArrangeContent(Rect)

Arrange the child views in Expander.

Declaration

protected override Size ArrangeContent(Rect bounds)

Parameters

Type	Name	Description
Microsoft.Maui.Graphics.Rect	bounds	Bounds of Expander.

Returns

Type	Description
Microsoft.Maui.Graphics.Size	Returns the required size to arrange Expander.

Overrides

Syncfusion.Maui.Toolkit.SfView.ArrangeContent(Microsoft.Maui.Graphics.Rect)

ChangeVisualState()

Helps to trigger the VisualState initially when View is loaded.

Declaration

protected override void ChangeVisualState()

MeasureContent(Double, Double)

Measure the child views in Expander.

Declaration

protected override Size MeasureContent(double widthConstraint, double heightConstraint)

Parameters

Type	Name	Description
System.Double	widthConstraint	Width of Expander.
System.Double	heightConstraint	Height of Expander.

Returns

Type	Description
Microsoft.Maui.Graphics.Size	Returns measured size of Expander.

Overrides

Syncfusion.Maui.Toolkit.SfView.MeasureContent(System.Double, System.Double)

OnHandlerChanged()

Raised when handler gets changed.

Declaration

protected override void OnHandlerChanged()

Overrides

Syncfusion.Maui.Toolkit.SfView.OnHandlerChanged()

OnPropertyChanged(String)

Need to handle the run time changes of System.ComponentModel.PropertyChangedEventArgs of SfExpander.

Declaration

protected override void OnPropertyChanged(string propertyName = null)

Parameters

Type	Name	Description
System.String	propertyName	Represents the property changed event arguments.

RaiseCollapsedEvent()

Occurs when collapsing operation completes

Declaration

protected virtual void RaiseCollapsedEvent()

RaiseCollapsingEvent()

Occurs when collpasing operation starts

Declaration

protected virtual void RaiseCollapsingEvent()

RaiseExpandedEvent()

Occurs when expanding operation completes

Declaration

protected virtual void RaiseExpandedEvent()

RaiseExpandingEvent()

Occurs when expanding operation is performed

Declaration

protected virtual void RaiseExpandingEvent()

Events

Collapsed

Occurs when the SfExpander control is collapsed.

Declaration

public event EventHandler<ExpandedAndCollapsedEventArgs> Collapsed

Event Type

Type
System.EventHandler<ExpandedAndCollapsedEventArgs>

Remarks

The event handler receives an argument of type ExpandingAndCollapsingEventArgs containing data related to this event.

Examples

expander.Collapsed += Expander_Collapsed;
private void Expander_Collapsed(object sender, ExpandedAndCollapsedEventArgs e)
{
    expander.HeaderBackground = Color.Aqua;
}

See Also

Expanding

Expanded

Collapsing

Collapsing

Occurs when the SfExpander control is being collapsed.

Declaration

public event EventHandler<ExpandingAndCollapsingEventArgs> Collapsing

Event Type

Type
System.EventHandler<ExpandingAndCollapsingEventArgs>

Examples

expander.Collapsing += Expander_Collapsing;
private void Expander_Collapsing(object sender, ExpandingAndCollapsingEventArgs e)
{
    // Below code cancels the collapsing operation of the SfExpander control.
    e.Cancel = true;
}

See Also

Expanding

Expanded

Collapsed

Expanded

Occurs when the SfExpander control is expanded.

Declaration

public event EventHandler<ExpandedAndCollapsedEventArgs> Expanded

Event Type

Type
System.EventHandler<ExpandedAndCollapsedEventArgs>

Remarks

The event handler receives an argument of type ExpandingAndCollapsingEventArgs containing data related to this event.

Examples

expander.Expanded += Expander_Expanded;
private void Expander_Expanded(object sender, ExpandedAndCollapsedEventArgs e)
{
    expander.HeaderBackground = Color.YellowGreen;
}

See Also

Expanding

Collapsed

Collapsing

Expanding

Occurs when the SfExpander control is being expanded.

Declaration

public event EventHandler<ExpandingAndCollapsingEventArgs> Expanding

Event Type

Type
System.EventHandler<ExpandingAndCollapsingEventArgs>

Examples

expander.Expanding += Expander_Expanding;
private void Expander_Expanding(object sender, ExpandingAndCollapsingEventArgs e)
{
    // Below code cancels the expanding operation of the SfExpander control.
    e.Cancel = true;
}

See Also

Expanded

Collapsed

Collapsing

Implements

IDrawableLayout

Microsoft.Maui.Graphics.IDrawable

Microsoft.Maui.IAbsoluteLayout

Microsoft.Maui.ILayout

Microsoft.Maui.IView

Microsoft.Maui.IElement

Microsoft.Maui.ITransform

Microsoft.Maui.IContainer

System.Collections.Generic.IList<>

System.Collections.Generic.ICollection<>

System.Collections.Generic.IEnumerable<>

System.Collections.IEnumerable

Microsoft.Maui.ISafeAreaView

Microsoft.Maui.IPadding

Microsoft.Maui.ICrossPlatformLayout

Microsoft.Maui.IVisualTreeElement