Logo FluentUI

PageIndicator QML Type

A styled page indicator with a smooth pill-based active indicator. More...

Import Statement: import FluentUI 1.0

Properties

Detailed Description

PageIndicator is a QML component that extends QtQuick.Controls.PageIndicator with Fluent Design theme support. It displays a row of dots representing the current position within a page-based navigation. The active dot is indicated by a slightly larger pill that smoothly slides to the current index position, creating a caterpillar-like animation.

Usage Example

 import QtQuick
 import FluentUI

 PageIndicator {
     count: 5
     currentIndex: swipeView.currentIndex
     interactive: true
 }

See also QtQuick.Controls.PageIndicator.

Property Documentation

count : int

The number of dots (pages) displayed in the indicator. This property is inherited from QtQuick.Controls.PageIndicator.

currentIndex : int

The index of the currently active page. When this property changes, the indicator pill smoothly animates to the new position. This property is inherited from QtQuick.Controls.PageIndicator.

interactive : bool

Whether the indicator is interactive, allowing the user to click on dots to navigate. The default value is false. This property is inherited from QtQuick.Controls.PageIndicator.