Class SfAccordion
Represents a collapsible accordion control that displays a list of expandable items.
Inherited Members
Namespace: Syncfusion.Maui.Toolkit.Accordion
Assembly: Syncfusion.Maui.Toolkit.dll
Syntax
public class SfAccordion : AccordionLayout, IParentThemeElement, IThemeElement, IKeyboardListener
Remarks
The SfAccordion control allows you to organize content into collapsible sections called items. Each item can be expanded or collapsed to show or hide its associated content.
Constructors
SfAccordion()
Initializes a new instance of the SfAccordion class and initializes the default values of its members.
Declaration
public SfAccordion()
Fields
AnimationDurationProperty
Identifies the AnimationDuration bindable property.
Declaration
public static readonly BindableProperty AnimationDurationProperty
Field Value
Type |
---|
Microsoft.Maui.Controls.BindableProperty |
Remarks
The AnimationDurationProperty determines the duration of animations within the control.
AnimationEasingProperty
Identifies the AnimationEasing bindable property.
Declaration
public static readonly BindableProperty AnimationEasingProperty
Field Value
Type |
---|
Microsoft.Maui.Controls.BindableProperty |
Remarks
The AnimationEasingProperty determines the easing function used for animations in the control.
AutoScrollPositionProperty
Identifies the AutoScrollPosition bindable property.
Declaration
public static readonly BindableProperty AutoScrollPositionProperty
Field Value
Type |
---|
Microsoft.Maui.Controls.BindableProperty |
Remarks
The AutoScrollPositionProperty determines the automatic scroll position within the control.
ExpandModeProperty
Identifies the ExpandMode bindable property.
Declaration
public static readonly BindableProperty ExpandModeProperty
Field Value
Type |
---|
Microsoft.Maui.Controls.BindableProperty |
Remarks
The ExpandModeProperty determines the mode of expansion or collapse behavior within the control.
HeaderIconPositionProperty
Identifies the HeaderIconPosition bindable property.
Declaration
public static readonly BindableProperty HeaderIconPositionProperty
Field Value
Type |
---|
Microsoft.Maui.Controls.BindableProperty |
Remarks
The HeaderIconPositionProperty determines the location of the header icon within the control. This bindable property is read-only.
ItemSpacingProperty
Identifies the ItemSpacing bindable property.
Declaration
public static readonly BindableProperty ItemSpacingProperty
Field Value
Type |
---|
Microsoft.Maui.Controls.BindableProperty |
Remarks
The ItemSpacingProperty determines the spacing between items within the control.
ItemsProperty
Identifies the Items bindable property.
Declaration
public static readonly BindableProperty ItemsProperty
Field Value
Type |
---|
Microsoft.Maui.Controls.BindableProperty |
Remarks
The ItemsProperty determines the collection of items contained within the control.
Properties
AnimationDuration
Gets or sets the duration of the animation when expanding or collapsing the AccordionItem.
Declaration
public double AnimationDuration { get; set; }
Property Value
Type | Description |
---|---|
System.Double | A duration, in milliseconds, for the expand and collapse animation. The default value is 200 milliseconds. |
Remarks
The animation duration determines how long it takes for accordion items to transition between expanded and collapsed states, enhancing the user experience by providing a smooth visual effect.
Examples
Here is an example of how to set the AnimationDuration property:
AnimationEasing
Gets or sets the ExpanderAnimationEasing function applied to the animation when expanding or collapsing an item in the accordion.
Declaration
public ExpanderAnimationEasing AnimationEasing { get; set; }
Property Value
Type | Description |
---|---|
ExpanderAnimationEasing | An ExpanderAnimationEasing value that specifies the easing function for the expansion and collapse animations. The default value is Linear. |
Remarks
An easing function determines the speed progression of an animation, allowing for effects such as acceleration and deceleration.
Examples
Here is an example of how to set the AnimationEasing property:
AutoScrollPosition
Gets or sets the value to specify the scroll position of the expanded AccordionItem.
Declaration
public AccordionAutoScrollPosition AutoScrollPosition { get; set; }
Property Value
Type | Description |
---|---|
AccordionAutoScrollPosition | An AccordionAutoScrollPosition value that specifies how the expanded item is scrolled into view. The default value is MakeVisible. |
Remarks
The AccordionAutoScrollPosition property determines the scroll behavior for an expanded accordion item, ensuring that it is appropriately positioned within the visible area of the control.
Examples
Here is an example of how to set the AutoScrollPosition property:
ExpandMode
Gets or sets a value that indicates whether an end-user can expand a single or multiple accordion items.
Declaration
public AccordionExpandMode ExpandMode { get; set; }
Property Value
Type | Description |
---|---|
AccordionExpandMode | An AccordionExpandMode value that organizes the expand and collapse state of the accordion items. The default value is Single. |
Remarks
The AccordionExpandMode property allows the accordion to be configured so that either only a single item can be expanded at a time, or multiple items can be expanded simultaneously.
Examples
Here is an example of how to set the ExpandMode property:
HeaderIconPosition
Gets or sets the ExpanderIconPosition of the header icon in the AccordionItem.
Declaration
public ExpanderIconPosition HeaderIconPosition { get; set; }
Property Value
Type | Description |
---|---|
ExpanderIconPosition | An ExpanderIconPosition value that determines the position of the header icon. The default value is End. |
Remarks
The ExpanderIconPosition property allows customization of the position of the header icon within the accordion item.
Examples
Here is an example of how to set the HeaderIconPosition property:
Items
Gets or sets the collection of AccordionItem in the SfAccordion control.
Declaration
public ObservableCollection<AccordionItem> Items { get; set; }
Property Value
Type | Description |
---|---|
System.Collections.ObjectModel.ObservableCollection<AccordionItem> | An observable collection of AccordionItem that represents the items contained in the accordion. The default value is null. |
Remarks
Allows the inclusion of multiple accordion items within the SfAccordion control, where each item can have customized headers and content areas.
Examples
Here is an example of how to define items within the SfAccordion control:
<syncfusion:SfAccordion>
<syncfusion:SfAccordion.Items>
<syncfusion:AccordionItem>
<syncfusion:AccordionItem.Header>
<Grid>
<Label TextColor="#495F6E"
Text="Cheese burger"
HeightRequest="50"
VerticalTextAlignment="Center" />
</Grid>
</syncfusion:AccordionItem.Header>
<syncfusion:AccordionItem.Content>
<Grid Padding="10,10,10,10" BackgroundColor="#FFFFFF">
<Label TextColor="#303030"
Text="Hamburger accompanied with melted cheese. The term itself is a portmanteau of the words cheese and hamburger. The cheese is usually sliced, then added a short time before the hamburger finishes cooking to allow it to melt."
VerticalTextAlignment="Center" />
</Grid>
</syncfusion:AccordionItem.Content>
</syncfusion:AccordionItem>
</syncfusion:SfAccordion.Items>
</syncfusion:SfAccordion>
See Also
ItemSpacing
Gets or sets the spacing between the items in the SfAccordion.
Declaration
public double ItemSpacing { get; set; }
Property Value
Type | Description |
---|---|
System.Double | A System.Double value representing the space between each accordion item. The default value is 6.0d. |
Remarks
The spacing property determines the amount of space that appears between adjacent accordion items.
Examples
Here is an example of how to set the ItemSpacing property:
Methods
BringIntoView(AccordionItem)
Brings the specified AccordionItem into view by scrolling.
Declaration
public void BringIntoView(AccordionItem item)
Parameters
Type | Name | Description |
---|---|---|
AccordionItem | item | The AccordionItem to scroll into view. |
CreateLayoutManager()
Method used to create the accordion layout manager.
Declaration
protected override ILayoutManager CreateLayoutManager()
Returns
Type | Description |
---|---|
Microsoft.Maui.Layouts.ILayoutManager | An instance of Syncfusion.Maui.Toolkit.Accordion.AccordionLayoutManager for this control. |
MeasureOverride(Double, Double)
Method used to measure the accordion layout children based on width and height value.
Declaration
protected override Size MeasureOverride(double widthConstraint, double heightConstraint)
Parameters
Type | Name | Description |
---|---|---|
System.Double | widthConstraint | The maximum width request of the layout. |
System.Double | heightConstraint | The maximum height request of the layout. |
Returns
Type | Description |
---|---|
Microsoft.Maui.Graphics.Size | The required size of the layout. |
OnChildAdded(Element)
Invoked when a child element is added to the layout.
Declaration
protected override void OnChildAdded(Element child)
Parameters
Type | Name | Description |
---|---|---|
Microsoft.Maui.Controls.Element | child | The child Microsoft.Maui.Controls.Element that has been added. |
OnCommonThemeChanged(String, String)
Method invokes at whenever common theme changes.
Declaration
public void OnCommonThemeChanged(string oldTheme, string newTheme)
Parameters
Type | Name | Description |
---|---|---|
System.String | oldTheme | Represents the old theme. |
System.String | newTheme | Represents the new theme. |
OnControlThemeChanged(String, String)
Method invokes when control theme changes.
Declaration
public void OnControlThemeChanged(string oldTheme, string newTheme)
Parameters
Type | Name | Description |
---|---|---|
System.String | oldTheme | Represents the old theme. |
System.String | newTheme | Represents the new theme. |
OnHandlerChanged()
Raised when handler gets changed.
Declaration
protected override void OnHandlerChanged()
OnPropertyChanged(String)
Called whenever a property value changes of SfAccordion.
Declaration
protected override void OnPropertyChanged(string propertyName = null)
Parameters
Type | Name | Description |
---|---|---|
System.String | propertyName | The name of the property that changed. |
RaiseCollapsedEvent(Int32)
Raises the collapsed event for the specified item index.
Declaration
protected void RaiseCollapsedEvent(int index)
Parameters
Type | Name | Description |
---|---|---|
System.Int32 | index | The index of the item that has collapsed. |
RaiseCollapsingEvent(Int32)
Raises the collapsing event for the specified item index.
Declaration
protected bool RaiseCollapsingEvent(int index)
Parameters
Type | Name | Description |
---|---|---|
System.Int32 | index | The index of the item that is collapsing. |
Returns
Type | Description |
---|---|
System.Boolean | A boolean value indicating whether the collapsing action should be canceled. |
RaiseExpandedEvent(Int32)
Raises the expanded event for the specified item index.
Declaration
protected void RaiseExpandedEvent(int index)
Parameters
Type | Name | Description |
---|---|---|
System.Int32 | index | The index of the item that has expanded. |
RaiseExpandingEvent(Int32)
Raises the expanding event for the specified item index.
Declaration
protected bool RaiseExpandingEvent(int index)
Parameters
Type | Name | Description |
---|---|---|
System.Int32 | index | The index of the item that is expanding. |
Returns
Type | Description |
---|---|
System.Boolean | A boolean value indicating whether the expanding action should be canceled. |
Events
Collapsed
Occurs when an AccordionItem is collapsed.
Declaration
public event EventHandler<ExpandedAndCollapsedEventArgs> Collapsed
Event Type
Type |
---|
System.EventHandler<ExpandedAndCollapsedEventArgs> |
Examples
accordion.Collapsed += OnAccordionCollapsed;
private void OnAccordionCollapsed(object sender, ExpandedAndCollapsedEventArgs e)
{
var index = e.Index;
}
See Also
Collapsing
Occurs when an AccordionItem is being collapsed within the SfAccordion control.
Declaration
public event EventHandler<ExpandingAndCollapsingEventArgs> Collapsing
Event Type
Type |
---|
System.EventHandler<ExpandingAndCollapsingEventArgs> |
Examples
Here is an example of how to register the Collapsing event.
accordion.Collapsing += OnAccordionCollapsing;
private void OnAccordionCollapsing(object sender, ExpandingAndCollapsingEventArgs e)
{
e.Cancel = true;
}
See Also
Expanded
Occurs when an AccordionItem is expanded within the SfAccordion control.
Declaration
public event EventHandler<ExpandedAndCollapsedEventArgs> Expanded
Event Type
Type |
---|
System.EventHandler<ExpandedAndCollapsedEventArgs> |
Examples
Here is an example of how to register the Expanded event.
accordion.Expanded += OnAccordionExpanded;
private void OnAccordionExpanded(object sender, ExpandedAndCollapsedEventArgs e)
{
var index = e.Index;
}
See Also
Expanding
Occurs when an AccordionItem is in the process of expanding within the SfAccordion control.
Declaration
public event EventHandler<ExpandingAndCollapsingEventArgs> Expanding
Event Type
Type |
---|
System.EventHandler<ExpandingAndCollapsingEventArgs> |
Examples
Here is an example of how to register the Expanding event.
accordion.Expanding += OnAccordionExpanding;
private void OnAccordionExpanding(object sender, ExpandingAndCollapsingEventArgs e)
{
var index = e.Index;
e.Cancel = true;
}