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