diff options
author | Be <be@mixxx.org> | 2021-09-27 14:54:14 -0500 |
---|---|---|
committer | Be <be@mixxx.org> | 2021-09-29 10:11:33 -0500 |
commit | d4bf033f4f16d811040ddb44a5bccc882e738c48 (patch) | |
tree | d05c7a52e9ca73205f3a8d4ded1914993aaf38fc /res/qml | |
parent | 9b7f745691fe8f21af29ca64dd44a7c42651f953 (diff) |
move res/skins/QMLDemo to res/qml
Diffstat (limited to 'res/qml')
74 files changed, 5914 insertions, 0 deletions
diff --git a/res/qml/AuxiliaryUnit.qml b/res/qml/AuxiliaryUnit.qml new file mode 100644 index 0000000000..62eb11118f --- /dev/null +++ b/res/qml/AuxiliaryUnit.qml @@ -0,0 +1,119 @@ +import "." as Skin +import QtQuick 2.12 +import QtQuick.Controls 2.12 +import QtQuick.Layouts 1.12 +import "Theme" + +Row { + id: root + + property int unitNumber // required + property string group: "[Auxiliary" + unitNumber + "]" + + spacing: 5 + + Skin.VuMeter { + id: vuMeter + + group: root.group + key: "VuMeter" + width: 4 + height: parent.height + } + + Rectangle { + id: gainKnobFrame + + width: 52 + height: width + color: Theme.knobBackgroundColor + radius: 5 + + Skin.ControlKnob { + id: gainKnob + + anchors.centerIn: parent + width: 48 + height: width + arcStart: Knob.ArcStart.Minimum + group: root.group + key: "pregain" + color: Theme.gainKnobColor + } + + } + + Column { + Skin.SectionText { + width: parent.width + height: root.height / 2 + text: "AUX " + root.unitNumber + } + + Skin.ControlButton { + id: pflButton + + group: root.group + key: "pfl" + text: "PFL" + activeColor: Theme.pflActiveButtonColor + toggleable: true + } + + } + + Skin.EmbeddedBackground { + id: embedded + + height: parent.height + width: 56 + + Skin.OrientationToggleButton { + id: orientationButton + + anchors.left: parent.left + anchors.right: parent.right + anchors.top: parent.top + anchors.bottom: parent.verticalCenter + group: root.group + key: "orientation" + color: Theme.crossfaderOrientationColor + } + + Skin.InfoBarButton { + id: fx1Button + + anchors.left: parent.left + anchors.right: parent.horizontalCenter + anchors.top: parent.verticalCenter + anchors.bottom: parent.bottom + group: "[EffectRack1_EffectUnit1]" + key: "group_" + root.group + "_enable" + activeColor: Theme.deckActiveColor + + foreground: Skin.EmbeddedText { + anchors.centerIn: parent + text: "FX1" + } + + } + + Skin.InfoBarButton { + group: "[EffectRack1_EffectUnit2]" + anchors.left: parent.horizontalCenter + anchors.right: parent.right + anchors.top: parent.verticalCenter + anchors.bottom: parent.bottom + key: "group_" + root.group + "_enable" + activeColor: Theme.deckActiveColor + + foreground: Skin.EmbeddedText { + anchors.centerIn: parent + text: "FX2" + } + + } + + } + +} diff --git a/res/qml/Button.qml b/res/qml/Button.qml new file mode 100644 index 0000000000..133ce7e213 --- /dev/null +++ b/res/qml/Button.qml @@ -0,0 +1,128 @@ +import "." as Skin +import QtGraphicalEffects 1.12 +import QtQml 2.12 +import QtQuick 2.12 +import QtQuick.Controls 2.12 +import "Theme" + +AbstractButton { + id: root + + property color normalColor: Theme.buttonNormalColor + property color activeColor // required + property color pressedColor: activeColor + property bool highlight: false + + implicitWidth: 52 + implicitHeight: 26 + states: [ + State { + name: "pressed" + when: root.pressed + + PropertyChanges { + target: backgroundImage + source: Theme.imgButtonPressed + } + + PropertyChanges { + target: label + color: root.pressedColor + } + + PropertyChanges { + target: labelGlow + visible: true + } + + }, + State { + name: "active" + when: (root.highlight || root.checked) && !root.pressed + + PropertyChanges { + target: backgroundImage + source: Theme.imgButton + } + + PropertyChanges { + target: label + color: root.activeColor + } + + PropertyChanges { + target: labelGlow + visible: true + } + + }, + State { + name: "inactive" + when: !root.checked && !root.highlight && !root.pressed + + PropertyChanges { + target: backgroundImage + source: Theme.imgButton + } + + PropertyChanges { + target: label + color: root.normalColor + } + + PropertyChanges { + target: labelGlow + visible: false + } + + } + ] + + background: BorderImage { + id: backgroundImage + + anchors.fill: parent + horizontalTileMode: BorderImage.Stretch + verticalTileMode: BorderImage.Stretch + source: Theme.imgButton + + border { + top: 10 + left: 10 + right: 10 + bottom: 10 + } + + } + + contentItem: Item { + anchors.fill: parent + + Glow { + id: labelGlow + + anchors.fill: parent + radius: 5 + spread: 0.1 + samples: 1 + radius * 2 + color: label.color + source: label + } + + Label { + id: label + + anchors.fill: parent + text: root.text + horizontalAlignment: Text.AlignHCenter + verticalAlignment: Text.AlignVCenter + font.family: Theme.fontFamily + font.capitalization: Font.AllUppercase + font.bold: true + font.pixelSize: Theme.buttonFontPixelSize + color: root.normalColor + } + + } + +} diff --git a/res/qml/ComboBox.qml b/res/qml/ComboBox.qml new file mode 100644 index 0000000000..d5d5e82ae5 --- /dev/null +++ b/res/qml/ComboBox.qml @@ -0,0 +1,64 @@ +import "." as Skin +import QtQuick 2.12 +import QtQuick.Controls 2.12 +import "Theme" + +ComboBox { + id: root + + background: Skin.EmbeddedBackground { + } + + delegate: ItemDelegate { + width: parent.width + highlighted: root.highlightedIndex === index + text: root.textAt(index) + + contentItem: Text { + text: parent.text + color: Theme.deckTextColor + elide: Text.ElideRight + verticalAlignment: Text.AlignVCenter + } + + background: Rectangle { + radius: 5 + border.width: highlighted ? 1 : 0 + border.color: Theme.deckLineColor + color: "transparent" + } + + } + + contentItem: Text { + leftPadding: 5 + rightPadding: root.indicator.width + root.spacing + text: root.displayText + font: root.font + color: Theme.deckTextColor + verticalAlignment: Text.AlignVCenter + elide: Text.ElideRight + } + + popup: Popup { + y: root.height + width: root.width + implicitHeight: contentItem.implicitHeight + + contentItem: ListView { + clip: true + implicitHeight: contentHeight + model: root.popup.visible ? root.delegateModel : null + currentIndex: root.highlightedIndex + + ScrollIndicator.vertical: ScrollIndicator { + } + + } + + background: Skin.EmbeddedBackground { + } + + } + +} diff --git a/res/qml/ControlButton.qml b/res/qml/ControlButton.qml new file mode 100644 index 0000000000..6a44ef06e2 --- /dev/null +++ b/res/qml/ControlButton.qml @@ -0,0 +1,35 @@ +import "." as Skin +import Mixxx 0.1 as Mixxx + +Skin.Button { + id: root + + property string group // required + property string key // required + property bool toggleable: false + + function toggle() { + control.value = !control.value; + } + + highlight: control.value + onPressed: { + if (toggleable) + toggle(); + else + control.value = 1; + } + onReleased: { + if (!toggleable) + control.value = 0; + + } + + Mixxx.ControlProxy { + id: control + + group: root.group + key: root.key + } + +} diff --git a/res/qml/ControlKnob.qml b/res/qml/ControlKnob.qml new file mode 100644 index 0000000000..6808070808 --- /dev/null +++ b/res/qml/ControlKnob.qml @@ -0,0 +1,22 @@ +import "." as Skin +import Mixxx 0.1 as Mixxx +import QtQuick 2.12 + +Skin.Knob { + id: root + + property alias group: control.group + property alias key: control.key + + value: control.parameter + onTurned: control.parameter = value + + Mixxx.ControlProxy { + id: control + } + + TapHandler { + onDoubleTapped: control.reset() + } + +} diff --git a/res/qml/ControlMiniKnob.qml b/res/qml/ControlMiniKnob.qml new file mode 100644 index 0000000000..5cdffcac25 --- /dev/null +++ b/res/qml/ControlMiniKnob.qml @@ -0,0 +1,22 @@ +import "." as Skin +import Mixxx 0.1 as Mixxx +import QtQuick 2.12 + +Skin.MiniKnob { + id: root + + property alias group: control.group + property alias key: control.key + + value: control.parameter + onTurned: control.parameter = value + + Mixxx.ControlProxy { + id: control + } + + TapHandler { + onDoubleTapped: control.reset() + } + +} diff --git a/res/qml/ControlSlider.qml b/res/qml/ControlSlider.qml new file mode 100644 index 0000000000..add929ffc9 --- /dev/null +++ b/res/qml/ControlSlider.qml @@ -0,0 +1,20 @@ +import "." as Skin +import Mixxx 0.1 as Mixxx +import QtQuick 2.12 + +Skin.Slider { + property alias group: control.group + property alias key: control.key + + value: control.parameter + onMoved: control.parameter = value + + Mixxx.ControlProxy { + id: control + } + + TapHandler { + onDoubleTapped: control.reset() + } + +} diff --git a/res/qml/CrossfaderRow.qml b/res/qml/CrossfaderRow.qml new file mode 100644 index 0000000000..a3a35530b1 --- /dev/null +++ b/res/qml/CrossfaderRow.qml @@ -0,0 +1,108 @@ +import "." as Skin +import Mixxx 0.1 as Mixxx +import QtQuick 2.12 +import QtQuick.Controls 2.12 +import "Theme" + +Item { + id: root + + property real crossfaderWidth // required + + implicitHeight: crossfader.height + + Skin.SectionBackground { + anchors.fill: microphoneRow + } + + Row { + id: microphoneRow + + anchors.top: parent.top + anchors.bottom: parent.bottom + anchors.left: parent.left + anchors.right: crossfader.left + layoutDirection: Qt.RightToLeft + padding: 5 + spacing: 10 + + Skin.MicrophoneUnit { + unitNumber: 1 + } + + Skin.MicrophoneUnit { + unitNumber: 2 + } + + Skin.MicrophoneUnit { + unitNumber: 3 + } + + Skin.MicrophoneUnit { + unitNumber: 4 + } + + Skin.MicrophoneDuckingPanel { + } + + } + + Skin.SectionBackground { + id: crossfader + + anchors.centerIn: parent + width: root.crossfaderWidth + height: crossfaderSlider.height + 20 + + Skin.ControlSlider { + id: crossfaderSlider + + anchors.left: parent.left + anchors.right: parent.right + anchors.leftMargin: 5 + anchors.rightMargin: 5 + anchors.verticalCenter: parent.verticalCenter + orientation: Qt.Horizontal + group: "[Master]" + key: "crossfader" + barColor: Theme.crossfaderBarColor + barStart: 0.5 + fg: Theme.imgCrossfaderHandle + bg: Theme.imgCrossfaderBackground + } + + } + + Row { + id: auxiliaryRow + + anchors.left: crossfader.right + anchors.top: parent.top + anchors.bottom: parent.bottom + anchors.right: parent.right + padding: 5 + spacing: 10 + + Skin.AuxiliaryUnit { + layoutDirection: Qt.RightToLeft + unitNumber: 1 + } + + Skin.AuxiliaryUnit { + layoutDirection: Qt.RightToLeft + unitNumber: 2 + } + + Skin.AuxiliaryUnit { + layoutDirection: Qt.RightToLeft + unitNumber: 3 + } + + Skin.AuxiliaryUnit { + layoutDirection: Qt.RightToLeft + unitNumber: 4 + } + + } + +} diff --git a/res/qml/Deck.qml b/res/qml/Deck.qml new file mode 100644 index 0000000000..d3661dc5d6 --- /dev/null +++ b/res/qml/Deck.qml @@ -0,0 +1,387 @@ +import "." as Skin +import Mixxx 0.1 as Mixxx +import Mixxx.Controls 0.1 as MixxxControls +import QtQuick 2.12 +import QtQuick.Controls 2.12 +import QtQuick.Layouts 1.11 +import "Theme" + +Item { + id: root + + property string group // required + property bool minimized: false + property var deckPlayer: Mixxx.PlayerManager.getPlayer( |