From a03e4e3dc7d3c892ff39479d06cf222b682e2035 Mon Sep 17 00:00:00 2001 From: Slava Monich Date: Fri, 23 Oct 2020 01:21:24 +0300 Subject: [PATCH] [app] Added UI to configure night mode brightnesss --- app/app.pro | 6 ++ app/qml/Books.js | 2 +- app/settings/BooksSettings.qml | 93 ++++++++++++++++++++++++- app/settings/images/brightness.svg | 68 ++++++++++++++++++ app/translations/harbour-books-de.ts | 10 +++ app/translations/harbour-books-es.ts | 10 +++ app/translations/harbour-books-fi.ts | 10 +++ app/translations/harbour-books-hu.ts | 10 +++ app/translations/harbour-books-nl.ts | 10 +++ app/translations/harbour-books-pl.ts | 10 +++ app/translations/harbour-books-pt.ts | 10 +++ app/translations/harbour-books-ru.ts | 10 +++ app/translations/harbour-books-sv.ts | 10 +++ app/translations/harbour-books-zh_CN.ts | 10 +++ app/translations/harbour-books.ts | 10 +++ 15 files changed, 277 insertions(+), 2 deletions(-) create mode 100644 app/settings/images/brightness.svg diff --git a/app/app.pro b/app/app.pro index d8641f5..47181ed 100644 --- a/app/app.pro +++ b/app/app.pro @@ -57,6 +57,7 @@ OTHER_FILES += \ qml/images/* \ settings/*.qml \ settings/*.json \ + settings/images/* \ data/default/* \ data/zlibrary/core/encodings/* \ data/zlibrary/core/resources/* @@ -203,6 +204,7 @@ SOURCES += \ HARBOUR_QML_COMPONENTS = \ $$HARBOUR_LIB_QML/HarbourFitLabel.qml \ + $$HARBOUR_LIB_QML/HarbourHighlightIcon.qml \ $$HARBOUR_LIB_QML/HarbourHorizontalSwipeHint.qml OTHER_FILES += $${HARBOUR_QML_COMPONENTS} @@ -240,6 +242,10 @@ settings_qml.files = settings/*.qml settings_qml.path = /usr/share/$${TARGET}/settings/ INSTALLS += settings_qml +settings_images.files = settings/images/*.svg +settings_images.path = /usr/share/$${TARGET}/settings/images/ +INSTALLS += settings_images + # Desktop file equals(PREFIX, "openrepos") { desktop.extra = sed s/harbour/openrepos/g harbour-$${NAME}.desktop > $${TARGET}.desktop diff --git a/app/qml/Books.js b/app/qml/Books.js index c59d146..30c90a7 100644 --- a/app/qml/Books.js +++ b/app/qml/Books.js @@ -1,5 +1,5 @@ .pragma library function contentOpacity(brightness) { - return 0.5 + brightness * 0.5 + return 0.4 + brightness * 0.6 } diff --git a/app/settings/BooksSettings.qml b/app/settings/BooksSettings.qml index 6ae4ec0..53a41fa 100644 --- a/app/settings/BooksSettings.qml +++ b/app/settings/BooksSettings.qml @@ -35,11 +35,15 @@ import QtQuick 2.0 import Sailfish.Silica 1.0 import org.nemomobile.configuration 1.0 +import "../qml/Books.js" as Books +import "../qml/harbour" + Page { id: page property bool followOrientationChanges property alias title: pageHeader.title readonly property string rootPath: "/apps/" + appName() + "/" + readonly property bool darkOnLight: ('colorScheme' in Theme) && Theme.colorScheme === 1 // Deduce package name from the path function appName() { @@ -68,6 +72,44 @@ Page { anchors.fill: parent contentHeight: content.height + // Night mode example (positioned right above the slider) + Rectangle { + opacity: nightModeBrightnessSlider.pressed ? 1.0 : 0 + visible: opacity > 0 + radius: Theme.paddingSmall + width: nightModeExampleLabel.width + 2 * Theme.paddingLarge + height: nightModeExampleLabel.height + 2 * Theme.paddingMedium + readonly property int xMin: nightModeBrightnessSlider.leftMargin + readonly property int xMax: content.width - nightModeBrightnessSlider.rightMargin - width + x: content.x + Math.max(Math.min(nightModeBrightnessSlider.sliderLeft + Math.round(nightModeBrightnessSlider.sliderThumbX - width/2.0), xMax), xMin) + y: content.y + nightModeBrightnessSlider.y - height + z: nightModeBrightnessSlider.z + 1 + color: "black" + border { + color: Theme.highlightColor + width: Math.ceil(radius/5) + } + + Label { + id: nightModeExampleLabel + + anchors.centerIn: parent + color: "white" + opacity: Books.contentOpacity(nightModeBrightness.value) + //: Night mode example label + //% "Night mode" + text: qsTrId("harbour-books-settings-page-night_mode_example") + font { + bold: true + pixelSize: Theme.fontSizeLarge + family: "Times" + } + } + + Behavior on x { SmoothedAnimation { duration: 125 } } + Behavior on opacity { FadeAnimation { duration: 500 } } + } + Column { id: content width: parent.width @@ -99,7 +141,7 @@ Page { //% "Font size" label: qsTrId("harbour-books-settings-page-font_size_label") valueText: (value === 0) ? normal : ((value > 0) ? ("+" + value) : value) - width: page.width + width: parent.width anchors.horizontalCenter: parent.horizontalCenter onSliderValueChanged: fontSize.value = value Component.onCompleted: value = fontSize.value @@ -112,6 +154,55 @@ Page { } } + Slider { + id: nightModeBrightnessSlider + width: parent.width + //: Slider label + //% "Night mode brightness" + label: qsTrId("harbour-books-settings-page-night_mode_brightness_label") + stepSize: (maximumValue - minimumValue) / 100.0 + anchors.horizontalCenter: parent.horizontalCenter + onSliderValueChanged: nightModeBrightness.value = value + value: nightModeBrightness.value + + readonly property real sliderLeft: x + leftMargin + readonly property real sliderRight: x + width - rightMargin + readonly property real sliderWidth: width - leftMargin - rightMargin + readonly property real sliderThumbX: sliderLeft + (maximumValue > minimumValue) ? (sliderWidth * sliderValue / (maximumValue - minimumValue)) : 0 + readonly property real sliderBarVerticalCenter: Math.round(height - Theme.fontSizeSmall - Theme.paddingSmall - Theme.itemSizeExtraSmall*3/8) + readonly property color highlightColor: highlighted ? Theme.secondaryHighlightColor : Theme.secondaryColor + + ConfigurationValue { + id: nightModeBrightness + key: rootPath + "nightModeBrightness" + defaultValue: 1 + } + + HarbourHighlightIcon { + source: "images/brightness.svg" + y: nightModeBrightnessSlider.sliderBarVerticalCenter - Math.round(height/2) + anchors { + left: parent.left + leftMargin: nightModeBrightnessSlider.leftMargin - Theme.paddingSmall - width + } + sourceSize.height: Math.round(Theme.iconSizeSmall * 0.8) + highlightColor: nightModeBrightnessSlider.highlightColor + opacity: (darkOnLight && !nightModeBrightnessSlider.highlighted) ? 0.6 : 1.0 + } + + HarbourHighlightIcon { + source: "images/brightness.svg" + y: nightModeBrightnessSlider.sliderBarVerticalCenter - Math.round(height/2) + anchors { + right: parent.right + rightMargin: nightModeBrightnessSlider.rightMargin - Theme.paddingSmall - width + } + sourceSize.height: Math.round(Theme.iconSizeSmall * 1.2) + highlightColor: nightModeBrightnessSlider.highlightColor + opacity: (darkOnLight && !nightModeBrightnessSlider.highlighted) ? 0.6 : 1.0 + } + } + ComboBox { id: orientationComboBox //: Combo box label diff --git a/app/settings/images/brightness.svg b/app/settings/images/brightness.svg new file mode 100644 index 0000000..c2cd8e6 --- /dev/null +++ b/app/settings/images/brightness.svg @@ -0,0 +1,68 @@ + + + + + + + + + + + + + + + + + + + diff --git a/app/translations/harbour-books-de.ts b/app/translations/harbour-books-de.ts index 641e9d8..bcbbad1 100644 --- a/app/translations/harbour-books-de.ts +++ b/app/translations/harbour-books-de.ts @@ -144,6 +144,16 @@ Slider value label for the standard font size Standard + + Night mode + Night mode example label + Nacht-Modus + + + Night mode brightness + Slider label + Helligkeit im Nacht-Modus + Orientation Combo box label diff --git a/app/translations/harbour-books-es.ts b/app/translations/harbour-books-es.ts index f300edc..da7c885 100644 --- a/app/translations/harbour-books-es.ts +++ b/app/translations/harbour-books-es.ts @@ -144,6 +144,16 @@ Slider value label for the standard font size Por defecto + + Night mode + Night mode example label + Modo nocturno + + + Night mode brightness + Slider label + Brillo en modo nocturno + Orientation Combo box label diff --git a/app/translations/harbour-books-fi.ts b/app/translations/harbour-books-fi.ts index d581f74..81e0b84 100644 --- a/app/translations/harbour-books-fi.ts +++ b/app/translations/harbour-books-fi.ts @@ -144,6 +144,16 @@ Slider value label for the standard font size Oletus + + Night mode + Night mode example label + Yötila + + + Night mode brightness + Slider label + Kirkkaus yötilassa + Orientation Combo box label diff --git a/app/translations/harbour-books-hu.ts b/app/translations/harbour-books-hu.ts index 95a5fb3..4d43837 100644 --- a/app/translations/harbour-books-hu.ts +++ b/app/translations/harbour-books-hu.ts @@ -142,6 +142,16 @@ Slider value label for the standard font size Alapértelmezett + + Night mode + Night mode example label + Éjszakai mód + + + Night mode brightness + Slider label + Fényerő éjszakai üzemmódban + Orientation Combo box label diff --git a/app/translations/harbour-books-nl.ts b/app/translations/harbour-books-nl.ts index 728da71..a2ed311 100644 --- a/app/translations/harbour-books-nl.ts +++ b/app/translations/harbour-books-nl.ts @@ -144,6 +144,16 @@ Slider value label for the standard font size Standaard + + Night mode + Night mode example label + Nachtstand + + + Night mode brightness + Slider label + Helderheid in nachtstand + Orientation Combo box label diff --git a/app/translations/harbour-books-pl.ts b/app/translations/harbour-books-pl.ts index 4f9231d..ce632d8 100644 --- a/app/translations/harbour-books-pl.ts +++ b/app/translations/harbour-books-pl.ts @@ -146,6 +146,16 @@ Slider value label for the standard font size Domyślny + + Night mode + Night mode example label + Tryb nocny + + + Night mode brightness + Slider label + Jasność w trybie nocnym + Orientation Combo box label diff --git a/app/translations/harbour-books-pt.ts b/app/translations/harbour-books-pt.ts index ef52169..16db903 100644 --- a/app/translations/harbour-books-pt.ts +++ b/app/translations/harbour-books-pt.ts @@ -144,6 +144,16 @@ Slider value label for the standard font size Padrão + + Night mode + Night mode example label + Modo noturno + + + Night mode brightness + Slider label + Brilho no modo noturno + Orientation Combo box label diff --git a/app/translations/harbour-books-ru.ts b/app/translations/harbour-books-ru.ts index d051424..39f6969 100644 --- a/app/translations/harbour-books-ru.ts +++ b/app/translations/harbour-books-ru.ts @@ -146,6 +146,16 @@ Slider value label for the standard font size Стандартный + + Night mode + Night mode example label + Ночной режим + + + Night mode brightness + Slider label + Яркость в ночном режиме + Orientation Combo box label diff --git a/app/translations/harbour-books-sv.ts b/app/translations/harbour-books-sv.ts index ce6e212..16a2df7 100644 --- a/app/translations/harbour-books-sv.ts +++ b/app/translations/harbour-books-sv.ts @@ -144,6 +144,16 @@ Slider value label for the standard font size Standard + + Night mode + Night mode example label + Nattläge + + + Night mode brightness + Slider label + Ljusstyrka i nattläge + Orientation Combo box label diff --git a/app/translations/harbour-books-zh_CN.ts b/app/translations/harbour-books-zh_CN.ts index 3fe2613..e5ee880 100644 --- a/app/translations/harbour-books-zh_CN.ts +++ b/app/translations/harbour-books-zh_CN.ts @@ -142,6 +142,16 @@ Slider value label for the standard font size 默认 + + Night mode + Night mode example label + 夜间模式 + + + Night mode brightness + Slider label + 夜间模式下的亮度 + Orientation Combo box label diff --git a/app/translations/harbour-books.ts b/app/translations/harbour-books.ts index 339f0d8..bfc803f 100644 --- a/app/translations/harbour-books.ts +++ b/app/translations/harbour-books.ts @@ -144,6 +144,16 @@ Slider value label for the standard font size Default + + Night mode + Night mode example label + Night mode + + + Night mode brightness + Slider label + Night mode brightness + Orientation Combo box label