169 lines
5.3 KiB
QML
169 lines
5.3 KiB
QML
import QtQuick
|
|
import QtQuick.Controls
|
|
import QtQuick.Controls.Material
|
|
import QtQuick.Layouts
|
|
import TactileIPC 1.0
|
|
|
|
Rectangle {
|
|
id: root
|
|
height: 56
|
|
color: Backend.lightMode ? "#F5F7F5" : "#2B2F2B"
|
|
|
|
Material.theme: Backend.lightMode ? Material.Light : Material.Dark
|
|
Material.accent: Material.Green
|
|
Material.primary: Material.Green
|
|
|
|
Rectangle {
|
|
anchors.left: parent.left
|
|
anchors.right: parent.right
|
|
anchors.bottom: parent.bottom
|
|
height: 1
|
|
color: Qt.rgba(0, 0, 0, 0.08)
|
|
}
|
|
|
|
RowLayout {
|
|
anchors.fill: parent
|
|
anchors.leftMargin: 16
|
|
anchors.rightMargin: 16
|
|
spacing: 14
|
|
|
|
Label {
|
|
text: "Tactile IPC 3D"
|
|
font.pixelSize: 18
|
|
font.weight: Font.DemiBold
|
|
color: Material.color(Material.Green)
|
|
}
|
|
|
|
Item { Layout.fillWidth: true }
|
|
|
|
RowLayout {
|
|
spacing: 6
|
|
Layout.alignment: Qt.AlignVCenter
|
|
|
|
Rectangle {
|
|
width: 10
|
|
height: 10
|
|
radius: 5
|
|
color: Backend.connected ? "#2e7d32" : "#d32f2f"
|
|
}
|
|
|
|
Label {
|
|
text: Qt.binding(function() {
|
|
I18n.retranslateToken
|
|
return Backend.connected ? qsTr("CONNECTED") : qsTr("DISCONNECTED")
|
|
})
|
|
font.pixelSize: 12
|
|
font.weight: Font.DemiBold
|
|
color: Backend.connected ? "#2e7d32" : "#d32f2f"
|
|
}
|
|
}
|
|
|
|
Switch {
|
|
id: themeSwitch
|
|
text: Qt.binding(function() {
|
|
I18n.retranslateToken
|
|
return Backend.lightMode ? qsTr("Light") : qsTr("Dark")
|
|
})
|
|
checked: Backend.lightMode
|
|
onCheckedChanged: Backend.lightMode = checked
|
|
}
|
|
|
|
ComboBox {
|
|
id: langBox
|
|
implicitHeight: 32
|
|
leftPadding: 10
|
|
rightPadding: 26
|
|
Layout.alignment: Qt.AlignVCenter
|
|
model: [
|
|
{ text: "中文", value: "zh_CN", icon: "qrc:/images/china.png" },
|
|
{ text: "English", value: "en_US", icon: "qrc:/images/united-states.png" }
|
|
]
|
|
textRole: "text"
|
|
delegate: ItemDelegate {
|
|
width: langBox.width
|
|
height: 28
|
|
onClicked: {
|
|
langBox.currentIndex = index
|
|
langBox.popup.close()
|
|
}
|
|
contentItem: Row {
|
|
spacing: 8
|
|
anchors.verticalCenter: parent.verticalCenter
|
|
anchors.left: parent.left
|
|
anchors.leftMargin: 8
|
|
Image {
|
|
width: 16
|
|
height: 16
|
|
fillMode: Image.PreserveAspectFit
|
|
source: modelData.icon
|
|
}
|
|
Label {
|
|
text: modelData.text
|
|
font: langBox.font
|
|
}
|
|
}
|
|
}
|
|
contentItem: Item {
|
|
anchors.fill: parent
|
|
Row {
|
|
spacing: 8
|
|
anchors.left: parent.left
|
|
anchors.leftMargin: 10
|
|
anchors.rightMargin: 24
|
|
anchors.verticalCenter: parent.verticalCenter
|
|
Image {
|
|
width: 16
|
|
height: 16
|
|
fillMode: Image.PreserveAspectFit
|
|
source: langBox.model[langBox.currentIndex]
|
|
? langBox.model[langBox.currentIndex].icon
|
|
: ""
|
|
}
|
|
Label {
|
|
text: langBox.displayText
|
|
font: langBox.font
|
|
verticalAlignment: Text.AlignVCenter
|
|
}
|
|
}
|
|
}
|
|
popup: Popup {
|
|
y: langBox.height
|
|
width: langBox.width
|
|
implicitHeight: contentItem.implicitHeight
|
|
padding: 0
|
|
modal: false
|
|
focus: true
|
|
closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutside
|
|
popupType: Popup.Window
|
|
contentItem: ListView {
|
|
implicitHeight: contentHeight
|
|
model: langBox.delegateModel
|
|
currentIndex: langBox.highlightedIndex
|
|
delegate: langBox.delegate
|
|
clip: true
|
|
}
|
|
}
|
|
function syncLanguage() {
|
|
for (let i = 0; i < model.length; i++) {
|
|
if (model[i].value === Backend.language) {
|
|
if (currentIndex !== i)
|
|
currentIndex = i
|
|
return
|
|
}
|
|
}
|
|
}
|
|
Component.onCompleted: syncLanguage()
|
|
Connections {
|
|
target: Backend
|
|
function onLanguageChanged() {
|
|
langBox.syncLanguage()
|
|
}
|
|
}
|
|
onCurrentIndexChanged: {
|
|
if (model[currentIndex])
|
|
Backend.language = model[currentIndex].value
|
|
}
|
|
}
|
|
}
|
|
}
|