add floating toggle to settings app
This commit is contained in:
parent
10c34ffabc
commit
69613a3b14
@ -79,7 +79,6 @@ FloatingWindow {
|
|||||||
acceptedButtons: Qt.LeftButton
|
acceptedButtons: Qt.LeftButton
|
||||||
onClicked: {
|
onClicked: {
|
||||||
contentLoader.source = parent.modelData.source;
|
contentLoader.source = parent.modelData.source;
|
||||||
console.log(parent.index);
|
|
||||||
pageView.currentIndex = parent.index;
|
pageView.currentIndex = parent.index;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -31,55 +31,62 @@ ClippingWrapperRectangle {
|
|||||||
|
|
||||||
ColumnLayout {
|
ColumnLayout {
|
||||||
id: verticalLayout
|
id: verticalLayout
|
||||||
Rectangle {
|
anchors.margins: 20
|
||||||
|
anchors.fill: parent
|
||||||
|
ClippingWrapperRectangle {
|
||||||
id: fontWrapper
|
id: fontWrapper
|
||||||
radius: 14
|
leftMargin: 10
|
||||||
|
rightMargin: 10
|
||||||
|
implicitWidth: 300
|
||||||
|
topLeftRadius: 12
|
||||||
|
topRightRadius: 12
|
||||||
|
bottomRightRadius: 4
|
||||||
|
bottomLeftRadius: 4
|
||||||
|
|
||||||
color: Colors.surfaceContainerHigh
|
color: Colors.surfaceContainerHigh
|
||||||
implicitHeight: 30
|
implicitHeight: 30
|
||||||
implicitWidth: 300
|
child: RowLayout {
|
||||||
RowLayout {
|
|
||||||
id: fontLayout
|
id: fontLayout
|
||||||
anchors.verticalCenter: parent.verticalCenter
|
spacing: 40
|
||||||
anchors.fill: parent
|
|
||||||
clip: true
|
|
||||||
spacing: 10
|
|
||||||
CustomText {
|
CustomText {
|
||||||
id: fontText
|
id: fontText
|
||||||
Layout.leftMargin: 20
|
|
||||||
Layout.alignment: Qt.AlignLeft
|
|
||||||
font.bold: true
|
|
||||||
text: "current font: " + Settings.config.font
|
text: "current font: " + Settings.config.font
|
||||||
|
Layout.fillWidth: true
|
||||||
|
}
|
||||||
|
CustomButton {
|
||||||
|
id: fontPickerButton
|
||||||
|
customText: "pick font"
|
||||||
|
implicitHeight: fontWrapper.implicitHeight - 10
|
||||||
|
onClicked: fontPicker.open()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
Rectangle {
|
ClippingWrapperRectangle {
|
||||||
id: floatingWrapper
|
id: floatingWrapper
|
||||||
radius: 14
|
leftMargin: 10
|
||||||
color: Colors.surfaceContainerHigh
|
rightMargin: 10
|
||||||
implicitHeight: 30
|
implicitHeight: 30
|
||||||
implicitWidth: 300
|
implicitWidth: 300
|
||||||
RowLayout {
|
bottomLeftRadius: 12
|
||||||
|
bottomRightRadius: 12
|
||||||
|
topRightRadius: 4
|
||||||
|
topLeftRadius: 4
|
||||||
|
color: Colors.surfaceContainerHigh
|
||||||
|
child: RowLayout {
|
||||||
id: floatingToggleLayout
|
id: floatingToggleLayout
|
||||||
anchors.fill: parent
|
spacing: 40
|
||||||
anchors.verticalCenter: parent.verticalCenter
|
|
||||||
clip: true
|
|
||||||
spacing: 10
|
|
||||||
CustomText {
|
CustomText {
|
||||||
id: floatingToggleText
|
id: floatingToggleText
|
||||||
Layout.leftMargin: 20
|
|
||||||
Layout.alignment: Qt.AlignLeft
|
|
||||||
font.bold: true
|
|
||||||
text: "top bar floating"
|
text: "top bar floating"
|
||||||
|
Layout.fillWidth: true
|
||||||
}
|
}
|
||||||
CustomSwitch {
|
CustomSwitch {
|
||||||
Layout.alignment: Qt.AlignRight
|
implicitHeight: floatingWrapper.implicitHeight - 10
|
||||||
Layout.rightMargin: 20
|
implicitWidth: 34
|
||||||
implicitHeight: 15
|
|
||||||
implicitWidth: 30
|
|
||||||
|
|
||||||
onToggled: {
|
onToggled: {
|
||||||
Settings.config.floating = !Settings.config.floating;
|
Settings.config.floating = !Settings.config.floating;
|
||||||
}
|
}
|
||||||
|
Layout.rightMargin: 5
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -0,0 +1,23 @@
|
|||||||
|
import QtQuick
|
||||||
|
import qs
|
||||||
|
import QtQuick.Controls.Basic
|
||||||
|
|
||||||
|
Button {
|
||||||
|
id: control
|
||||||
|
property bool showText: false
|
||||||
|
property string customText
|
||||||
|
|
||||||
|
contentItem: CustomText {
|
||||||
|
id: contentText
|
||||||
|
text: control.customText
|
||||||
|
horizontalAlignment: Text.AlignHCenter
|
||||||
|
verticalAlignment: Text.AlignVCenter
|
||||||
|
}
|
||||||
|
background: Rectangle {
|
||||||
|
id: contentBackground
|
||||||
|
border.color: control.down ? Colors.primaryFixed : Colors.primary
|
||||||
|
border.width: 1
|
||||||
|
radius: parent.implicitHeight / 2
|
||||||
|
color: "transparent"
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -5,23 +5,22 @@ import qs
|
|||||||
Switch {
|
Switch {
|
||||||
id: control
|
id: control
|
||||||
indicator: Rectangle {
|
indicator: Rectangle {
|
||||||
implicitWidth: parent.implicitWidth
|
|
||||||
implicitHeight: parent.implicitHeight
|
|
||||||
anchors.verticalCenter: parent.verticalCenter
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
x: control.leftPadding
|
x: control.leftPadding
|
||||||
y: parent.height / 2 - height / 2
|
y: parent.height / 2 - height / 2
|
||||||
radius: 13
|
implicitWidth: parent.implicitWidth
|
||||||
color: control.checked ? Colors.surfaceContainerHighest : Colors.surfaceContainerHighest
|
implicitHeight: parent.implicitHeight
|
||||||
|
radius: 26
|
||||||
|
color: Colors.surfaceContainerLow
|
||||||
border.color: control.checked ? Colors.primary : Colors.onSurfaceColor
|
border.color: control.checked ? Colors.primary : Colors.onSurfaceColor
|
||||||
|
|
||||||
Rectangle {
|
Rectangle {
|
||||||
x: control.checked ? parent.width - width : 0
|
implicitHeight: parent.implicitHeight - 6
|
||||||
|
implicitWidth: parent.implicitWidth / 2 - 3
|
||||||
|
x: control.checked ? parent.width - width - 3 : 3
|
||||||
anchors.verticalCenter: parent.verticalCenter
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
width: parent.implicitWidth / 2
|
radius: 24
|
||||||
height: parent.implicitHeight
|
|
||||||
radius: 13
|
|
||||||
color: control.down ? Colors.surfaceContainerHighest : Colors.primary
|
color: control.down ? Colors.surfaceContainerHighest : Colors.primary
|
||||||
border.color: control.checked ? (control.down ? Colors.onSurfaceColor : Colors.primary) : "#999999"
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user