SwipeView Class Reference

Properties
alias	content
alias	count
alias	currentIndex
alias	currentItem
QtObject	history
alias	interactive
int	maxViews

Public Member Functions
void	goBack ()
void	goNext ()
void	goPrevious ()

Detailed Description

Views switcher component.

Since

org.mauikit.controls 1.2

This controls inherits from MauiKit Page, to checkout its inherited properties refer to docs.

The AppViews control presents a set of children items as views - into an horizontal swipe view, that does not jump around when resizing the application window and that takes care of different gestures and keyboard shortcuts for switching/navigating between the views.

This component takes care of creating the button view-ports in its page header.

Each child element represents a view - and each one should have the Controls metadata attached properties to give a title and icon to the view - so that it can be used as the text and icon for the view-port buttons. Some of the supported attached properties to be used are:

• Controls.title
• Controls.iconName
• Controls.badgeText

The badge item is handled by a MauiKit Badge control.

See also

Badge

Controls

The view ports as buttons in the header - the title is expanded for the current view on a wide mode, but compacted in a narrow space

AppViews
{
   id: _page
   anchors.fill: parent
   Controls.showCSD: true
   headBar.forceCenterMiddleContent: true
 
   Rectangle
   {
       Controls.title: "View1"
       Controls.iconName: "love"
 
       color: "blue"
   }
 
   Rectangle
   {
       Controls.title: "View2"
       Controls.iconName: "folder"
       Controls.badgeText: "30"
       color: "pink"
   }
 
   Rectangle
   {
       Controls.title: "View3"
       Controls.iconName: "tag"
 
       color: "blue"
   }
}

Notes

Positioning & Behaviours

There is not need to set the size or position of the child elements aka "views" - this component will take care of positioning them in the order they have been declared.

If a child-item or a "view" is hidden via the visible property, then it is also hidden for the view port buttons.

By default this component is not interactive with touch gestures, in order to not steal focus from other horizontal flickable elements - however you can enable it manually.

See also

interactive

Performance

Ideally do not add too many views, that are loaded simultaneously, since it will affect the application startup time. Instead you can load the views dinamically by using a Loader or the friend control AppViewLoader, which will take care of much of the loading task.

See also

AppViewLoader

Besides taking longer to load - too many views - will also make the header bar too busy with the view-port buttons. This can also be tweaked by setting the maximum number of views visible - the other ones will be tucked away into an overflow menu.

See also

maxViews

Inheritance & Shortcuts

This component inherits for the MauiKit Page control, so you can customize it by using the same properties that can be applied to a Page, such as moving the header to the bottom, adding extra toolbars, enabling the pull-back behaviours, etc.

See also

Page

The first four [4] views can be navigated by using keyboard shortcuts: [Ctrl + 1] [Ctrl + 2] [Ctrl + 3] [Ctrl + 4]

You can find a more complete example at this link.

Definition at line 108 of file SwipeView.qml.

Property Documentation

content

alias SwipeView::content

read

All the child items declared will become part of the views.

For each child element to be visible in the view port buttons, you need to use the Controls metadata attached properties.

See also

Controls The content layout is handled by a swipe view.

Remarks

This is the default property

Definition at line 116 of file SwipeView.qml.

count

alias SwipeView::count

read

Definition at line 131 of file SwipeView.qml.

currentIndex

alias SwipeView::currentIndex

read

Definition at line 121 of file SwipeView.qml.

currentItem

alias SwipeView::currentItem

read

Definition at line 126 of file SwipeView.qml.

history

QtObject SwipeView::history

read

The private object that handles the history workflow.

Warning

This is a private property and can not be accesed

Definition at line 155 of file SwipeView.qml.

interactive

alias SwipeView::interactive

read

Definition at line 136 of file SwipeView.qml.

maxViews

int SwipeView::maxViews

read

Maximum number of views to be shown in the view port buttons at the header bar.

The rest of views buttons will be collapsed into a menu button. By default the maximum number is set to 4.

Definition at line 145 of file SwipeView.qml.

Member Function Documentation

goBack()

void SwipeView::goBack

(

)

A quick function to request the control to go back to the previously visited view.

A history of visited views is kept, and invoking this method will pop the history one by one .

goNext()

void SwipeView::goNext

(

)

Jumps to the next view.

If it reaches the last one, then it wraps to the first view.

goPrevious()

void SwipeView::goPrevious

(

)

Jumps to the previous view.

---

The documentation for this class was generated from the following file:

• SwipeView.qml