From 0e6012d3860fc774fd1d7535817a4fcb2cb80dac Mon Sep 17 00:00:00 2001 From: Alex Spataru Date: Mon, 2 Nov 2015 16:58:02 -0600 Subject: [PATCH 1/2] Fix issues on mobile/touch devices Touch devices do not interact very well with the "hover" property of the mouse area. This causes the widgets that use this object to get "stuck" with the color used when the item is clicked, even if the user is not touching/clicking the widget. To fix this, we simply disable the hover feature when running on a mobile device. --- modules/Material/Ink.qml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/modules/Material/Ink.qml b/modules/Material/Ink.qml index dcb7fae6..92156b70 100644 --- a/modules/Material/Ink.qml +++ b/modules/Material/Ink.qml @@ -30,7 +30,7 @@ MouseArea { id: view clip: true - hoverEnabled: enabled + hoverEnabled: !Device.isMobile z: 2 property int startRadius: circular ? width/10 : width/6 From 696fdbfed02f3bbcd35136dcd32014ddc6fe77c3 Mon Sep 17 00:00:00 2001 From: Alex Spataru Date: Mon, 2 Nov 2015 17:11:00 -0600 Subject: [PATCH 2/2] Fit window to screen in mobile devices We show the application maximized on a mobile device, and we ensure it resizes to screen size by setting size to (0,0) On desktop devices, the behavior of the application will be exactly as the "previous" behavior. Tested on Android 4.2.2 and Windows 10 --- modules/Material/ApplicationWindow.qml | 18 ++++++++++++++++-- 1 file changed, 16 insertions(+), 2 deletions(-) diff --git a/modules/Material/ApplicationWindow.qml b/modules/Material/ApplicationWindow.qml index 415db400..7b1c0c45 100644 --- a/modules/Material/ApplicationWindow.qml +++ b/modules/Material/ApplicationWindow.qml @@ -121,8 +121,11 @@ Controls.ApplicationWindow { id: overlayLayer } - width: Units.dp(800) - height: Units.dp(600) + // Trust me, this is for the greater good + // The behavior on the desktop will remain unmodified, while + // the application will be resized automatically on mobile devices + width: 0 + height: 0 Dialog { id: errorDialog @@ -202,5 +205,16 @@ Controls.ApplicationWindow { return Device.type === Device.phone || Device.type === Device.phablet ? Units.dp(48) : Device.type == Device.tablet ? Units.dp(56) : Units.dp(64) }) + + // Show the application maximized on a mobile device, the window will be resized automatically. + // On the desktop devices, everything will work exactly as it did before + if (Device.isMobile) { + showMaximized() + } else { + width = Units.dp (800) + height = Units.dp (600) + + showNormal() + } } }