A control that allows to jump to specific sections of a ListView. More...
| Import Statement: | import Felgo 3.0 |
| Since: | Felgo 2.9.2 |
| Inherits: |
The SectionSelect control provides a side-bar that allows to alphabetically jump to the corresponding sections of a ListView. The side-bar has a native look on iOS & Android and takes the Theme colors into account.
| iOS | Android |
|
|
|
import Felgo 3.0 App { NavigationStack { ListPage { id: listPage title: "SectionSelect" listView.bottomMargin: nativeUtils.safeAreaInsets.bottom listView.anchors.rightMargin: sectionSelect.width // Add dummy entries for list page model: { var model = [] for (var i = 0; i < 26; i++) { for (var j = 0; j < 5; j++) { var entry = { text: String.fromCharCode(65 + i) + " " + j, // For section display in list section: "Section: " + String.fromCharCode(65 + i), // Only for SectionSelect, the actual sections all start with 'Section ...' letter: String.fromCharCode(65 + i) } model.push(entry) } } return model } delegate: SimpleRow { } // Activate sections section.property: "section" SectionSelect { id: sectionSelect anchors.right: parent.right target: listPage.listView sectionProperty: "letter" bottomMargin: nativeUtils.safeAreaInsets.bottom } } } }
|
autoUpdate : bool |
Whether the control synchronizes with the target to automatically update when the model or sectionProperty
changes. Defaults to true. Deactivate this setting to manually update the view with the update() function.
This property was introduced in Felgo 3.10.0.
See also update().
|
bottomMargin : real |
Add additional bottom margin below the last section. This can be used to respect the bottom safe area on mobile devices. The default value is 0.
This property was introduced in Felgo 3.9.0.
|
caseSensitive : bool |
Set to true to operate the control in case-sensitive mode. The control then only counts entries that start with an uppercase section character.
This property was introduced in Felgo 3.10.0.
|
ignoreDiacritics : bool |
If active, diacritical marks are ignored, which makes the control insensitive to accent characters. For example, letters like Ä and ê are countent as their un-accented variants A and
e then.
This property was introduced in Felgo 3.10.0.
|
sectionProperty : string |
The name of the section property within the target ListView's model. The target section.property is used by default. Using a custom section property for the SectionSelect allows to use different
sections for the SectionSelect control and the actual sections displayed in the ListView.
|
target : Item |
The target ListView of the SectionSelect control. The SectionSelect will read the target's model data and move the list to the chosen section when clicked.
Fires whenever the user touches the control on a valid section that exists in the target model.
Note: The corresponding handler is onSelected.
This signal was introduced in Felgo 3.10.0.
Calling this method updates the SectionSelect to reflect the entries of the target view. This synchronization is done automatically at component creation and whenever the sectionProperty or target changes. To manually control all view updates, deactivate the autoUpdate property.
This method was introduced in Felgo 3.10.0.
See also autoUpdate.
