Carousel
This documentation provides a comprehensive reference for the
Carousel component, guiding you through its configuration options.Screenshot #
Carousel Parameters #
| Name | Type | Default | Required | Description | Added Version |
|---|---|---|---|---|---|
| AdditionalAttributes | Dictionary<string, object>? | null | Gets or sets additional attributes that will be applied to the component. | 1.0.0 | |
| Autoplay | CarouselAutoPlay | None | Controls the autoplay behavior of the carousel. | 3.0.0 | |
| ChildContent | RenderFragment? | null | Gets or sets the content to be rendered within the component. | 3.0.0 | |
| Class | string? | null | Gets or sets the CSS class name(s) to apply to the component. | 1.0.0 | |
| Crossfade | bool | False | Determines whether to use a crossfade effect when transitioning between slides. | 3.0.0 | |
| Id | string? | null | Gets or sets the ID. If not set, a unique ID will be generated. | 1.0.0 | |
| Interval | int | 5000 | The amount of time to delay between automatically cycling an item. | 3.0.0 | |
| Keyboard | bool | True | Whether the carousel should react to keyboard events. | 3.0.0 | |
| ShowIndicators | bool | False | Indicates whether to show indicators (dots) below the carousel to navigate between slides. | 3.0.0 | |
| ShowPreviousNextControls | bool | True | Specifies whether to display the previous and next controls (arrows) for navigating slides. | 3.0.0 | |
| Style | string? | null | Gets or sets the CSS style string that defines the inline styles for the component. | 1.0.0 | |
| Touch | bool | True | Carousels support swiping left/right on touchscreen devices to move between slides. This can be disabled by setting the Touch parameter to false. | 3.0.0 |
Carousel Methods #
| Name | Return type | Description | Added Version |
|---|---|---|---|
| ShowItemByIndexAsync(int index) | ValueTask | Shows CarouselItem by index. | 3.0.0 |
| PauseCarouselAsync() | ValueTask | Shows next CarouselItem. | 3.0.0 |
| ShowNextItemAsync() | ValueTask | Shows next CarouselItem. | 3.0.0 |
| ShowPreviousItemAsync() | ValueTask | Shows previous CarouselItem. | 3.0.0 |
Carousel Events #
| Name | Return Type | Description | Added Version |
|---|---|---|---|
| Onslid | EventCallback<CarouselEventArgs> | Fired when the carousel has completed its slide transition. | 3.0.0 |
| Onslide | EventCallback<CarouselEventArgs> | Fires immediately when the slide instance method is invoked. | 3.0.0 |
CarouselItem Parameters #
| Name | Type | Default | Required | Description | Added Version |
|---|---|---|---|---|---|
| Active | bool | False | Gets or sets the active state. | 3.0.0 | |
| AdditionalAttributes | Dictionary<string, object>? | null | Gets or sets additional attributes that will be applied to the component. | 1.0.0 | |
| ChildContent | RenderFragment? | null | Gets or sets the content to be rendered within the component. | 3.0.0 | |
| Class | string? | null | Gets or sets the CSS class name(s) to apply to the component. | 1.0.0 | |
| Id | string? | null | Gets or sets the ID. If not set, a unique ID will be generated. | 1.0.0 | |
| Interval | int | 5000 | The amount of time to delay between automatically cycling an item. | 3.0.0 | |
| Label | string? | null | Gets or sets the aria-label. | 3.0.0 | |
| Style | string? | null | Gets or sets the CSS style string that defines the inline styles for the component. | 1.0.0 |
