qtdoc/examples/demos/stocqt/content/components/FavTab.ui.qml

167 lines
4.5 KiB
QML

// Copyright (C) 2023 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts 1.15
Rectangle {
id: favTab
width: 357
height: 44
color: "transparent"
state: "PriceActive"
property alias priceButton: priceButton
property alias volumeButton: volumeButton
RowLayout {
anchors.fill: parent
anchors.topMargin: 8
anchors.rightMargin: 16
anchors.leftMargin: 16
anchors.bottomMargin: 8
spacing: 8
Rectangle {
id: priceRect
x: 16
y: 8
width: 159
height: 28
clip: true
Layout.preferredHeight: 28
Layout.fillWidth: true
Layout.alignment: Qt.AlignLeft | Qt.AlignVCenter
color: "transparent"
radius: 4
RowLayout {
anchors.fill: parent
anchors.topMargin: 6
anchors.rightMargin: 13
anchors.leftMargin: 12
anchors.bottomMargin: 6
spacing: 8
Item {
id: spacer
width: 1
height: 1
Layout.fillWidth: true
}
Text {
id: price
x: 63
y: 6
width: 34
height: 16
color: "#f2f2f2"
text: qsTr("Price")
font.pixelSize: 14
horizontalAlignment: Text.AlignLeft
verticalAlignment: Text.AlignTop
wrapMode: Text.NoWrap
font.weight: Font.DemiBold
font.family: "Roboto"
Layout.preferredWidth: 34
Layout.preferredHeight: 16
Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
}
Item {
id: spacer1
width: 1
height: 1
Layout.fillWidth: true
}
}
MouseArea {
id: priceButton
anchors.fill: parent
onClicked: favTab.state = "PriceActive"
}
}
Rectangle {
id: volumeRect
x: 183
y: 8
width: 159
height: 28
Layout.preferredHeight: 28
Layout.fillWidth: true
Layout.alignment: Qt.AlignLeft | Qt.AlignVCenter
color: "transparent"
radius: 4
RowLayout {
anchors.fill: parent
anchors.topMargin: 6
anchors.rightMargin: 13
anchors.leftMargin: 12
anchors.bottomMargin: 6
spacing: 8
Item {
id: spacer2
width: 1
height: 1
Layout.fillWidth: true
}
Text {
id: volume
x: 54
y: 6
width: 52
height: 16
color: "#f2f2f2"
text: qsTr(" Volume")
font.pixelSize: 14
horizontalAlignment: Text.AlignLeft
verticalAlignment: Text.AlignTop
wrapMode: Text.NoWrap
font.weight: Font.Normal
font.family: "Roboto"
Layout.preferredWidth: 52
Layout.preferredHeight: 16
Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
}
Item {
id: spacer3
width: 1
height: 1
Layout.fillWidth: true
}
}
MouseArea {
id: volumeButton
anchors.fill: parent
onClicked: favTab.state = "VolumeActive"
}
}
}
states: [
State {
name: "PriceActive"
PropertyChanges {
target: priceRect
color: "#3c3535"
}
},
State {
name: "VolumeActive"
extend: "Default"
PropertyChanges {
target: volumeRect
color: "#3c3535"
}
}
]
}