mirror of
https://gitlab.com/kelteseth/ScreenPlay.git
synced 2024-11-07 03:22:33 +01:00
Refactor sidebar and remove size hack
This commit is contained in:
kelteseth
parent
2c509c2845
commit
d5a29ae024
@ -157,8 +157,6 @@ Item {
|
||||
Item {
|
||||
id: headlineWrapper
|
||||
height: 80
|
||||
opacity: 0
|
||||
enabled: false
|
||||
width: 400
|
||||
anchors {
|
||||
top: imageWrapper.bottom
|
||||
@ -171,8 +169,9 @@ Item {
|
||||
|
||||
Text {
|
||||
id: txtHeadline
|
||||
text: ""
|
||||
height:150
|
||||
text: qsTr("Headline")
|
||||
height: 100
|
||||
width: 400
|
||||
renderType: Text.NativeRendering
|
||||
font.family: "Roboto"
|
||||
font.weight: Font.Thin
|
||||
@ -182,7 +181,7 @@ Item {
|
||||
wrapMode: Text.WrapAnywhere
|
||||
anchors {
|
||||
top: parent.top
|
||||
right:parent.right
|
||||
right: parent.right
|
||||
bottom: parent.bottom
|
||||
left: parent.left
|
||||
leftMargin: 20
|
||||
@ -192,8 +191,9 @@ Item {
|
||||
Text {
|
||||
id: txtHeadlineMonitor
|
||||
text: qsTr("Select a Monitor to display the content")
|
||||
height:50
|
||||
height: 30
|
||||
renderType: Text.NativeRendering
|
||||
horizontalAlignment: Qt.AlignHCenter
|
||||
font.family: "Roboto"
|
||||
font.pixelSize: 18
|
||||
color: "#2F2F2F"
|
||||
@ -201,19 +201,19 @@ Item {
|
||||
anchors {
|
||||
top: headlineWrapper.bottom
|
||||
topMargin: 20
|
||||
right:parent.right
|
||||
left: parent.left
|
||||
leftMargin: 20
|
||||
}
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
id: monitorSelectionWrapper
|
||||
height: 80
|
||||
opacity: 0
|
||||
enabled: false
|
||||
width: 400
|
||||
anchors {
|
||||
top: txtHeadlineMonitor.bottom
|
||||
right:parent.right
|
||||
left: parent.left
|
||||
}
|
||||
|
||||
MonitorSelection {
|
||||
@ -221,7 +221,7 @@ Item {
|
||||
width: 360
|
||||
height: parent.height
|
||||
availableWidth: 360
|
||||
fontSize:11
|
||||
fontSize: 11
|
||||
availableHeight: 50
|
||||
anchors {
|
||||
top: parent.top
|
||||
@ -229,17 +229,85 @@ Item {
|
||||
}
|
||||
}
|
||||
}
|
||||
Item {
|
||||
id: sliderVolumeWrapper
|
||||
height: 100
|
||||
width: 400
|
||||
anchors {
|
||||
top: monitorSelectionWrapper.bottom
|
||||
topMargin: 30
|
||||
right: parent.right
|
||||
rightMargin: 30
|
||||
leftMargin: 30
|
||||
left: parent.left
|
||||
}
|
||||
Text {
|
||||
id: txtSliderVolume
|
||||
text: qsTr("Volume")
|
||||
height: 30
|
||||
renderType: Text.NativeRendering
|
||||
font.family: "Roboto"
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
font.pixelSize: 18
|
||||
color: "#626262"
|
||||
wrapMode: Text.WrapAnywhere
|
||||
anchors {
|
||||
top: parent.top
|
||||
left: parent.left
|
||||
}
|
||||
}
|
||||
Row {
|
||||
id: sliderVolumeWrapperBottom
|
||||
height: 70
|
||||
spacing: 30
|
||||
width: 300
|
||||
anchors {
|
||||
bottom: parent.bottom
|
||||
horizontalCenter: parent.horizontalCenter
|
||||
}
|
||||
Image {
|
||||
width: 20
|
||||
height: 20
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
source: "qrc:/assets/icons/icon_volume.svg"
|
||||
sourceSize: Qt.size(20, 20)
|
||||
}
|
||||
|
||||
Slider {
|
||||
id: sliderVolume
|
||||
stepSize: 0.1
|
||||
from: 0
|
||||
live: true
|
||||
value: .8
|
||||
to: 1
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
onValueChanged: {
|
||||
print(Math.round(sliderVolume.value * 100) / 100)
|
||||
}
|
||||
}
|
||||
|
||||
Text {
|
||||
id: name
|
||||
color: "#818181"
|
||||
text: Math.round(sliderVolume.value * 100) / 100
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
font.family: "Libre Baskerville"
|
||||
font.pointSize: 12
|
||||
font.italic: true
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Item {
|
||||
id: item1
|
||||
width: 400
|
||||
height: 100
|
||||
opacity: 0
|
||||
enabled: false
|
||||
anchors {
|
||||
bottom: parent.bottom
|
||||
}
|
||||
|
||||
Button {
|
||||
id: btnSetWallpaper
|
||||
text: qsTr("Set wallpaper")
|
||||
@ -248,7 +316,7 @@ Item {
|
||||
Material.foreground: "white"
|
||||
|
||||
icon.source: "qrc:/assets/icons/icon_plus.svg"
|
||||
icon.color:"white"
|
||||
icon.color: "white"
|
||||
icon.width: 16
|
||||
icon.height: 16
|
||||
anchors {
|
||||
@ -262,11 +330,13 @@ Item {
|
||||
screenPlay.createWallpaper(
|
||||
monitorSelection.activeMonitorIndex,
|
||||
installedListModel.absoluteStoragePath + "/" + activeScreen,
|
||||
installedListModel.get(activeScreen).screenPreview)
|
||||
installedListModel.get(
|
||||
activeScreen).screenPreview)
|
||||
} else if (type === "widget") {
|
||||
screenPlay.createWidget(
|
||||
installedListModel.absoluteStoragePath + "/" + activeScreen,
|
||||
installedListModel.get(activeScreen).screenPreview)
|
||||
installedListModel.get(
|
||||
activeScreen).screenPreview)
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -311,33 +381,14 @@ Item {
|
||||
}
|
||||
|
||||
PropertyChanges {
|
||||
target: sidebarWrapper
|
||||
anchors.leftMargin: 0
|
||||
target: sidebar
|
||||
anchors.rightMargin: 0
|
||||
}
|
||||
PropertyChanges {
|
||||
target: image
|
||||
opacity: 1
|
||||
anchors.topMargin: 0
|
||||
}
|
||||
|
||||
PropertyChanges {
|
||||
target: item1
|
||||
opacity: 1
|
||||
enabled: true
|
||||
}
|
||||
|
||||
|
||||
PropertyChanges {
|
||||
target: monitorSelectionWrapper
|
||||
enabled: true
|
||||
opacity: 1
|
||||
}
|
||||
|
||||
PropertyChanges {
|
||||
target: headlineWrapper
|
||||
enabled: true
|
||||
opacity: 1
|
||||
}
|
||||
},
|
||||
State {
|
||||
name: "inactive"
|
||||
@ -348,8 +399,8 @@ Item {
|
||||
}
|
||||
|
||||
PropertyChanges {
|
||||
target: sidebarWrapper
|
||||
anchors.leftMargin: sidebar.width
|
||||
target: sidebar
|
||||
anchors.rightMargin: - sidebar.width
|
||||
}
|
||||
PropertyChanges {
|
||||
target: image
|
||||
@ -364,10 +415,7 @@ Item {
|
||||
enabled: true
|
||||
}
|
||||
|
||||
PropertyChanges {
|
||||
target: sidebarWrapper
|
||||
anchors.leftMargin: 0
|
||||
}
|
||||
|
||||
|
||||
PropertyChanges {
|
||||
target: image
|
||||
@ -375,19 +423,6 @@ Item {
|
||||
anchors.topMargin: 0
|
||||
}
|
||||
|
||||
PropertyChanges {
|
||||
target: monitorSelectionWrapper
|
||||
enabled: false
|
||||
visible: true
|
||||
opacity: 0
|
||||
}
|
||||
|
||||
PropertyChanges {
|
||||
target: item1
|
||||
opacity: 1
|
||||
enabled: true
|
||||
}
|
||||
|
||||
PropertyChanges {
|
||||
target: headlineWrapper
|
||||
opacity: 1
|
||||
@ -402,8 +437,8 @@ Item {
|
||||
|
||||
SequentialAnimation {
|
||||
NumberAnimation {
|
||||
target: sidebarWrapper
|
||||
properties: "anchors.leftMargin"
|
||||
target: sidebar
|
||||
properties: "anchors.rightMargin"
|
||||
duration: 250
|
||||
easing.type: Easing.InOutQuad
|
||||
}
|
||||
@ -419,11 +454,6 @@ Item {
|
||||
property: "anchors.topMargin"
|
||||
duration: 100
|
||||
}
|
||||
NumberAnimation {
|
||||
targets: ["headlineWrapper", "monitorSelectionWrapper", "sliderVolumeWrapper"]
|
||||
property: "opacity"
|
||||
duration: 100
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
@ -442,24 +472,19 @@ Item {
|
||||
}
|
||||
|
||||
NumberAnimation {
|
||||
target: sidebarWrapper
|
||||
properties: "anchors.leftMargin"
|
||||
target: sidebar
|
||||
properties: "anchors.rightMargin"
|
||||
duration: 250
|
||||
easing.type: Easing.InOutQuad
|
||||
}
|
||||
NumberAnimation {
|
||||
targets: ["headlineWrapper", "monitorSelectionWrapper", "sliderVolumeWrapper"]
|
||||
property: "opacity"
|
||||
duration: 100
|
||||
}
|
||||
},
|
||||
Transition {
|
||||
to: "activeWidget"
|
||||
|
||||
SequentialAnimation {
|
||||
NumberAnimation {
|
||||
target: sidebarWrapper
|
||||
properties: "anchors.leftMargin"
|
||||
target: sidebar
|
||||
properties: "anchors.rightMargin"
|
||||
duration: 250
|
||||
easing.type: Easing.InOutQuad
|
||||
}
|
||||
@ -475,11 +500,6 @@ Item {
|
||||
property: "anchors.topMargin"
|
||||
duration: 100
|
||||
}
|
||||
NumberAnimation {
|
||||
targets: ["headlineWrapper", "monitorSelectionWrapper", "sliderVolumeWrapper"]
|
||||
property: "opacity"
|
||||
duration: 100
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user