QML: Add inytoduction for tabs
Signed-off-by: Juraj Oravec <jurajoravec@mailo.com>
This commit is contained in:
parent
5a0cb99b5f
commit
57b70991e9
99
qml/articles/10.Falkon_tabs.md
Normal file
99
qml/articles/10.Falkon_tabs.md
Normal file
@ -0,0 +1,99 @@
|
||||
# Falkon QML Tutorial - 10. Falkon tabs
|
||||
|
||||
Hello, in this chapter I will show you how to work with tabs. Keep in
|
||||
mind that this is just a short example and always check documentation
|
||||
for more information, do not trust me.
|
||||
|
||||
## Access tabs api
|
||||
The tabs API can be accessed through code.
|
||||
```qml
|
||||
Falkon.Tabs
|
||||
```
|
||||
More information can be found in the
|
||||
[documentation](http://falkon.sgorava.xyz/docs/class_qml_tabs.html).
|
||||
|
||||
Most of the functions also returns a result of the operation which can
|
||||
be either `True` or `False`.
|
||||
|
||||
## Switching tabs
|
||||
The current tab can be changed to `previous`, `next` and based on tab
|
||||
`id` as it is stored in Falkon. These function needs to specify the
|
||||
`windowId` and the previous and next tab is based on some Falkon
|
||||
thing which can be changed at least by C++ addon (investigate
|
||||
VerticalTabs extension).
|
||||
|
||||
```qml
|
||||
// the id of the first window is 0, so good enough for an example
|
||||
property int window = 0
|
||||
|
||||
Falkon.Tabs.nextTab(window)
|
||||
Falkon.Tabs.previousTab(window)
|
||||
Falkon.Tabs.setCurrentIndex({
|
||||
windowId: window,
|
||||
index: 0
|
||||
})
|
||||
```
|
||||
|
||||
## TabBar related operations
|
||||
We can `move`, `pin`, `unpin`, `detach`, `duplicate`, `close`, `reload`,
|
||||
`stop` loading and `add` a tab.
|
||||
|
||||
```qml
|
||||
// the id of the first window is 0, so good enough for an example
|
||||
property int window = 0
|
||||
property int tabIndexFirst = 0
|
||||
property int tabIndexSecond = 1
|
||||
|
||||
// Move second tab to the first position
|
||||
Falkon.Tabs.moveTab({
|
||||
from: tabIndexSecond,
|
||||
to: tabIndexFirst,
|
||||
windowId: window
|
||||
})
|
||||
// Create a new tab
|
||||
Falkon.Tabs.addTab({
|
||||
url: 'https://falkon.org/',
|
||||
windowId: window
|
||||
})
|
||||
|
||||
// The other commands are exactly the same
|
||||
Falkon.Tabs.pinTab({
|
||||
index: tabIndexFirst,
|
||||
windowId: window
|
||||
})
|
||||
Falkon.Tabs.unpinTab({
|
||||
index: tabIndexFirst,
|
||||
windowId: window
|
||||
})
|
||||
Falkon.Tabs.detachTab()
|
||||
Falkon.Tabs.duplicateTab()
|
||||
Falkon.Tabs.closeTab()
|
||||
Falkon.Tabs.reloadTab()
|
||||
Falkon.Tabs.stopTab()
|
||||
```
|
||||
|
||||
## Misc
|
||||
Next we can get an exact tab or all tabs in given window, tab counts and
|
||||
search in tabs.
|
||||
|
||||
```qml
|
||||
// the id of the first window is 0, so good enough for an example
|
||||
property int window = 0
|
||||
property int tabIndexFirst = 0
|
||||
|
||||
var tab = Falkon.Tabs.get({
|
||||
index: tabIndexFirst,
|
||||
windowId: window
|
||||
})
|
||||
var tabsAll = Falkon.Tabs.getAll({
|
||||
windowId: window,
|
||||
withPinned: true
|
||||
})
|
||||
vat tabs = Falkon.Tabs.search({
|
||||
title: 'Falkon',
|
||||
url: 'https://falkon.org/',
|
||||
withPinned: true
|
||||
})
|
||||
var tabsNormal = Falkon.Tabs.normalTabsCount(window)
|
||||
var tabsPinned = Falkon.Tabs.pinnedTabsCount(window)
|
||||
```
|
Loading…
Reference in New Issue
Block a user