diff --git a/logic/include/viewModel/MainViewModel.h b/logic/include/viewModel/MainViewModel.h
index 6fafee4..3820772 100644
--- a/logic/include/viewModel/MainViewModel.h
+++ b/logic/include/viewModel/MainViewModel.h
@@ -16,8 +16,8 @@ class MainViewModel : public QtMvvm::ViewModel
Console * panel;
- MVVM_PROPERTY(int, dialStepInc, 1)
- MVVM_PROPERTY(int, dialStepDec, -1)
+ MVVM_PROPERTY(int, stepInc, 1)
+ MVVM_PROPERTY(int, stepDec, -1)
//Top Left
BUTTON_LED_PROPERTY(patient, Patient, false, LedOFF)
@@ -94,8 +94,8 @@ class MainViewModel : public QtMvvm::ViewModel
LED_PROPERTY(depthCenter, LedOFF) //zoom -> depthCenterLed
LED_PROPERTY(depthBottom, LedOFF) //depth -> depthBottomLed
LED_PROPERTY(focus, LedOFF) //angle -> focusLed
- LED_PROPERTY(focusCenter, LedOFF) //focus zone -> focusCenterLed
- LED_PROPERTY(focusBottom, LedOFF) //focus-depth -> focusBottomLed
+ LED_PROPERTY(focusCenter, LedOFF) //focusZone -> focusCenterLed
+ LED_PROPERTY(focusBottom, LedOFF) //focusDepth -> focusBottomLed
BUTTON_PROPERTY(depthCenter, DepthCenter, false)
BUTTON_PROPERTY(focusCenter, FocusCenter, false)
diff --git a/logic/include/viewModel/utils/Property.h b/logic/include/viewModel/utils/Property.h
index aa71889..3daf28e 100644
--- a/logic/include/viewModel/utils/Property.h
+++ b/logic/include/viewModel/utils/Property.h
@@ -63,14 +63,14 @@
void NAME ## LeftHandle() { \
if(NAME ## Left()) \
{ \
- panel->rotate ## CAP_NAME(dialStepDec()); \
+ panel->rotate ## CAP_NAME(stepDec()); \
qDebug() << #NAME << "decresed"; \
} \
} \
void NAME ## RightHandle() { \
if(NAME ## Right()) \
{ \
- panel->rotate ## CAP_NAME(dialStepInc()); \
+ panel->rotate ## CAP_NAME(stepInc()); \
qDebug() << #NAME << "incresed"; \
} \
}
diff --git a/ui/const/Const.qml b/ui/const/Const.qml
index 26fa62e..7d9b77a 100755
--- a/ui/const/Const.qml
+++ b/ui/const/Const.qml
@@ -25,4 +25,11 @@ QtObject {
property var radiusLong: 44
property var radiusShort: 24
+ property var sliderWidth: 250
+ property var sliderHeight: 50
+ property var sliderThickness: 20
+
+ property var textWidth: 250
+ property var textHeight: 30
+
}
diff --git a/ui/emulator/Emulator.qml b/ui/emulator/Emulator.qml
index 743f53a..3e4cffb 100755
--- a/ui/emulator/Emulator.qml
+++ b/ui/emulator/Emulator.qml
@@ -1,7 +1,6 @@
import QtQuick 2.0
import QtGraphicalEffects 1.13
-import "qrc:/emulator/components"
import "qrc:/emulator/items"
import "qrc:/theme"
import "qrc:/const"
@@ -10,27 +9,15 @@ Item {
width: Const.windowWidth
height: Const.windowHeight
- NeuLight {
- x: 70
- y: 70
- colorMode: 0
- width: Const.microButton
- height: Const.microButton
- image: Theme.current=== Theme.dark ? "qrc:/icons/uiMode/light.svg" :
- "qrc:/icons/uiMode/dark.svg"
- MouseArea{
- anchors.fill: parent
- onClicked: {
- if(Theme.current=== Theme.dark) {
- Theme.current = Theme.light
- } else {
- Theme.current = Theme.dark
- }
- }
- }
+ Setting {
+ anchors.horizontalCenter: topLeft.horizontalCenter
+ anchors.top: topLeft.bottom
+ anchors.topMargin: 120
}
- TopLeft {}
+ TopLeft {
+ id: topLeft
+ }
TopRight {}
diff --git a/ui/emulator/components/LightRing.qml b/ui/emulator/components/LightRing.qml
index 4368ac1..be4c3a8 100644
--- a/ui/emulator/components/LightRing.qml
+++ b/ui/emulator/components/LightRing.qml
@@ -13,6 +13,8 @@ Item {
property var colorMode: 0 // 0->None; 1->White; 2->Green; 3->Yellow
property color lightColor: getColor()
property color lightDeep: getColorDeep()
+ property var timeFactor: 1
+ property bool indicator: false
width: Const.macroButton + 2 * thickness
height: Const.macroButton + 2 * thickness
@@ -91,6 +93,30 @@ Item {
}
}
+ Rectangle {
+ id: indic
+ width: thickness * 2
+ height: width
+ color: lightDeep
+ y: 0.5 * thickness
+ anchors.horizontalCenter: parent.horizontalCenter
+ visible: indicator
+
+ transform: Rotation {
+ angle: 45
+ origin {
+ x: indic.width / 2
+ y: indic.height / 2
+ }
+
+ axis {
+ z: 1
+ x: 0
+ y: 0
+ }
+ }
+ }
+
transform: Rotation {
origin {
x: borderGrad.width / 2
@@ -107,7 +133,7 @@ Item {
Behavior on angle {
NumberAnimation {
- duration: 200
+ duration: 200 * timeFactor
easing.type: Easing.OutQuad
}
}
@@ -115,7 +141,6 @@ Item {
}
}
-
DropShadow {
id: dropDown
anchors.fill: coloredRing
diff --git a/ui/emulator/components/ModeButton.qml b/ui/emulator/components/ModeButton.qml
index 875238a..b971fb3 100644
--- a/ui/emulator/components/ModeButton.qml
+++ b/ui/emulator/components/ModeButton.qml
@@ -15,12 +15,16 @@ ModeBg {
property var led: 1
+ property var stepInc
+ property var stepDec
+
LightRing {
id: lightRing
colorMode: parent.led
anchors.verticalCenter: mainKnob.verticalCenter
anchors.horizontalCenter: mainKnob.horizontalCenter
width: Const.macroButton + 2 * thickness
+ indicator: true
}
Knob {
@@ -38,7 +42,10 @@ ModeBg {
anchors.rightMargin: Const.margin
implicitWidth: Const.microButton
implicitHeight: Const.microButton
- onPressed: lightRing.angle = lightRing.angle - Const.rotateStep
+ onPressed: {
+ lightRing.timeFactor = - stepDec
+ lightRing.angle = lightRing.angle + Const.rotateStep * stepDec
+ }
}
Knob {
@@ -48,6 +55,9 @@ ModeBg {
anchors.leftMargin: Const.margin
implicitWidth: Const.microButton
implicitHeight: Const.microButton
- onPressed: lightRing.angle = lightRing.angle + Const.rotateStep
+ onPressed: {
+ lightRing.timeFactor = stepInc
+ lightRing.angle = lightRing.angle + Const.rotateStep * stepInc
+ }
}
}
diff --git a/ui/emulator/components/ModeOption.qml b/ui/emulator/components/ModeOption.qml
index e0ecbea..faa1f25 100644
--- a/ui/emulator/components/ModeOption.qml
+++ b/ui/emulator/components/ModeOption.qml
@@ -18,12 +18,16 @@ ModeBgOption {
property var led: 1
property var ledOption: 0
+ property var stepInc
+ property var stepDec
+
LightRing {
id: lightRing
colorMode: parent.led
anchors.verticalCenter: mainKnob.verticalCenter
anchors.horizontalCenter: mainKnob.horizontalCenter
width: Const.macroButton + 2 * thickness
+ indicator: true
}
Knob {
@@ -52,7 +56,10 @@ ModeBgOption {
anchors.rightMargin: Const.margin
implicitWidth: Const.microButton
implicitHeight: Const.microButton
- onPressed: lightRing.angle = lightRing.angle - Const.rotateStep
+ onPressed: {
+ lightRing.timeFactor = - stepDec
+ lightRing.angle = lightRing.angle + Const.rotateStep * stepDec
+ }
}
Knob {
@@ -62,6 +69,9 @@ ModeBgOption {
anchors.leftMargin: Const.margin
implicitWidth: Const.microButton
implicitHeight: Const.microButton
- onPressed: lightRing.angle = lightRing.angle + Const.rotateStep
+ onPressed: {
+ lightRing.timeFactor = stepInc
+ lightRing.angle = lightRing.angle + Const.rotateStep * stepInc
+ }
}
}
diff --git a/ui/emulator/components/SliderBar.qml b/ui/emulator/components/SliderBar.qml
new file mode 100644
index 0000000..b139100
--- /dev/null
+++ b/ui/emulator/components/SliderBar.qml
@@ -0,0 +1,219 @@
+import QtQuick 2.0
+import QtQuick.Controls 2.13
+import QtGraphicalEffects 1.13
+
+import "qrc:/theme"
+import "qrc:/const"
+
+Item {
+ id: main
+ property var color: Theme.current.green
+ property var colorDeep: Theme.current.greenDeep
+ property var sliderSize: Const.sliderHeight
+ property var backgroundLenght: Const.sliderWidth
+ property bool flip: false
+ property var value: control.value
+
+ implicitHeight: sliderSize
+ width: backgroundLenght
+
+ Slider {
+ id: control
+ width: (4 / 5) * parent.width
+ height: Const.sliderThickness
+ x: parent.width - width
+ y: 0
+
+ from: flip ? -1 : 1
+ to: flip ? -5 : 5
+ stepSize: 1
+ value: flip ? -1 : 1
+ snapMode: Slider.SnapOnRelease
+
+ transform: Rotation {
+ origin {
+ x: control.width / 2 - main.width / 10
+ y: control.height / 2
+ }
+
+ axis {
+ z: 0
+ x: 0
+ y: 1
+ }
+
+ angle: flip ? 180 : 0
+ }
+
+ background: Item {
+ id: controlBackground
+ width: main.width
+ height: parent.height
+ x: - parent.x
+
+ Item {
+ id: backgroundObject
+ width: parent.width
+ height: parent.height
+
+ Rectangle {
+ id: backgroundArea
+ width: parent.width
+ height: parent.height
+ radius: height / 2
+ color: "pink"
+ }
+
+ Item {
+ id: backgroundGrad
+ implicitWidth: parent.implicitWidth
+ implicitHeight: parent.implicitHeight
+ anchors.fill: parent
+
+ layer.enabled: true
+ layer.effect: OpacityMask {
+ maskSource: backgroundArea
+ }
+
+ Rectangle {
+ width: parent.width
+ height: parent.height
+ color: "transparent"
+
+ LinearGradient {
+ anchors.fill: parent
+ start: Qt.point(parent.width / 2 , parent.height)
+ end: Qt.point(0, 0)
+ gradient: Gradient {
+ GradientStop {
+ position: 0
+ color: Theme.current.none
+ }
+
+ GradientStop {
+ position: 1
+ color: Theme.current.noneDeep
+ }
+ }
+ }
+ }
+ }
+
+ Rectangle {
+ id: progressArea
+ width: (control.visualPosition * parent.width * 4 / 5) + (parent.width / 5)
+ height: parent.height
+ radius: height / 2
+ color: "pink"
+ }
+
+ Item {
+ id: progressGrad
+ anchors.fill: progressArea
+
+ layer.enabled: true
+ layer.effect: OpacityMask {
+ maskSource: progressArea
+ }
+
+ Rectangle {
+ width: parent.width
+ height: parent.height
+ color: "transparent"
+
+ LinearGradient {
+ anchors.fill: parent
+ start: Qt.point(parent.width / 2 , parent.height)
+ end: Qt.point(0, 0)
+ gradient: Gradient {
+ GradientStop {
+ position: 0
+ color: main.color
+ }
+
+ GradientStop {
+ position: 1
+ color: main.colorDeep
+ }
+ }
+ }
+ }
+ }
+ }
+
+ DropShadow {
+ id: dropDown
+ anchors.fill: backgroundObject
+ source: backgroundObject
+ horizontalOffset: 3
+ verticalOffset: 3
+ radius: 4
+ samples: 8
+ color: Theme.current.light
+ }
+
+ DropShadow {
+ id: dropUp
+ anchors.fill: backgroundObject
+ source: backgroundObject
+ horizontalOffset: - 3
+ verticalOffset: - 3
+ radius: 4
+ samples: 8
+ color: Theme.current.light
+ }
+
+ InnerShadow {
+ id: inner
+ anchors.fill: backgroundObject
+ source: backgroundObject
+ horizontalOffset: 3
+ verticalOffset: 3
+ radius: 3
+ samples: 6
+ smooth: true
+ color: Theme.current.lightShadow
+ }
+ }
+
+ handle: KnobImage {
+ id: knob
+ x: control.leftPadding + (control.visualPosition * control.availableWidth) - width / 2
+ y: control.topPadding + control.availableHeight / 2 - height / 2
+ implicitWidth: sliderSize
+ implicitHeight: sliderSize
+ radius: implicitHeight / 2
+
+ Item {
+ width: parent.width
+ height: parent.height
+ anchors.centerIn: knob
+
+ Text {
+ horizontalAlignment: Text.horizontalCenter
+ text: control.value
+ color: Theme.current.text
+ anchors.verticalCenter: parent.verticalCenter
+ anchors.horizontalCenter: parent.horizontalCenter
+ }
+
+ transform: Rotation {
+ origin {
+ x: knob.width / 2
+ y: knob.height / 2
+ }
+
+ axis {
+ z: 0
+ x: 0
+ y: 1
+ }
+
+ angle: flip ? 180 : 0
+ }
+ }
+ }
+ }
+}
+
+
diff --git a/ui/emulator/elements/ModeButtonBind.qml b/ui/emulator/elements/ModeButtonBind.qml
index 7ef31a6..a520298 100644
--- a/ui/emulator/elements/ModeButtonBind.qml
+++ b/ui/emulator/elements/ModeButtonBind.qml
@@ -14,6 +14,18 @@ ModeButton {
property var nameDecrease: ""
property var nameLed: ""
+ MvvmBinding {
+ viewModel: mainView.viewModel
+ viewProperty: "stepInc"
+ viewModelProperty: "stepInc"
+ }
+
+ MvvmBinding {
+ viewModel: mainView.viewModel
+ viewProperty: "stepDec"
+ viewModelProperty: "stepDec"
+ }
+
MvvmBinding {
viewModel: mainView.viewModel
viewProperty: "down"
diff --git a/ui/emulator/elements/ModeOptionBind.qml b/ui/emulator/elements/ModeOptionBind.qml
index 6056a85..5302511 100644
--- a/ui/emulator/elements/ModeOptionBind.qml
+++ b/ui/emulator/elements/ModeOptionBind.qml
@@ -17,9 +17,14 @@ ModeOption {
MvvmBinding {
viewModel: mainView.viewModel
- viewProperty: "down"
- viewModelProperty: name
- type: MvvmBinding.OneWayToViewModel
+ viewProperty: "stepInc"
+ viewModelProperty: "stepInc"
+ }
+
+ MvvmBinding {
+ viewModel: mainView.viewModel
+ viewProperty: "stepDec"
+ viewModelProperty: "stepDec"
}
MvvmBinding {
diff --git a/ui/emulator/elements/SliderBarBind.qml b/ui/emulator/elements/SliderBarBind.qml
new file mode 100644
index 0000000..885f02a
--- /dev/null
+++ b/ui/emulator/elements/SliderBarBind.qml
@@ -0,0 +1,18 @@
+import QtQuick 2.0
+
+import de.skycoder42.QtMvvm.Core 1.0
+import de.skycoder42.QtMvvm.Quick 1.0
+import com.example.consoleemulator 1.0
+
+import "qrc:/qtmvvm/views"
+import "qrc:/const"
+import "qrc:/emulator/components"
+
+SliderBar {
+ property var name: ""
+ MvvmBinding {
+ viewModel: mainView.viewModel
+ viewProperty: "value"
+ viewModelProperty: name
+ }
+}
diff --git a/ui/emulator/items/Setting.qml b/ui/emulator/items/Setting.qml
new file mode 100644
index 0000000..17a20fb
--- /dev/null
+++ b/ui/emulator/items/Setting.qml
@@ -0,0 +1,85 @@
+import QtQuick 2.0
+
+import "qrc:/emulator/components"
+import "qrc:/emulator/elements"
+import "qrc:/const"
+import "qrc:/theme"
+
+Item {
+ width: childrenRect.width
+ height: childrenRect.height
+
+ Column {
+ spacing: 15
+
+ Item {
+ width: Const.textWidth
+ implicitHeight: Const.textHeight
+
+ Text {
+ horizontalAlignment: Text.horizontalCenter
+ text: "Incremental step"
+ color: Theme.current.text
+ anchors.verticalCenter: parent.verticalCenter
+ }
+ }
+
+ SliderBarBind {
+ name: "stepInc"
+ }
+
+ Item {
+ width: Const.textWidth
+ implicitHeight: Const.textHeight
+
+ Text {
+ horizontalAlignment: Text.horizontalCenter
+ text: "Decremental step"
+ color: Theme.current.text
+ }
+ }
+
+ SliderBarBind {
+ name: "stepDec"
+ color: Theme.current.yellow
+ colorDeep: Theme.current.yellowDeep
+ flip: true
+ }
+
+ Row {
+ width: Const.sliderWidth
+ height: Const.sliderHeight
+
+ Item {
+ width: Const.textWidth / 3
+ height: Const.textHeight
+ anchors.verticalCenter: parent.verticalCenter
+ Text {
+ anchors.verticalCenter: parent.verticalCenter
+ horizontalAlignment: Text.horizontalCenter
+ text: "Theme"
+ color: Theme.current.text
+ }
+ }
+
+ NeuLight {
+ anchors.verticalCenter: parent.verticalCenter
+ colorMode: 0
+ width: Const.microButton
+ height: Const.microButton
+ image: Theme.current=== Theme.dark ? "qrc:/icons/uiMode/light.svg" :
+ "qrc:/icons/uiMode/dark.svg"
+ MouseArea{
+ anchors.fill: parent
+ onClicked: {
+ if(Theme.current=== Theme.dark) {
+ Theme.current = Theme.light
+ } else {
+ Theme.current = Theme.dark
+ }
+ }
+ }
+ }
+ }
+ }
+}
diff --git a/ui/emulator/items/TopLeft.qml b/ui/emulator/items/TopLeft.qml
index ece252a..6afa1e1 100755
--- a/ui/emulator/items/TopLeft.qml
+++ b/ui/emulator/items/TopLeft.qml
@@ -7,7 +7,7 @@ import "qrc:/const"
GridLayout {
id: topLeft
x: 70
- y: 200
+ y: 120
rows: 3
columns: 4
rowSpacing: 36
diff --git a/ui/theme/Palette.qml b/ui/theme/Palette.qml
index 7ad75b5..3eeb0a1 100755
--- a/ui/theme/Palette.qml
+++ b/ui/theme/Palette.qml
@@ -25,7 +25,7 @@ QtObject {
property color white: isDarkTheme ? "#FFFFFF" : "#FFFFFF"
property color whiteGlow: isDarkTheme ? "#F1F5FA" : "#F1F5FA"
- property color whiteDeep: isDarkTheme ? "#A9CFFF" : "#A9CFFF"
+ property color whiteDeep: isDarkTheme ? "#A4C5EF" : "#A4C5EF"
property color green: isDarkTheme ? "#95CF6C" : "#95CF6C"
property color greenGlow: isDarkTheme ? "#B8E49B" : "#B8E49B"
diff --git a/ui/ui.qrc b/ui/ui.qrc
index fcc2d9a..b0f1949 100644
--- a/ui/ui.qrc
+++ b/ui/ui.qrc
@@ -92,6 +92,9 @@
<file>theme/Palette.qml</file>
<file>theme/qmldir</file>
<file>theme/Theme.qml</file>
+ <file>emulator/components/SliderBar.qml</file>
+ <file>emulator/elements/SliderBarBind.qml</file>
+ <file>emulator/items/Setting.qml</file>
</qresource>
<qresource prefix="/qtmvvm/views">
<file>MainView.qml</file>