307 lines
9.2 KiB
QML
307 lines
9.2 KiB
QML
import QtQuick
|
|
import QtQuick.Layouts 2.15
|
|
import QtQuick.Controls 2.15
|
|
|
|
Window {
|
|
id: window
|
|
width: 1280
|
|
height: 720
|
|
visible: true
|
|
flags: Qt.Window
|
|
title: qsTr("Hello World")
|
|
|
|
Image {
|
|
id: image
|
|
opacity: 0.296
|
|
visible: true
|
|
anchors.fill: parent
|
|
horizontalAlignment: Image.AlignHCenter
|
|
verticalAlignment: Image.AlignVCenter
|
|
source: "images/GovuztTW8AAHqBf.jpeg"
|
|
focus: false
|
|
activeFocusOnTab: false
|
|
state: ""
|
|
layer.enabled: false
|
|
antialiasing: false
|
|
clip: false
|
|
transformOrigin: Item.Center
|
|
scale: 1
|
|
mirror: false
|
|
mipmap: false
|
|
cache: true
|
|
autoTransform: true
|
|
asynchronous: false
|
|
sourceSize.height: 0
|
|
sourceSize.width: 0
|
|
fillMode: Image.Stretch
|
|
}
|
|
|
|
Button {
|
|
id: button
|
|
x: 440
|
|
y: 105
|
|
width: 335
|
|
height: 170
|
|
hoverEnabled: false
|
|
anchors.centerIn: parent
|
|
opacity: 1
|
|
background: Image {
|
|
id: buttonImage
|
|
source: "images/Play_Button/Play_Active.svg"
|
|
}
|
|
|
|
Connections {
|
|
target: button
|
|
function onPressed() { buttonImage.source = "images/Play_Button/Play_pressed.svg" }
|
|
}
|
|
|
|
Connections {
|
|
target: button
|
|
function onReleased() { buttonImage.source = "images/Play_Button/Play_Active.svg" }
|
|
}
|
|
}
|
|
|
|
ComboBox {
|
|
id: profileBox
|
|
width: 117
|
|
height: 42
|
|
anchors.left: button.right
|
|
anchors.bottom: button.top
|
|
anchors.leftMargin: -335
|
|
anchors.bottomMargin: -218
|
|
editable: false
|
|
leftPadding: -30
|
|
|
|
model: ["First","Second","Third"]
|
|
|
|
|
|
delegate: ItemDelegate {
|
|
id: delegate
|
|
|
|
required property var model
|
|
required property int index
|
|
|
|
width: profileBox.width
|
|
contentItem: Text {
|
|
text: delegate.model[profileBox.textRole]
|
|
color: "#ffffff"
|
|
font: profileBox.font
|
|
elide: Text.ElideRight
|
|
horizontalAlignment: Text.AlignLeft
|
|
verticalAlignment: Text.AlignVCenter
|
|
|
|
|
|
}
|
|
highlighted: profileBox.highlightedIndex === index
|
|
background: Rectangle{
|
|
color: delegate.highlighted ? "#91B315" : "#232323"
|
|
radius: 5
|
|
|
|
}
|
|
}
|
|
indicator: Image {
|
|
id: dropDownArrow
|
|
visible: true
|
|
horizontalAlignment: Image.AlignRight
|
|
anchors.leftMargin: 10
|
|
anchors.left: parent.left
|
|
anchors.verticalCenter: parent.verticalCenter
|
|
source: profileBox.down ? "images/Profile_Box/Asset_23.svg" : "images/Profile_Box/Asset_24.svg"
|
|
transformOrigin: Item.Center
|
|
sourceSize.height: 10
|
|
sourceSize.width: 10
|
|
fillMode: Image.PreserveAspectFit
|
|
autoTransform: true
|
|
width: 10
|
|
height: 10
|
|
}
|
|
|
|
/*indicator: Canvas {
|
|
id: canvas
|
|
y: profileBox.topPadding + (profileBox.availableHeight - height) / 2
|
|
width: 12
|
|
height: 8
|
|
anchors.left: parent.left
|
|
anchors.leftMargin: 117
|
|
contextType: "2d"
|
|
|
|
onPaint: {
|
|
context.reset();
|
|
context.moveTo(0, 0);
|
|
context.lineTo(width, 0);
|
|
context.lineTo(width / 2, height);
|
|
context.closePath();
|
|
context.fillStyle = profileBox.pressed ? "#ffffff" : "#232323";
|
|
context.fill();
|
|
}
|
|
}*/
|
|
|
|
Connections {
|
|
target: profileBox
|
|
function onActivated() { canvas.requestPaint(); }
|
|
}
|
|
|
|
Connections {
|
|
target: profileBox
|
|
function onActivated() { dropDownArrow.visible = true }
|
|
}
|
|
contentItem: Text {
|
|
leftPadding: 0
|
|
rightPadding: profileBox.indicator.width + profileBox.spacing
|
|
|
|
text: profileBox.displayText
|
|
font: profileBox.font
|
|
color: profileBox.pressed ? "#ffffff" : "#ffffff"
|
|
verticalAlignment: Text.AlignVCenter
|
|
elide: Text.ElideRight
|
|
horizontalAlignment: Text.AlignHCenter
|
|
|
|
}
|
|
|
|
background: Rectangle {
|
|
implicitWidth: 120
|
|
implicitHeight: 40
|
|
border.color: profileBox.pressed ? "#ffffff" : "#232323"
|
|
border.width: profileBox.visualFocus ? 2 : 1
|
|
color: profileBox.down ? "#91B315" : "#232323"
|
|
radius: 6
|
|
}
|
|
|
|
popup: Popup {
|
|
y: profileBox.height - 1
|
|
width: profileBox.width
|
|
height: Math.min(contentItem.implicitHeight, profileBox.Window.height - topMargin - bottomMargin)
|
|
padding: 1
|
|
|
|
contentItem: ListView {
|
|
rotation: 0
|
|
clip: true
|
|
implicitHeight: contentHeight
|
|
model: profileBox.popup.visible ? profileBox.delegateModel : null
|
|
currentIndex: profileBox.highlightedIndex
|
|
|
|
|
|
|
|
ScrollIndicator.vertical: ScrollIndicator {
|
|
parent: ListView.parent
|
|
anchors.top: ListView.top
|
|
anchors.left: ListView.right
|
|
anchors.bottom: ListView.bottom
|
|
|
|
/*background: Rectangle{
|
|
opacity: 0.5
|
|
color: "#91B315"
|
|
}*/
|
|
|
|
}
|
|
}
|
|
|
|
background: Rectangle {
|
|
border.color: "#232323"
|
|
color: "#232323"
|
|
radius: 6
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
ComboBox {
|
|
id: versionBox
|
|
width: 210
|
|
height: 42
|
|
anchors.right: button.right
|
|
anchors.bottom: button.top
|
|
anchors.bottomMargin: -218
|
|
popup: Popup {
|
|
y: versionBox.height - 1
|
|
width: versionBox.width
|
|
height: Math.min(contentItem.implicitHeight, versionBox.Window.height - topMargin - bottomMargin)
|
|
padding: 1
|
|
contentItem: ListView {
|
|
rotation: 0
|
|
model: versionBox.popup.visible ? versionBox.delegateModel : null
|
|
implicitHeight: contentHeight
|
|
currentIndex: versionBox.highlightedIndex
|
|
clip: true
|
|
ScrollIndicator.vertical: ScrollIndicator {
|
|
anchors.left: ListView.right
|
|
anchors.top: ListView.top
|
|
anchors.bottom: ListView.bottom
|
|
parent: ListView.parent
|
|
}
|
|
}
|
|
background: Rectangle {
|
|
color: "#232323"
|
|
radius: 6
|
|
border.color: "#232323"
|
|
}
|
|
}
|
|
model: ["Version 1","Version 2","Version 3"]
|
|
leftPadding: -30
|
|
indicator: Image {
|
|
id: dropDownArrow1
|
|
width: 10
|
|
height: 10
|
|
visible: true
|
|
anchors.verticalCenter: parent.verticalCenter
|
|
anchors.left: parent.left
|
|
anchors.leftMargin: 10
|
|
horizontalAlignment: Image.AlignRight
|
|
source: versionBox.down ? "images/Profile_Box/Asset_23.svg" : "images/Profile_Box/Asset_24.svg"
|
|
transformOrigin: Item.Center
|
|
sourceSize.width: 10
|
|
sourceSize.height: 10
|
|
fillMode: Image.PreserveAspectFit
|
|
autoTransform: true
|
|
}
|
|
editable: false
|
|
delegate: ItemDelegate {
|
|
id: delegate1
|
|
width: versionBox.width
|
|
required property var model
|
|
required property int index
|
|
highlighted: versionBox.highlightedIndex === index
|
|
contentItem: Text {
|
|
color: "#ffffff"
|
|
text: delegate1.model[versionBox.textRole]
|
|
elide: Text.ElideRight
|
|
horizontalAlignment: Text.AlignLeft
|
|
verticalAlignment: Text.AlignVCenter
|
|
font: versionBox.font
|
|
}
|
|
background: Rectangle {
|
|
color: delegate1.highlighted ? "#91B315" : "#232323"
|
|
radius: 5
|
|
}
|
|
}
|
|
Connections {
|
|
target: versionBox
|
|
function onActivated() { canvas.requestPaint(); }
|
|
}
|
|
|
|
Connections {
|
|
target: versionBox
|
|
function onActivated() { dropDownArrow1.visible = true }
|
|
}
|
|
contentItem: Text {
|
|
color: versionBox.pressed ? "#ffffff" : "#ffffff"
|
|
text: versionBox.displayText
|
|
elide: Text.ElideRight
|
|
horizontalAlignment: Text.AlignLeft
|
|
verticalAlignment: Text.AlignVCenter
|
|
rightPadding: versionBox.indicator.width + versionBox.spacing
|
|
leftPadding: 56
|
|
font: versionBox.font
|
|
}
|
|
background: Rectangle {
|
|
color: versionBox.down ? "#91B315" : "#232323"
|
|
radius: 6
|
|
border.color: versionBox.pressed ? "#ffffff" : "#232323"
|
|
border.width: versionBox.visualFocus ? 2 : 1
|
|
implicitWidth: 120
|
|
implicitHeight: 40
|
|
}
|
|
}
|
|
|
|
}
|