diff --git a/example/main.qml b/example/main.qml index 889320b..a2b7385 100644 --- a/example/main.qml +++ b/example/main.qml @@ -13,7 +13,8 @@ UI.App { property string primary: Material.primary property string accent: Material.accent - property bool theme: false + property bool theme: Material.theme === Material.Dark + property string themeStyle: "System" initialPage: UI.AppStackPage { id: homePage @@ -193,10 +194,10 @@ UI.App { text: "Display" } - UI.SettingsCheckItem { - title: "Dark Theme" - checkState: root.theme ? Qt.Checked : Qt.Unchecked - onClicked: root.theme = !root.theme + UI.SettingsItem { + title: "Theme" + subtitle: root.themeStyle + onClicked: themeDialog.open() Layout.fillWidth: true } @@ -217,6 +218,14 @@ UI.App { colorDialog.open() } } + + UI.SettingsCheckItem { + title: "Tool bar primary color" + subtitle: "Use the primary color for the tool bar background" + checkState: UI.Style.toolBarPrimary ? Qt.Checked : Qt.Unchecked + onClicked: UI.Style.toolBarPrimary = !UI.Style.toolBarPrimary + Layout.fillWidth: true + } } } } @@ -281,6 +290,32 @@ UI.App { text: "Information message." } + UI.OptionsDialog { + id: themeDialog + + title: "Choose theme style" + model: [ + { name: "Dark", style: Material.Dark }, + { name: "Light", style: Material.Light }, + { name: "System", style: Material.System } + ] + delegate: RowLayout { + spacing: 0 + + RadioButton { + checked: modelData.name === root.themeStyle + text: modelData.name + Layout.leftMargin: 4 + onClicked: { + themeDialog.close() + root.themeStyle = modelData.name + UI.Style.theme = modelData.style + root.theme = root.Material.theme === Material.Dark + } + } + } + } + UI.OptionsDialog { id: colorDialog @@ -293,7 +328,7 @@ UI.App { return filtered.length ? filtered[0].name : "" } - title: selectAccentColor ? qsTr("Choose accent color") : qsTr("Choose primary color") + title: selectAccentColor ? "Choose accent color" : "Choose primary color" model: [ { name: "Material Red", bg: Material.Red }, { name: "Material Pink", bg: Material.Pink }, diff --git a/include/BaseUI/core.h b/include/BaseUI/core.h index 48e279f..005d78b 100644 --- a/include/BaseUI/core.h +++ b/include/BaseUI/core.h @@ -5,7 +5,9 @@ class QQmlEngine; namespace BaseUI { - void init(QQmlEngine *engine); + +void init(QQmlEngine *engine); + } #endif diff --git a/qml/App.qml b/qml/App.qml index f715b60..dd25434 100644 --- a/qml/App.qml +++ b/qml/App.qml @@ -23,5 +23,5 @@ ApplicationWindow { Material.primary: Style.primaryColor Material.accent: Style.accentColor - Material.theme: Style.isDarkTheme ? Material.Dark : Material.Light + Material.theme: Style.theme } diff --git a/qml/AppToolBar.qml b/qml/AppToolBar.qml index 48332d0..49bd7d9 100644 --- a/qml/AppToolBar.qml +++ b/qml/AppToolBar.qml @@ -1,6 +1,7 @@ import QtQuick import QtQuick.Layouts import QtQuick.Controls +import QtQuick.Controls.Material ToolBar { id: root @@ -10,6 +11,8 @@ ToolBar { property alias title: titleLabel.text + Material.background: Style.toolBarBackground + RowLayout { focus: false spacing: 0 @@ -17,7 +20,7 @@ ToolBar { ToolButton { icon.source: root.leftButton?.icon.source ?? "" - icon.color: Style.textOnPrimary + icon.color: Style.toolBarForeground focusPolicy: Qt.NoFocus opacity: Style.opacityTitle enabled: root.leftButton && root.leftButton.enabled @@ -26,14 +29,14 @@ ToolBar { LabelTitle { id: titleLabel elide: Label.ElideRight - color: Style.textOnPrimary + color: Style.toolBarForeground Layout.fillWidth: true } Repeater { model: root.rightButtons.length delegate: ToolButton { icon.source: root.rightButtons[index].icon.source - icon.color: Style.textOnPrimary + icon.color: Style.toolBarForeground focusPolicy: Qt.NoFocus opacity: Style.opacityTitle enabled: root.rightButtons[index].enabled diff --git a/qml/Style.qml b/qml/Style.qml index 40c0167..da7b39f 100644 --- a/qml/Style.qml +++ b/qml/Style.qml @@ -5,6 +5,8 @@ import QtQuick.Controls.Material QtObject { property bool isDarkTheme: false + property int theme: Material.System + property bool toolBarPrimary: true property color primaryColor: Material.color(Material.BlueGrey) property color accentColor: Material.color(Material.Orange) @@ -23,6 +25,8 @@ QtObject { property color popupTextColor: isDarkTheme ? "#FFFFFF" : "#424242" property color toastColor: isDarkTheme ? "Darkgrey" : "#323232" property real toastOpacity: isDarkTheme ? 0.9 : 0.75 + property color toolBarForeground: toolBarPrimary ? textOnPrimary : (isDarkTheme ? "#FFFFFF" : "#000000") + property color toolBarBackground: toolBarPrimary ? primaryColor : (isDarkTheme ? "#1C1B1F" : "#FFFBFE") // font sizes - defaults from Google Material Design Guide property int fontSizeDisplay4: 112 diff --git a/qml/TimeCircle.qml b/qml/TimeCircle.qml index e5c1b07..85c2a48 100644 --- a/qml/TimeCircle.qml +++ b/qml/TimeCircle.qml @@ -72,6 +72,11 @@ Item { toMiddleTime = Math.abs(minAngle - handToAnimation.to) / 180 * 400 fromMiddleTime = Math.abs(hourAngle - handFromAnimation.from) / 180 * 400 } + var animTime = toMiddleTime + fromMiddleTime + if (animTime > 0 && animTime < 200) { + toMiddleTime = toMiddleTime / animTime * 200 + fromMiddleTime = fromMiddleTime / animTime * 200 + } handToAnimation.duration = circleToAnimation.duration = toMiddleTime handFromAnimation.duration = circleFromAnimation.duration = fromMiddleTime @@ -191,7 +196,7 @@ Item { height: width radius: width / 2 anchors.centerIn: parent - visible: root.pickMinutes && root.minutes % 5 + visible: root.pickMinutes && !animation.running && root.minutes % 5 color: root.labelDotColor } diff --git a/src/core.cpp b/src/core.cpp index 73bf2e5..dd7e5fa 100644 --- a/src/core.cpp +++ b/src/core.cpp @@ -11,7 +11,7 @@ namespace BaseUI void init(QQmlEngine *engine) { QQuickStyle::setStyle("Material"); - Icons::instance = std::make_unique(); + Icons::instance = new Icons(static_cast(engine)); #ifdef BASEUI_INCLUDE_ICONS QString path = ":/baseui/imports/BaseUI/icons/"; BaseUI::Icons::registerIcons(engine, path + "MaterialIcons-Regular.ttf", diff --git a/src/icons.h b/src/icons.h index 5a47af7..1435c70 100644 --- a/src/icons.h +++ b/src/icons.h @@ -4,8 +4,6 @@ #include #include -#include - namespace BaseUI { @@ -16,7 +14,7 @@ class Icons : public QQmlPropertyMap public: Icons(QObject *parent = nullptr); - inline static std::unique_ptr instance; + inline static Icons *instance; static void registerIcons(QQmlEngine *engine, const QString &fontPath, const QString &fontName, const QVariantMap &codes); @@ -52,7 +50,7 @@ public: else s_engine = engine; - return Icons::instance.get(); + return Icons::instance; } private: