ColumnView QML Type
A container that lays out items horizontally in a row. More...
Import Statement: | import org.kde.kirigami.layouts |
Properties
- bottomPadding : real
- columnResizeMode : enumeration
- columnWidth : real
- contentChildren : list<Item>
- contentData : list<QtObject>
- contentItem : Item
- contentWidth : real
- contentX : real
- count : int
- currentIndex : int
- currentItem : Item
- dragging : bool
- interactive : bool
- leadingVisibleItem : Item
- moving : bool
- savedState : string
- scrollDuration : int
- separatorVisible : bool
- topPadding : real
- trailingVisibleItem : Item
- visibleItems : list<QtObject>
Attached Properties
- fillWidth : bool
- globalFooter : Item
- globalHeader : Item
- inViewport : bool
- index : int
- interactiveResizeEnabled : bool
(since 6.16)
- interactiveResizing : bool
(since 6.16)
- maximumWidth : real
(since 6.16)
- minimumWidth : real
(since 6.16)
- pinned : bool
- preferredWidth : real
(since 6.16)
- preventStealing : bool
- reservedSpace : real
- view : ColumnView
Signals
- itemInserted(int position, Item item)
- itemRemoved(Item item)
Methods
- Item get(int index)
(since 6.16)
- Item pop()
- Item pop(var item)
- Item removeItem(var item)
Detailed Description
When not all items fit in the ColumnView, it will behave like a Flickable and will be a scrollable view which shows only a determined number of columns.
The columns can either all have the same fixed size (recommended), size themselves with implicitWidth, or automatically expand to take all the available width: by default the last column will always be the expanding one.
Items inside the ColumnView can access info of the view and set layouting hints via the ColumnView attached property.
This is the base for the implementation of PageRow.
Property Documentation
bottomPadding : real |
The padding this will have at the bottom
columnResizeMode : enumeration |
The strategy to follow while automatically resizing the columns
The default is FixedColumns.
Constant | Description |
---|---|
ColumnView.FixedColumns | Every column is fixed at the same width of the columnWidth property |
ColumnView.DynamicColumns | Columns take their width from their implicitWidth |
ColumnView.SingleColumn | Only one column at a time is shown, as wide as the viewport, eventual reservedSpace on the column's attached property is ignored |
columnWidth : real |
The width of all columns when columnResizeMode is FixedColumns
contentChildren : list<Item> |
Every column item the view contains
contentData : list<QtObject> |
every item declared inside the view, both visual and non-visual items
contentItem : Item |
The main content item of this view: it's the parent of the column items
contentWidth : real |
The compound width of all columns in the view
contentX : real |
The value of the horizontal scroll of the view, in pixels
count : int |
How many columns this view contains
currentIndex : int |
The position of the currently active column. The current column will also have keyboard focus
currentItem : Item |
The currently active column. The current column will also have keyboard focus
dragging : bool |
True when the user is dragging around with touch gestures the view contents
interactive : bool |
True if it supports moving the contents by dragging
leadingVisibleItem : Item |
The first of visibleItems provided from convenience
moving : bool |
True both when the user is dragging around with touch gestures the view contents or the view is animating
savedState : string |
A JSon serialization of the columns widths. When columnResizeMode is DynamicColumns, columns can be resized via mouse. When this is the case, the sizes should be saved and restored on application startup.
Example code for saving and restore, assuming that the application exposes a singleton called App that has a "columnViewState" property that reads and writes to the config file:
Component.onCompleted: pageStack.columnView.savedState = App.columnViewState; columnView.onSavedStateChanged: { App.columnViewState = pageStack.columnView.savedState; }
scrollDuration : int |
The duration for scrolling animations
separatorVisible : bool |
True if columns should be visually separated by a separator line
topPadding : real |
The padding this will have at the top
trailingVisibleItem : Item |
The last of visibleItems provided from convenience
visibleItems : list<QtObject> |
The list of all visible column items that are at least partially in the viewport at any given moment
Attached Property Documentation
ColumnView.fillWidth : bool |
If true, the column will expand to take the whole viewport space minus reservedSpace
ColumnView.globalFooter : Item |
ColumnView.globalHeader : Item |
ColumnView.inViewport : bool |
True if this column is at least partly visible in the ColumnView's viewport.
ColumnView.index : int |
The index position of the column in the view, starting from 0
ColumnView.interactiveResizeEnabled : bool |
True if this column supports interactive resize with mouse.
If the sizes should be saved and restored on application startup, it is the application responsibility to implement this, for instance exposing and object with properties for the desired column widths which reads and writes to the config. at the main Component.onCompleted of the ApplicationWindow root Item it will apply the preferred sizes of the desired pages.
The property will be written at interactiveResizingChanged signal handler.
This property was introduced in 6.16.
ColumnView.interactiveResizing : bool |
True when the user is actively resizing a column with the mouse. If the application wants to write the column sizes to config, it can sync to some global object property at interactiveResizingChanged:
Kirigami.ColumnView.onInteractiveResizingChanged: { if (!Kirigami.ColumnView.interactiveResizing) { myAppObject.leftColumnWidth = page.implicitWidth; } }
This property was introduced in 6.16.
ColumnView.maximumWidth : real |
When a column is interactiveResizeEnabled, when resizing manually it will bound the column size between minimumWidth and maximumWidth
This property was introduced in 6.16.
ColumnView.minimumWidth : real |
When a column is interactiveResizeEnabled, when resizing manually it will bound the column size between minimumWidth and maximumWidth
This property was introduced in 6.16.
ColumnView.pinned : bool |
If true the page will never go out of view, but will stay either at the right or left side of the ColumnView
ColumnView.preferredWidth : real |
When we are in DynamicColumns mode, the columns will be resized to preferredWidth. When the column are resized with the mouse, this propoerty will be updated by the drag And will always be between minimumWidth and maximumWidth
This property was introduced in 6.16.
ColumnView.preventStealing : bool |
Like the same property of MouseArea, when this is true, the column view won't try to manage events by itself when filtering from a child, not disturbing user interaction
ColumnView.reservedSpace : real |
When a column is fillWidth, it will keep reservedSpace amount of pixels from going to fill the full viewport width
ColumnView.view : ColumnView |
The view this column belongs to
Signal Documentation
itemInserted(int position, Item item) |
A new item has been inserted
position where the page has been inserted
item a pointer to the new item
Note: The corresponding handler is onItemInserted
.
itemRemoved(Item item) |
An item has just been removed from the view
item a pointer to the item that has just been removed
Note: The corresponding handler is onItemRemoved
.
Method Documentation
|
This method gets the item at index, if available
Note that if an invalid index is passed (either negative or greater then depth - 1) nullptr will be returned
index The index of the item to get.
This method was introduced in 6.16.
Item pop() |
This method removes the last item from the view and returns it.
This method calls removeItem() on the last item.
Returns the removed item
See also removeItem().
Item pop(var item) |
This method removes all the items after the specified item or index from the view and returns the last item that was removed.
Note that if the passed value is neither of the values said below, it will return a nullptr.
item the item to remove. It can be an item, index or not defined in which case it will pop the last item.
Item removeItem(var item) |
This method removes an item from the view.
If the argument is a number, this method dispatches to removeItem(int index) to remove an item by its index. Otherwise the argument should be the item itself to be removed itself, and this method will dispatch to removeItem(QQuickItem *item).
index the index of the item which should be removed, or the item itself
Returns the removed item