• Home

SectionSelect

A control that allows to jump to specific sections of a ListView. More...

• List of all members, including inherited members

Properties

• sectionProperty : string
• target : ListView

Detailed Description

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.

Example Usage

 import Felgo 3.0

 App {
   NavigationStack {

     ListPage {
       id: listPage
       title: "SectionSelect Example"

       // 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,
               section: "Section: "+String.fromCharCode(65 + i), // for section display in list
               letter: String.fromCharCode(65 + i) // only for SectionSelect, the actual sections all start with 'Section ...'
             }
             model.push(entry)
           }
         }
         return model
       }
       delegate: SimpleRow { }

       // activate sections
       section.property: "section"

       // add section select
       SectionSelect {
         id: sectionSelect
         anchors.right: parent.right
         target: listPage.listView
         sectionProperty: "letter"
       }
     } // ListPage

   }
 }

Property Documentation