# FTRAccordion

`FTRAccordion` is a modern, customizable accordion control for Windows Forms applications.

It allows you to organize related content into expandable sections, making it useful for settings panels, navigation areas, configuration forms, advanced options, and other interfaces where content needs to be grouped into collapsible sections.

## Features

* Expandable and collapsible panels
* Smooth expand/collapse animation
* Single or multiple expanded panels
* Custom panel titles
* Optional panel icons
* Theme-aware appearance
* Custom header colors
* Hover and selected header states
* Expand/collapse events
* Visual Studio Designer support
* Optional border
* Optional automatic height adjustment
* RTL-compatible control environment
* Premium features available with an FTR Controls license

---

# Getting Started

After installing the FTR Controls package, `FTRAccordion` is available from the **FTR Controls** section of the Visual Studio Toolbox.

Drag an `FTRAccordion` onto your Windows Forms form.

The accordion is designed to be configured directly from the Visual Studio Designer.

---

# Adding Panels

Panels are managed through the `Panels` property.

Select the accordion in the Visual Studio Designer and use the `Panels` collection editor to add or remove panels.

Each panel can have its own title and optional icon.

You can also create panels programmatically:

```csharp
var accordion = new FTRAccordion();

accordion.Panels.Add(new FTRAccordionPanel
{
    Title = "General"
});

accordion.Panels.Add(new FTRAccordionPanel
{
    Title = "Advanced"
});
```

The `Panels` property is the main property used to manage the sections displayed by the accordion.

---

# Working with Panel Content

Each `FTRAccordionPanel` acts as a normal Windows Forms container.

You can place standard WinForms controls inside a panel, including:

* `Label`
* `TextBox`
* `ComboBox`
* `CheckBox`
* `Button`
* `PictureBox`
* Other FTR Controls
* Custom Windows Forms controls

Example:

```csharp
var panel = new FTRAccordionPanel
{
    Title = "User Information"
};

panel.Controls.Add(new Label
{
    Text = "Name:",
    Left = 20,
    Top = 20
});

panel.Controls.Add(new TextBox
{
    Left = 20,
    Top = 45,
    Width = 220
});

accordion.Panels.Add(panel);
```

---

# FTRAccordionPanel

Each accordion section is represented by an `FTRAccordionPanel`.

## Title

Specifies the text displayed in the panel header.

```csharp
panel.Title = "General Settings";
```

Default value:

```text
Accordion Panel
```

---

## Icon

Specifies an optional image displayed in the panel header.

```csharp
panel.Icon = myImage;
```

If no icon is assigned, the title is displayed without an icon.

---

## IsExpanded

Indicates whether the panel is currently expanded.

The accordion manages this state when the user interacts with the panel headers.

---

# Accordion Properties

## Panels

**Type:** `FTRAccordionPanelCollection`

Contains the panels displayed by the accordion.

This is the primary property used to add and manage accordion sections.

---

## ExpandedPanelHeight

**Type:** `int`

**Default:** `150`

Specifies the height of the content area when a panel is expanded.

Example:

```csharp
accordion.ExpandedPanelHeight = 200;
```

A larger value provides more space for controls inside expanded panels.

---

## MultiExpanded

**Type:** `bool`

**Premium:** Yes

Controls whether more than one panel can remain open at the same time.

### Disabled

When `MultiExpanded` is disabled, the accordion operates in single-panel mode.

Only one panel can be expanded at a time.

### Enabled

When `MultiExpanded` is enabled, multiple panels can remain expanded simultaneously.

```csharp
accordion.MultiExpanded = true;
```

This property is a premium feature.

---

# Appearance

## GlobalBackColor

Specifies a custom background color for the accordion.

If no custom color is specified, the theme color is used.

---

## GlobalHeaderBackColor

Specifies the background color of panel headers.

```csharp
accordion.GlobalHeaderBackColor = Color.FromArgb(40, 40, 40);
```

---

## GlobalHeaderForeColor

Specifies the color of the text displayed in panel headers.

```csharp
accordion.GlobalHeaderForeColor = Color.White;
```

---

## GlobalHeaderHoverColor

Specifies the header background color when the mouse pointer is over a panel header.

---

## GlobalHeaderSelectedColor

Specifies the header background color of the currently expanded panel.

---

## GlobalHeaderSeparatorColor

Specifies the color of the separator displayed between the header and the panel content.

---

# Resetting Custom Colors

If a global color has been customized and you want to return to the theme-defined value, use the corresponding reset method.

For example:

```csharp
accordion.ResetGlobalHeaderBackColor();
accordion.ResetGlobalHeaderForeColor();
accordion.ResetGlobalHeaderHoverColor();
accordion.ResetGlobalHeaderSelectedColor();
accordion.ResetGlobalHeaderSeparatorColor();
```

After resetting, the accordion uses the appropriate theme color again.

---

# Theme Support

`FTRAccordion` automatically integrates with the FTR Controls theme system.

The appearance of the accordion follows the active FTR theme, including:

* Background
* Header colors
* Header text
* Hover state
* Selected/expanded state
* Separator
* Chevron appearance

You can use the global color properties when you want to override individual theme colors.

The available FTR theme modes are handled by the FTR Controls theme system.

---

# Border

## ShowBorder

**Type:** `bool`

**Premium:** Yes

Displays a border around the accordion.

```csharp
accordion.ShowBorder = true;
```

Default:

```text
false
```

`ShowBorder` is a premium feature.

---

# Automatic Height

## AutoFitHeight

**Type:** `bool`

**Premium:** Yes

Automatically adjusts the accordion height according to the content and expanded/collapsed panels.

```csharp
accordion.AutoFitHeight = true;
```

This can be useful when the accordion is placed in a layout where its height should follow its content.

`AutoFitHeight` is a premium feature.

---

# Events

`FTRAccordion` provides events that allow your application to respond to panel state changes.

## PanelExpanding

Raised before a panel is expanded.

The event provides `CancelEventArgs`, allowing the operation to be cancelled.

```csharp
accordion.PanelExpanding += (sender, e) =>
{
    if (!AllowExpansion())
        e.Cancel = true;
};
```

This is useful when you need to validate something before allowing a section to open.

---

## PanelExpanded

Raised after a panel has finished expanding.

```csharp
accordion.PanelExpanded += (sender, e) =>
{
    // Panel expansion completed
};
```

---

## PanelCollapsed

Raised after a panel has finished collapsing.

```csharp
accordion.PanelCollapsed += (sender, e) =>
{
    // Panel collapse completed
};
```

The available events are `PanelExpanding`, `PanelExpanded`, and `PanelCollapsed`.

---

# Basic Example

The following example creates an accordion with two sections:

```csharp
var accordion = new FTRAccordion
{
    Dock = DockStyle.Top,
    ExpandedPanelHeight = 180
};

accordion.Panels.Add(new FTRAccordionPanel
{
    Title = "General"
});

accordion.Panels.Add(new FTRAccordionPanel
{
    Title = "Advanced"
});

Controls.Add(accordion);
```

---

# Example with Controls

```csharp
var accordion = new FTRAccordion
{
    Dock = DockStyle.Top,
    ExpandedPanelHeight = 180
};

var general = new FTRAccordionPanel
{
    Title = "General"
};

general.Controls.Add(new Label
{
    Text = "User name:",
    Left = 20,
    Top = 20
});

general.Controls.Add(new TextBox
{
    Left = 20,
    Top = 45,
    Width = 250
});

var advanced = new FTRAccordionPanel
{
    Title = "Advanced"
};

advanced.Controls.Add(new CheckBox
{
    Text = "Enable advanced options",
    Left = 20,
    Top = 20
});

accordion.Panels.Add(general);
accordion.Panels.Add(advanced);

Controls.Add(accordion);
```

---

# Example with Multiple Expanded Panels

To allow multiple sections to remain open:

```csharp
var accordion = new FTRAccordion
{
    MultiExpanded = true,
    ExpandedPanelHeight = 180
};
```

You can then open multiple panels independently.

`MultiExpanded` requires a premium FTR Controls license.

---

# Example with Events

```csharp
accordion.PanelExpanding += (sender, e) =>
{
    // Optional validation
};

accordion.PanelExpanded += (sender, e) =>
{
    // Update UI after expansion
};

accordion.PanelCollapsed += (sender, e) =>
{
    // Update UI after collapse
};
```

---

# Using the Control in the Visual Studio Designer

`FTRAccordion` is designed to work with the Windows Forms Designer.

After placing the control on your form:

1. Select the `FTRAccordion`.
2. Open the `Panels` property.
3. Add the required panels.
4. Select each panel and configure its `Title`.
5. Optionally assign an `Icon`.
6. Add controls to the panel content area.
7. Configure the accordion appearance and behavior.

The `Panels` collection is exposed as the main editable property of the control.

---

# Recommended Usage

`FTRAccordion` is suitable for interfaces such as:

* Application settings
* Advanced configuration panels
* User profile forms
* Search/filter options
* Navigation sections
* Property editors
* Multi-section forms
* Optional or advanced settings

It is particularly useful when a form contains several groups of related controls that do not need to be visible simultaneously.

---

# Premium Features

The following `FTRAccordion` features require an appropriate FTR Controls license:

| Feature                  | Property        |
| ------------------------ | --------------- |
| Border                   | `ShowBorder`    |
| Automatic height         | `AutoFitHeight` |
| Multiple expanded panels | `MultiExpanded` |

Without a valid license, attempting to enable a protected premium feature may display the FTR Controls activation prompt.

---

# Property Reference

| Property                     | Type                          | Premium | Description                               |
| ---------------------------- | ----------------------------- | ------: | ----------------------------------------- |
| `Panels`                     | `FTRAccordionPanelCollection` |      No | Accordion sections                        |
| `ExpandedPanelHeight`        | `int`                         |      No | Expanded content height                   |
| `ActiveDesignPanel`          | `FTRAccordionPanel`           |      No | Panel selected for editing in Designer    |
| `GlobalBackColor`            | `Color`                       |      No | Accordion background override             |
| `GlobalHeaderBackColor`      | `Color`                       |      No | Header background override                |
| `GlobalHeaderForeColor`      | `Color`                       |      No | Header text color override                |
| `GlobalHeaderHoverColor`     | `Color`                       |      No | Header hover color override               |
| `GlobalHeaderSelectedColor`  | `Color`                       |      No | Expanded header color override            |
| `GlobalHeaderSeparatorColor` | `Color`                       |      No | Header separator color override           |
| `ShowBorder`                 | `bool`                        |     Yes | Displays accordion border                 |
| `AutoFitHeight`              | `bool`                        |     Yes | Automatically fits accordion height       |
| `MultiExpanded`              | `bool`                        |     Yes | Allows multiple panels to remain expanded |

---

# Events Reference

| Event            | Description                                            |
| ---------------- | ------------------------------------------------------ |
| `PanelExpanding` | Occurs before a panel is expanded and can be cancelled |
| `PanelExpanded`  | Occurs after a panel has expanded                      |
| `PanelCollapsed` | Occurs after a panel has collapsed                     |

---

# FTRAccordionPanel Reference

| Property / Method            | Type     | Description                           |
| ---------------------------- | -------- | ------------------------------------- |
| `Title`                      | `string` | Panel header text                     |
| `Icon`                       | `Image`  | Optional panel header icon            |
| `IsExpanded`                 | `bool`   | Current expansion state               |
| `RecalculateContentHeight()` | `void`   | Recalculates the panel content height |

---

# Notes

* `FTRAccordionPanel` is the content section used by `FTRAccordion`.
* Panels can contain standard Windows Forms controls.
* The accordion automatically handles panel positioning and expand/collapse animation.
* `MultiExpanded` controls whether multiple panels can remain open.
* Theme colors are automatically applied through the FTR Controls theme system.
* Global color properties can be used to customize individual parts of the appearance.
* Premium features require an appropriate FTR Controls license.
* The accordion does not provide standard Windows Forms scrollbars through its `AutoScroll` property.

---

## See Also

* `FTRAccordionPanel`
* `FTRCard`
* FTR Controls Theme System
* FTR Controls Licensing