117 lines
4.1 KiB
QML
117 lines
4.1 KiB
QML
import QtQuick 2.12
|
|
import QtQuick.Controls 2.12
|
|
import QtQuick.Layouts 1.12
|
|
import QtGraphicalEffects 1.12
|
|
import "../components"
|
|
|
|
Item {
|
|
id: page
|
|
|
|
ColumnLayout {
|
|
anchors.fill: parent
|
|
anchors.margins: 8
|
|
spacing: 12
|
|
|
|
BackHeader { title: "Обводка отклика"; onBack: page.StackView.view.pop() }
|
|
|
|
Text {
|
|
Layout.fillWidth: true
|
|
text: "Цвет и ширина свечения вокруг кнопки при успехе (ОК) и ошибке."
|
|
color: settingsContainer.darkMode ? "#cccccc" : "#444444"
|
|
font.pixelSize: 12
|
|
wrapMode: Text.Wrap
|
|
}
|
|
|
|
// OK color
|
|
RowLayout {
|
|
Layout.fillWidth: true
|
|
Text { text: "Цвет «ОК»:"; color: settingsContainer.darkMode ? "white" : "black"; Layout.preferredWidth: 150 }
|
|
TextField {
|
|
id: okColor
|
|
Layout.fillWidth: true
|
|
text: settingsContainer.feedbackOkColor
|
|
onEditingFinished: btnController.setFeedbackColors(text, errorColor.text)
|
|
}
|
|
Rectangle {
|
|
width: 28; height: 28; radius: 14
|
|
color: okColor.text || "#00cc44"
|
|
border.color: "#80ffffff"; border.width: 1
|
|
}
|
|
}
|
|
|
|
LabeledSlider {
|
|
label: "Ширина «ОК»"
|
|
from: 0; to: 30; stepSize: 1
|
|
value: settingsContainer.feedbackOkWidth
|
|
onMoved: btnController.setFeedbackWidths(value, settingsContainer.feedbackErrorWidth)
|
|
}
|
|
|
|
// Error color
|
|
RowLayout {
|
|
Layout.fillWidth: true
|
|
Text { text: "Цвет «Ошибка»:"; color: settingsContainer.darkMode ? "white" : "black"; Layout.preferredWidth: 150 }
|
|
TextField {
|
|
id: errorColor
|
|
Layout.fillWidth: true
|
|
text: settingsContainer.feedbackErrorColor
|
|
onEditingFinished: btnController.setFeedbackColors(okColor.text, text)
|
|
}
|
|
Rectangle {
|
|
width: 28; height: 28; radius: 14
|
|
color: errorColor.text || "#cc2200"
|
|
border.color: "#80ffffff"; border.width: 1
|
|
}
|
|
}
|
|
|
|
LabeledSlider {
|
|
label: "Ширина «Ошибка»"
|
|
from: 0; to: 30; stepSize: 1
|
|
value: settingsContainer.feedbackErrorWidth
|
|
onMoved: btnController.setFeedbackWidths(settingsContainer.feedbackOkWidth, value)
|
|
}
|
|
|
|
LabeledSlider {
|
|
label: "Радиус свечения"
|
|
from: 0; to: 60; stepSize: 1
|
|
value: settingsContainer.feedbackGlowRadius
|
|
onMoved: btnController.setFeedbackGlowRadius(value)
|
|
}
|
|
|
|
// Preview
|
|
RowLayout {
|
|
Layout.fillWidth: true
|
|
Layout.topMargin: 8
|
|
spacing: 32
|
|
Item { Layout.fillWidth: true }
|
|
Repeater {
|
|
model: [
|
|
{ c: settingsContainer.feedbackOkColor, w: settingsContainer.feedbackOkWidth, t: "ОК" },
|
|
{ c: settingsContainer.feedbackErrorColor, w: settingsContainer.feedbackErrorWidth, t: "Ошибка" }
|
|
]
|
|
delegate: Rectangle {
|
|
width: 84; height: 84; radius: 42
|
|
color: "#7b007b"
|
|
border.color: modelData.c
|
|
border.width: modelData.w
|
|
Text {
|
|
anchors.centerIn: parent
|
|
text: modelData.t
|
|
color: "white"
|
|
font.bold: true
|
|
}
|
|
layer.enabled: settingsContainer.feedbackGlowRadius > 0
|
|
layer.effect: Glow {
|
|
radius: settingsContainer.feedbackGlowRadius
|
|
samples: 24
|
|
color: modelData.c
|
|
transparentBorder: true
|
|
}
|
|
}
|
|
}
|
|
Item { Layout.fillWidth: true }
|
|
}
|
|
|
|
Item { Layout.fillHeight: true }
|
|
}
|
|
}
|