diff --git a/ui/StatusQ/sandbox/ThemeSwitch.qml b/ui/StatusQ/sandbox/ThemeSwitch.qml index 970d00ba1a..51b8f1f123 100644 --- a/ui/StatusQ/sandbox/ThemeSwitch.qml +++ b/ui/StatusQ/sandbox/ThemeSwitch.qml @@ -7,6 +7,8 @@ Item { id: themeSwitchWrapper signal checkedChanged() + property alias lightThemeEnabled: switchControl.checked + width: themeSwitch.width height: themeSwitch.height @@ -26,6 +28,7 @@ Item { } StatusSwitch { + id: switchControl onCheckedChanged: themeSwitchWrapper.checkedChanged() StatusToolTip { diff --git a/ui/StatusQ/sandbox/demoapp/data/logo-test-image.png b/ui/StatusQ/sandbox/demoapp/data/logo-test-image.png new file mode 100644 index 0000000000..0d5bff5d19 Binary files /dev/null and b/ui/StatusQ/sandbox/demoapp/data/logo-test-image.png differ diff --git a/ui/StatusQ/sandbox/main.cpp b/ui/StatusQ/sandbox/main.cpp index 10d731a2d4..15eff32c0d 100644 --- a/ui/StatusQ/sandbox/main.cpp +++ b/ui/StatusQ/sandbox/main.cpp @@ -11,6 +11,11 @@ int main(int argc, char *argv[]) #endif SandboxApp app(argc, argv); + + app.setOrganizationName("Status"); + app.setOrganizationDomain("status.im"); + app.setApplicationName("Sandbox"); + app.startEngine(); return app.exec(); diff --git a/ui/StatusQ/sandbox/main.qml b/ui/StatusQ/sandbox/main.qml index 0e75f1f731..209055a53c 100644 --- a/ui/StatusQ/sandbox/main.qml +++ b/ui/StatusQ/sandbox/main.qml @@ -2,6 +2,8 @@ import QtQuick 2.14 import QtQuick.Window 2.14 import QtQuick.Controls 2.14 import QtGraphicalEffects 1.13 +import QtQuick.Layouts 1.14 +import Qt.labs.settings 1.0 import Sandbox 0.1 @@ -31,10 +33,7 @@ StatusWindow { property real factor: 1.0 - Component.onCompleted: { - Theme.palette = lightTheme - rootWindow.updatePosition(); - } + Component.onCompleted: rootWindow.updatePosition() QtObject { id: appSectionType @@ -110,12 +109,10 @@ StatusWindow { anchors.topMargin: 32 anchors.right: parent.right anchors.rightMargin: 32 - onCheckedChanged: { - if (Theme.palette === rootWindow.lightTheme) { - Theme.palette = rootWindow.darkTheme - } else { - Theme.palette = rootWindow.lightTheme - } + lightThemeEnabled: storeSettings.lightTheme + onLightThemeEnabledChanged: { + Theme.palette = lightThemeEnabled ? rootWindow.darkTheme : rootWindow.lightTheme + storeSettings.lightTheme = lightThemeEnabled } } } @@ -126,11 +123,13 @@ StatusWindow { StatusAppTwoPanelLayout { id: mainPageView - function page(name) { + function page(name, fillPage) { + storeSettings.fillPage = fillPage ? true : false viewLoader.source = Qt.resolvedUrl("./pages/" + name + "Page.qml"); } function control(name) { viewLoader.source = Qt.resolvedUrl("./controls/" + name + ".qml"); + storeSettings.fillPage = false } leftPanel: Item { @@ -303,6 +302,11 @@ StatusWindow { selected: viewLoader.source.toString().includes(title) onClicked: mainPageView.page(title); } + StatusNavigationListItem { + title: "StatusImageCropPanel" + selected: viewLoader.source.toString().includes(title) + onClicked: mainPageView.page(title, true); + } } } } @@ -310,8 +314,11 @@ StatusWindow { rightPanel: Item { id: rightPanel anchors.fill: parent + ScrollView { + visible: !storeSettings.fillPage anchors.fill: parent + anchors.topMargin: 64 contentHeight: (pageWrapper.height + pageWrapper.anchors.topMargin) * rootWindow.factor contentWidth: (pageWrapper.width * rootWindow.factor) clip: true @@ -320,14 +327,16 @@ StatusWindow { id: pageWrapper width: rightPanel.width anchors.top: parent.top - anchors.topMargin: 64 height: Math.max(rootWindow.height, viewLoader.height + 128) scale: rootWindow.factor + Loader { id: viewLoader + active: !storeSettings.fillPage anchors.centerIn: parent - source: mainPageView.control("Icons") + source: storeSettings.selected.length === 0 ? mainPageView.control("Icons") : storeSettings.selected onSourceChanged: { + storeSettings.selected = viewLoader.source if (source.toString().includes("Icons")) { item.iconColor = Theme.palette.primaryColor1; } @@ -335,6 +344,15 @@ StatusWindow { } } } + Loader { + active: storeSettings.fillPage + anchors.fill: parent + anchors.topMargin: 64 + visible: storeSettings.fillPage + clip: true + + source: viewLoader.source + } } } } @@ -452,4 +470,11 @@ StatusWindow { rootWindow.toggleFullScreen() } } + + Settings { + id: storeSettings + property string selected: "" + property bool lightTheme: true + property bool fillPage: false + } } diff --git a/ui/StatusQ/sandbox/pages/StatusImageCropPanelPage.qml b/ui/StatusQ/sandbox/pages/StatusImageCropPanelPage.qml new file mode 100644 index 0000000000..eaeeeb0078 --- /dev/null +++ b/ui/StatusQ/sandbox/pages/StatusImageCropPanelPage.qml @@ -0,0 +1,94 @@ +import QtQuick 2.14 +import QtQuick.Layouts 1.14 + +import StatusQ.Controls 0.1 +import StatusQ.Components 0.1 + +import QtGraphicalEffects 1.14 + +Item { + id: root + + implicitWidth: mainLayout.implicitWidth + implicitHeight: mainLayout.implicitHeight + + property var testControls: [ctrl1, ctrl2, ctrl3] + + property bool globalStylePreferRound: true + + ColumnLayout { + id: mainLayout + + anchors.fill: parent + + RowLayout { + ColumnLayout { + Text { + text: `AR: ${ctrl1.aspectRatio.toFixed(2)}` + } + + StatusImageCropPanel { + id: ctrl1 + Layout.fillWidth: true + Layout.fillHeight: true + + source: "qrc:/demoapp/data/logo-test-image.png" + windowStyle: globalStylePreferRound ? StatusImageCrop.WindowStyle.Rounded : StatusImageCrop.WindowStyle.Rectangular + } + Text { + text: `AR: ${ctrl2.aspectRatio.toFixed(2)}` + } + StatusImageCropPanel { + id: ctrl2 + Layout.fillWidth: true + Layout.fillHeight: true + + source: "qrc:/demoapp/data/logo-test-image.png" + windowStyle: globalStylePreferRound ? StatusImageCrop.WindowStyle.Rectangular : StatusImageCrop.WindowStyle.Rounded + aspectRatio: 16/9 + enableCheckers: true + } + } + ColumnLayout { + Text { + text: `AR: ${ctrl3.aspectRatio.toFixed(2)}` + } + StatusImageCropPanel { + id: ctrl3 + + Layout.fillWidth: true + Layout.fillHeight: true + + source: "qrc:/demoapp/data/logo-test-image.png" + windowStyle: globalStylePreferRound ? StatusImageCrop.WindowStyle.Rounded : StatusImageCrop.WindowStyle.Rectangular + aspectRatio: 0.8 + } + } + } + + Shortcut { + sequence: StandardKey.ZoomIn + onActivated: { + for(let i in testControls) { + const c = testControls[i] + c.setCropRect(ctrl1.inflateRectBy(c.cropRect, -0.05)) + } + } + } + + Shortcut { + sequence: StandardKey.ZoomOut + onActivated: { + for(let i in testControls) { + const c = testControls[i] + c.setCropRect(ctrl1.inflateRectBy(c.cropRect, 0.05)) + } + } + } + + Shortcut { + sequences: ["Ctrl+W"] + onActivated: globalStylePreferRound = !globalStylePreferRound + } + } +} diff --git a/ui/StatusQ/sandbox/qml.qrc b/ui/StatusQ/sandbox/qml.qrc index 9caae57786..c2cd1feb9c 100644 --- a/ui/StatusQ/sandbox/qml.qrc +++ b/ui/StatusQ/sandbox/qml.qrc @@ -33,6 +33,7 @@ demoapp/StatusAppProfileSettingsView.qml demoapp/data/Models.qml demoapp/data/qmldir + demoapp/data/logo-test-image.png DemoApp.qml ThemeSwitch.qml pages/StatusColorSelectorGridPage.qml