Merge pull request 'add tabbar' (#27) from tabbar into master

Reviewed-on: #27
This commit is contained in:
Dan Ballard 2020-11-23 16:24:26 -08:00
commit a69fb3cff2
2 changed files with 44 additions and 43 deletions

43
Tab.qml
View File

@ -1,43 +0,0 @@
import QtGraphicalEffects 1.0
import QtQuick 2.7
import QtQuick.Controls 2.4
import QtQuick.Controls.Material 2.0
import QtQuick.Layouts 1.3
import "fonts/Twemoji.js" as T
import "theme"
import "fonts"
import "." as Opaque
Rectangle {
id: root
property bool active: false
property alias text: label.text
color: Theme.backgroundMainColor
signal clicked
height: label.height
property alias size: label.size
Opaque.ScalingLabel {
id: label
anchors.horizontalCenter: parent.horizontalCenter
color: root.active ? Theme.mainTextColor : Theme.altTextColor
size: Theme.tabSize
font.family: Fonts.applicationFontRegular.name
font.styleName: "Bold"
}
MouseArea {
anchors.fill: parent
onClicked: {
parent.focus = true
parent.clicked()
}
}
}

44
TabBar.qml Normal file
View File

@ -0,0 +1,44 @@
import QtQuick 2.13
import QtQuick.Controls 2.13
import "../opaque/theme"
// Tabs.qml
//
// Example 1:
// Tabs {
// model: [qsTr("tab1-name"), qsTr("tab2-name"), qsTr("tab3-name")]
// onCurrentIndexChanged: {
// //...eg: loader.source = filenames[currentIndex]
// }
// }
ListView {
id: root
// properties
property color highlightColor: Theme.dividerColor
// contents & appearance config
model: ["your", "model", "here"]
delegate: Label {
// contents & appearance config
text: model.modelData
elide: Text.ElideRight
horizontalAlignment: Text.AlignHCenter
color: Theme.mainTextColor
font.pixelSize: Theme.chatMetaTextSize * gcd.themeScale
font.weight: Font.Bold
// functionality
MouseArea { anchors.fill: parent; onClicked: root.currentIndex = index; }
width: root.width / root.model.length
}
highlight: Rectangle { radius: 5; color: root.highlightColor; }
// functionality
height: Theme.secondaryTextSize * gcd.themeScale + 5
orientation: Qt.Horizontal
interactive: true
highlightFollowsCurrentItem: true
boundsBehavior: Flickable.StopAtBounds
}