You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
231 lines
7.7 KiB
231 lines
7.7 KiB
import QtQuick 2.12 |
|
import QtQuick.Controls 2.12 |
|
import QtQuick.Layouts 1.12 |
|
|
|
import NERvGear 1.0 as NVG |
|
import NERvGear.Controls 1.0 |
|
import NERvGear.Templates 1.0 as T |
|
import NERvGear.Preferences 1.0 as P |
|
|
|
WidgetTemplate { |
|
id: widget |
|
title: qsTr("Ordinal Scale Bottom UI widget") |
|
editing: styleDialog.active |
|
|
|
readonly property var configs: widget.settings.styles |
|
|
|
version: "1.0.1" |
|
defaultValues: { |
|
"Curve": true, |
|
"Circle Color": "#fffcf9", |
|
"Line Color": "#fffcf9", |
|
"Line Width": 38, |
|
"Shadow Color": "#e0e0e0", |
|
"Shadow Size": 0.5, |
|
"Battle UI": false, |
|
"Clock Visible": true, |
|
"Full Clock": true, |
|
"Font Color": "#f5f5f5", |
|
"Font Size": 44, |
|
"Font Name": 0, |
|
"Font Weight": 0, |
|
"Text Vertical Offset": 16 |
|
} |
|
|
|
property string line_color: configs["Line Color"] |
|
property string shadowColor: configs["Shadow Color"] |
|
property real shadowBlur: configs["Shadow Size"] |
|
|
|
readonly property real h: Math.min(widget.width, widget.height) |
|
readonly property real w: widget.width |
|
readonly property real r: (w**2+4*h**2)/2/h |
|
|
|
onConfigsChanged: { |
|
line.requestPaint(); |
|
triangle.requestPaint(); |
|
} |
|
|
|
Canvas { |
|
id: triangle |
|
anchors.centerIn: parent |
|
anchors.verticalCenterOffset: height/2 |
|
width: 0.4*h |
|
height: 0.4*h*Math.sin(Math.PI/6) |
|
contextType: "2d" |
|
onPaint: { |
|
context.reset(); |
|
context.clearRect(0,0,width,height); |
|
context.shadowBlur = shadowBlur; |
|
context.shadowColor = shadowColor; |
|
context.lineWidth = Math.max(0.08*configs["Line Width"], 0.1); |
|
context.strokeStyle = line_color; |
|
context.beginPath(); |
|
context.moveTo(0,0); |
|
context.lineTo(width/2, height); |
|
context.lineTo(width, 0); |
|
context.lineTo(0, 0); |
|
context.fillStyle = line_color; |
|
context.fill(); |
|
} |
|
} |
|
|
|
Canvas { |
|
id: line |
|
anchors.centerIn: parent |
|
width: widget.width |
|
height: widget.height |
|
contextType: "2d" |
|
onPaint: { |
|
context.reset(); |
|
context.clearRect(0,0,width,height); |
|
context.shadowBlur = shadowBlur; |
|
context.shadowColor = shadowColor; |
|
context.lineWidth = Math.max(0.08*configs["Line Width"], 0.1); |
|
context.strokeStyle = line_color; |
|
if (configs["Curve"]) { |
|
let deg = Math.asin(w/2/r)*0.95; |
|
context.beginPath(); |
|
context.arc(w/2, r+h/2, r, deg+Math.PI*3/2, -deg+Math.PI*3/2, true); |
|
} else { |
|
context.beginPath(); |
|
context.moveTo(0, height/2); |
|
context.lineTo(width, height/2); |
|
} |
|
context.stroke(); |
|
} |
|
} |
|
|
|
menu: Menu { |
|
Action { |
|
text: qsTr("Settings") + "..." |
|
onTriggered: styleDialog.active = true |
|
} |
|
} |
|
|
|
Loader { |
|
id: styleDialog |
|
active: false |
|
sourceComponent: NVG.Window { |
|
id: window |
|
title: qsTr("Settings") |
|
visible: true |
|
minimumWidth: 380 |
|
minimumHeight: 500 |
|
width: minimumWidth |
|
height: minimumHeight |
|
|
|
transientParent: widget.NVG.View.window |
|
|
|
property var configuration |
|
|
|
Page { |
|
id: cfg_page |
|
anchors.fill: parent |
|
|
|
header: TitleBar { |
|
text: qsTr("Ordinal Scale Bottom UI widget") |
|
|
|
standardButtons: Dialog.Save | Dialog.Reset |
|
|
|
onAccepted: { |
|
configuration = rootPreference.save(); |
|
widget.settings.styles = configuration; |
|
styleDialog.active = false; |
|
} |
|
|
|
onReset: { |
|
rootPreference.load(); |
|
let cfg = rootPreference.save(); |
|
widget.settings.styles = cfg; |
|
line.requestPaint(); |
|
triangle.requestPaint(); |
|
} |
|
} |
|
|
|
ColumnLayout { |
|
id: root |
|
anchors.fill: parent |
|
anchors.margins: 16 |
|
anchors.topMargin: 0 |
|
|
|
Flickable { |
|
Layout.fillWidth: true |
|
Layout.fillHeight: true |
|
|
|
clip: true |
|
contentWidth: preferenceLayout.implicitWidth |
|
contentHeight: preferenceLayout.implicitHeight |
|
|
|
ColumnLayout { |
|
id: preferenceLayout |
|
width: root.width |
|
|
|
P.PreferenceGroup { |
|
id: rootPreference |
|
Layout.fillWidth: true |
|
|
|
label: qsTr("Configuration") |
|
|
|
onPreferenceEdited: { |
|
widget.settings.styles = rootPreference.save(); |
|
} |
|
|
|
P.SwitchPreference { |
|
name: "Curve" |
|
label: qsTr("Curve") |
|
defaultValue: defaultValues["Curve"] |
|
} |
|
|
|
P.ColorPreference { |
|
name: "Line Color" |
|
label: qsTr("Line Color") |
|
defaultValue: defaultValues["Line Color"] |
|
} |
|
|
|
P.SliderPreference { |
|
name: "Line Width" |
|
label: qsTr("Line Width") |
|
from: 1 |
|
to: 100 |
|
stepSize: 1 |
|
defaultValue: defaultValues["Line Width"] |
|
displayValue: value + "%" |
|
} |
|
|
|
P.ColorPreference { |
|
name: "Shadow Color" |
|
label: qsTr("Shadow Color") |
|
defaultValue: defaultValues["Shadow Color"] |
|
} |
|
|
|
P.SliderPreference { |
|
name: "Shadow Size" |
|
label: qsTr("Shadow Size") |
|
from: 0 |
|
to: 3 |
|
stepSize: 0.1 |
|
defaultValue: defaultValues["Shadow Size"] |
|
displayValue: Math.round(value*10)/10 + "px" |
|
} |
|
|
|
Component.onCompleted: { |
|
if(!widget.settings.styles) { |
|
configuration = rootPreference.save(); |
|
widget.settings.styles = configuration; |
|
} |
|
rootPreference.load(widget.settings.styles); |
|
configuration = widget.settings.styles; |
|
} |
|
} |
|
} |
|
} |
|
} |
|
} |
|
|
|
onClosing: { |
|
widget.settings.styles = configuration; |
|
styleDialog.active = false; |
|
} |
|
} |
|
} |
|
}
|
|
|