Barres d'eines d'acció
Si bé les pàgines de Kirigami permeten posar amb facilitat un conjunt d'accions a la capçalera de la pàgina, hi ha ocasions en què potser preferireu tenir una mica més de flexibilitat.
El Kirigami proporciona el component Kirigami.ActionToolBar
. Mostra una llista d'objectes Kirigami.Action
i en mostrarà tants com sigui possible, proporcionant un menú desbordat per als que no encaixin. ActionToolBar és dinàmic i mourà les accions dins i fora del menú desbordat depenent de l'espai disponible.
Nota
This page assumes you are familiar withKirigami.Action
objects. If you are not, you can learn all about them in our beginner tutorial or in the dedicated documentation page for them.Crear la nostra primera ActionToolBar
La disposició i la ubicació de la vostra Kirigami.ActionToolBar
en realitat dependrà de vosaltres, encara que en nom de la facilitat d'ús, generalment és una bona idea cenyir-se a les convencions de la interfície d'usuari i col·locar la barra d'eines a prop de la part superior o inferior de la pàgina i que s'estengui en amplada.
Com la majoria dels altres components que mantenen accions, la Kirigami.ActionToolBar
té una propietat actions
. Podem assignar una matriu de components Kirigami.Action
a aquesta propietat.
import QtQuick 2.6
import QtQuick.Controls 2.0 as Controls
import QtQuick.Layouts 1.2
import org.kde.kirigami 2.13 as Kirigami
Kirigami.Page {
Kirigami.ActionToolBar {
anchors.fill: parent
actions: [
Kirigami.Action {
text: "Beep"
icon.name: "notifications"
onTriggered: showPassiveNotification("BEEP!")
},
Kirigami.Action {
text: "Action Menu"
icon.name: "overflow-menu"
Kirigami.Action {
text: "Deet";
icon.name: "notifications"
onTriggered: showPassiveNotification("DEET!")
}
Kirigami.Action {
text: "Doot";
icon.name: "notifications"
onTriggered: showPassiveNotification("DOOT!")
}
},
Kirigami.Action {
icon.name: "search"
displayComponent: Kirigami.SearchField { }
}
]
}
}

ActionToolBar amb prou espai per a tots els fills

ActionToolBar amb el menú desbordat que conté els fills
Alineació
De manera predeterminada, les accions a ActionToolBar s'alinearan a l'esquerra. Això pot no ser desitjable en totes les situacions. Afortunadament, podem canviar això amb la propietat alignment
. Podem establir aquesta propietat en un interval de valors, però els tres més rellevants per a una ActionToolBar són Qt.AlignLeft
, Qt.AlignCenter
i Qt.AlignRight
(els quals s'ocupen de l'alineació horitzontal).
Controls.GroupBox {
Layout.fillWidth: true
Kirigami.ActionToolBar {
anchors.fill: parent
alignment: Qt.AlignCenter
actions: [
Kirigami.Action {
text: "Beep"
icon.name: "notifications"
onTriggered: showPassiveNotification("BEEP!")
}
]
}
}
