137 lines
No EOL
4.4 KiB
QML
137 lines
No EOL
4.4 KiB
QML
import QtQuick
|
|
import QtQuick.Controls
|
|
import QtQuick.Layouts
|
|
import qs.Settings
|
|
import qs.Components
|
|
|
|
ColumnLayout {
|
|
id: root
|
|
spacing: 0
|
|
anchors.fill: parent
|
|
anchors.margins: 0
|
|
|
|
Item {
|
|
Layout.fillWidth: true
|
|
Layout.preferredHeight: 0
|
|
}
|
|
|
|
|
|
ColumnLayout {
|
|
spacing: 4
|
|
Layout.fillWidth: true
|
|
|
|
Text {
|
|
text: "Media"
|
|
font.pixelSize: 16
|
|
font.bold: true
|
|
color: Theme.textPrimary
|
|
Layout.bottomMargin: 8
|
|
}
|
|
|
|
|
|
ColumnLayout {
|
|
spacing: 8
|
|
Layout.fillWidth: true
|
|
|
|
Text {
|
|
text: "Visualizer Type"
|
|
font.pixelSize: 13
|
|
font.bold: true
|
|
color: Theme.textPrimary
|
|
}
|
|
|
|
Text {
|
|
text: "Choose the style of the audio visualizer"
|
|
font.pixelSize: 12
|
|
color: Theme.textSecondary
|
|
wrapMode: Text.WordWrap
|
|
Layout.fillWidth: true
|
|
Layout.bottomMargin: 4
|
|
}
|
|
|
|
ComboBox {
|
|
id: visualizerTypeComboBox
|
|
Layout.fillWidth: true
|
|
Layout.preferredHeight: 40
|
|
model: ["radial", "fire", "diamond"]
|
|
currentIndex: model.indexOf(Settings.settings.visualizerType)
|
|
|
|
background: Rectangle {
|
|
implicitWidth: 120
|
|
implicitHeight: 40
|
|
color: Theme.surfaceVariant
|
|
border.color: visualizerTypeComboBox.activeFocus ? Theme.accentPrimary : Theme.outline
|
|
border.width: 1
|
|
radius: 16
|
|
}
|
|
|
|
contentItem: Text {
|
|
leftPadding: 12
|
|
rightPadding: visualizerTypeComboBox.indicator.width + visualizerTypeComboBox.spacing
|
|
text: visualizerTypeComboBox.displayText.charAt(0).toUpperCase() + visualizerTypeComboBox.displayText.slice(1)
|
|
font.pixelSize: 13
|
|
color: Theme.textPrimary
|
|
verticalAlignment: Text.AlignVCenter
|
|
elide: Text.ElideRight
|
|
}
|
|
|
|
indicator: Text {
|
|
x: visualizerTypeComboBox.width - width - 12
|
|
y: visualizerTypeComboBox.topPadding + (visualizerTypeComboBox.availableHeight - height) / 2
|
|
text: "arrow_drop_down"
|
|
font.family: "Material Symbols Outlined"
|
|
font.pixelSize: 24
|
|
color: Theme.textPrimary
|
|
}
|
|
|
|
popup: Popup {
|
|
y: visualizerTypeComboBox.height
|
|
width: visualizerTypeComboBox.width
|
|
implicitHeight: contentItem.implicitHeight
|
|
padding: 1
|
|
|
|
contentItem: ListView {
|
|
clip: true
|
|
implicitHeight: contentHeight
|
|
model: visualizerTypeComboBox.popup.visible ? visualizerTypeComboBox.delegateModel : null
|
|
currentIndex: visualizerTypeComboBox.highlightedIndex
|
|
|
|
ScrollIndicator.vertical: ScrollIndicator {}
|
|
}
|
|
|
|
background: Rectangle {
|
|
color: Theme.surfaceVariant
|
|
border.color: Theme.outline
|
|
border.width: 1
|
|
radius: 16
|
|
}
|
|
}
|
|
|
|
delegate: ItemDelegate {
|
|
width: visualizerTypeComboBox.width
|
|
contentItem: Text {
|
|
text: modelData.charAt(0).toUpperCase() + modelData.slice(1)
|
|
font.pixelSize: 13
|
|
color: Theme.textPrimary
|
|
verticalAlignment: Text.AlignVCenter
|
|
elide: Text.ElideRight
|
|
}
|
|
highlighted: visualizerTypeComboBox.highlightedIndex === index
|
|
|
|
background: Rectangle {
|
|
color: highlighted ? Theme.accentPrimary.toString().replace(/#/, "#1A") : "transparent"
|
|
}
|
|
}
|
|
|
|
onActivated: {
|
|
Settings.settings.visualizerType = model[index];
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
Item {
|
|
Layout.fillWidth: true
|
|
Layout.fillHeight: true
|
|
}
|
|
} |