Merge pull request #126 from mymike00/master

switching from Devices.density to units.gu
ubports · Jan 9, 2018 · 6c405ed · 6c405ed
2 parents 1688795 + 7b5bbbf
commit 6c405ed
Show file tree

Hide file tree

Showing 13 changed files with 94 additions and 92 deletions.
diff --git a/telegram/app/qml/AccountLoading.qml b/telegram/app/qml/AccountLoading.qml
@@ -24,12 +24,12 @@ Rectangle {
 
     Column {
         anchors.centerIn: parent
-        spacing: 8*Devices.density
+        spacing: units.gu(1)
 
         Indicator {
             id: indicator
             anchors.horizontalCenter: parent.horizontalCenter
-            indicatorSize: 22*Devices.density
+            indicatorSize: units.gu(2.75)
             modern: true
             light: false
             Component.onCompleted: start()
@@ -47,7 +47,7 @@ Rectangle {
         id: logout_text
         anchors.horizontalCenter: parent.horizontalCenter
         anchors.top: parent.verticalCenter
-        anchors.topMargin: 80*Devices.density
+        anchors.topMargin: units.gu(10)
         font.family: AsemanApp.globalFont.family
         font.pixelSize: 10*Devices.fontDensity
         font.underline: true
@@ -56,7 +56,7 @@ Rectangle {
 
         MouseArea {
             anchors.fill: parent
-            anchors.margins: -10*Devices.density
+            anchors.margins: -units.gu(1.25)
             cursorShape: Qt.PointingHandCursor
             onClicked: Cutegram.logout(telegramObject.phoneNumber)
         }

diff --git a/telegram/app/qml/AccountMessageAction.qml b/telegram/app/qml/AccountMessageAction.qml
@@ -135,8 +135,8 @@ Item {
         Image {
             id: img
             anchors.horizontalCenter: parent.horizontalCenter
-            width: 64*Devices.density
-            height: 80*Devices.density
+            width: units.gu(8)
+            height: units.gu(10)
             sourceSize: Qt.size(width,width)
             source: {
                 if(imgPath.length==0)

diff --git a/telegram/app/qml/AccountMessageList.qml b/telegram/app/qml/AccountMessageList.qml
@@ -122,9 +122,9 @@ Rectangle {
     Rectangle {
         anchors.centerIn: parent
         color: "#ffffff"
-        width: welcome_txt.width + 20*Devices.density
-        height: welcome_txt.height + 10*Devices.density
-        radius: 5*Devices.density
+        width: welcome_txt.width + units.gu(2.5)
+        height: welcome_txt.height + units.gu(1.25)
+        radius: units.dp(4)
         visible: currentDialog == telegramObject.nullDialog
 
         Text {
@@ -361,27 +361,26 @@ Rectangle {
     }
 
     PhysicalScrollBar {
-        scrollArea: mlist; height: mlist.height-bottomMargin-topMargin; width: 6*Devices.density
+        scrollArea: mlist; height: mlist.height-bottomMargin-topMargin; width: units.gu(0.75)
         anchors.right: mlist.right; anchors.top: mlist.top;
         anchors.topMargin: topMargin; reverse: true
     }
 
-    Rectangle {
+    ProportionalShape {
         anchors.right: parent.right
         anchors.bottom: parent.bottom
-        anchors.bottomMargin: bottomMargin + 8*Devices.density
-        anchors.rightMargin: 8*Devices.density
-        width: units.gu(7)//64*Devices.density
-        height: width
-        radius: height / 2//5*Devices.density
+        anchors.bottomMargin: bottomMargin + units.gu(1)
+        anchors.rightMargin: units.gu(1)
+        width: units.gu(7)
         color: "#88000000"
 //        normalColor: "#88000000"
 //        highlightColor: "#aa000000"
 //        iconSource: "files/down.png"
 //        cursorShape: Qt.PointingHandCursor
-//        iconHeight: 18*Devices.density
+//        iconHeight: units.gu(2.25)
         visible: opacity != 0
         opacity: mlist.visibleArea.yPosition+mlist.visibleArea.heightRatio < 0.95? 1 : 0
+        aspect: UbuntuShape.Flat
 
         MouseArea {
             anchors.fill: parent
@@ -390,11 +389,11 @@ Rectangle {
 
 //        onClicked: mlist.positionViewAtBeginning()
 
-        Image {
+        Icon {
             anchors.centerIn: parent
-            height: units.gu(2)
-            fillMode: Image.PreserveAspectFit
-            source: "qrc:/qml/files/down.png"
+            height: units.gu(3.25)
+            color: "white"
+            name: "down"
         }
 
         Behavior on opacity {
@@ -439,10 +438,10 @@ Rectangle {
 
     Column {
         anchors.top: acc_rjc_txt.bottom
-        anchors.topMargin: 10*Devices.density
+        anchors.topMargin: units.gu(1.25)
         anchors.left: parent.left
         anchors.right: parent.right
-        spacing: 10*Devices.density
+        spacing: units.gu(1.25)
         visible: acc_rjc_txt.visible
 
         TelegramButton {

diff --git a/telegram/app/qml/AccountMessageMedia.qml b/telegram/app/qml/AccountMessageMedia.qml
@@ -18,7 +18,7 @@ Item {
     property variant mediaType: file_handler.targetType
     property bool downloading: file_handler.progressType != FileHandler.TypeProgressEmpty
 
-    property real maximumMediaHeight: 256 * Devices.density
+    property real maximumMediaHeight: units.gu(32)
     property real maximumMediaWidth: width * 0.75
     property real maximumMediaRatio: maximumMediaWidth / maximumMediaHeight
 
@@ -265,7 +265,7 @@ Item {
         visible: fileLocation.length == 0 && !isSticker
                 && file_handler.targetType != FileHandler.TypeTargetMediaPhoto
                 && file_handler.targetType != FileHandler.TypeTargetMediaGeoPoint
-        radius: 3*Devices.density
+        radius: units.dp(4)
 
         Icon {
             height: units.gu(4)
@@ -298,7 +298,7 @@ Item {
             id:filesize_lbl
             anchors.top: parent.top
             anchors.left: parent.left
-            anchors.margins: 3*Devices.density
+            anchors.margins: units.gu(0.5)
             font.weight: Font.DemiBold
             fontSize: "small"
             color: "white"
@@ -319,7 +319,7 @@ Item {
         anchors.bottom: parent.bottom
         anchors.left: parent.left
         anchors.right: parent.right
-        anchors.margins: 4*Devices.density
+        anchors.margins: units.gu(0.5)
         height: units.dp(3)
         radius: 0
         percent: downloading ? file_handler.progressPercent : 0
@@ -332,8 +332,8 @@ Item {
         source: file_handler.targetType == FileHandler.TypeTargetMediaOther? "files/map-pin.png" : ""
         sourceSize: Qt.size(width,height)
         fillMode: Image.PreserveAspectFit
-        width: 92*Devices.density
-        height: 92*Devices.density
+        width: units.gu(12)
+        height: units.gu(12)
         visible: file_handler.targetType == FileHandler.TypeTargetMediaOther
         asynchronous: true
         smooth: true
@@ -399,8 +399,8 @@ Item {
     Component {
         id: media_player_component
         MediaPlayerItem {
-            width: 180*Devices.density
-            height: 40*Devices.density
+            width: units.gu(22)
+            height: units.gu(5)
             anchors.verticalCenter: parent.verticalCenter
             filePath: fileLocation
             z: fileLocation.length == 0? -1 : 0

diff --git a/telegram/app/qml/AccountMessageUpload.qml b/telegram/app/qml/AccountMessageUpload.qml
@@ -60,7 +60,7 @@ Item {
         id: filesize_lbl
         anchors.top: parent.top
         anchors.left: parent.left
-        anchors.margins: 2*Devices.density
+        anchors.margins: units.gu(0.25)
         font.weight: Font.DemiBold
         fontSize: "small"
         color: "white"
@@ -88,7 +88,7 @@ Item {
         anchors.left: parent.left
         anchors.right: parent.right
         anchors.bottom: pbar.top
-        anchors.margins: 2*Devices.density
+        anchors.margins: units.gu(0.25)
         horizontalAlignment: Text.AlignHCenter
         wrapMode: Text.WrapAtWordBoundaryOrAnywhere
         elide: Text.ElideRight
@@ -104,7 +104,7 @@ Item {
         anchors.bottom: parent.bottom
         anchors.left: parent.left
         anchors.right: parent.right
-        anchors.margins: 4*Devices.density
+        anchors.margins: units.gu(0.5)
         height: units.dp(3)
         radius: 0
         percent: 100*message.upload.uploaded/message.upload.totalSize

diff --git a/telegram/app/qml/ClickableContactImage.qml b/telegram/app/qml/ClickableContactImage.qml
@@ -16,7 +16,7 @@ ContactImage {
         anchors.fill: parent
         light: true
         modern: true
-        indicatorSize: 22*Devices.density
+        indicatorSize: units.gu(2.75)
         property bool active: user_photo_marea.loadingPhoto
 
         onActiveChanged: {

diff --git a/telegram/app/qml/FramedContactImage.qml b/telegram/app/qml/FramedContactImage.qml
@@ -19,7 +19,7 @@ Item {
         width: parent.width*2
         height: parent.height*2
         visible: false
-        radius: 10*Devices.density
+        radius: units.gu(1.25)
         scale: 2
 
         ContactImage {
@@ -37,7 +37,7 @@ Item {
         Rectangle {
             radius: item.radius
             anchors.fill: parent
-            anchors.margins: 1*Devices.density
+            anchors.margins: units.dp(1)
         }
     }
 

diff --git a/telegram/app/qml/MediaPlayerItem.qml b/telegram/app/qml/MediaPlayerItem.qml
@@ -8,7 +8,7 @@ import "js/time.js" as Time
 
 Item {
     width: 100
-    height: 62*Devices.density
+    height: units.gu(8)
 
     property alias filePath: player.source
     property bool isInsideBar: false
@@ -42,7 +42,7 @@ Item {
         Rectangle {
             id: play_btn
             anchors.fill: parent
-            anchors.margins: 3*Devices.density
+            anchors.margins: units.gu(0.5)
             radius: width/2
             color: "#ffffff"
             visible: !parent.isInsideBar
@@ -128,9 +128,9 @@ Item {
         anchors.left: play_btn_scene.right
         anchors.right: parent.right
         anchors.verticalCenter: parent.verticalCenter
-        anchors.margins: 4*Devices.density
-        height: 6*Devices.density
-        radius: 2*Devices.density
+        anchors.margins: units.gu(0.5)
+        height: units.gu(0.75)
+        radius: units.gu(0.25)
         color: "#555555"
 
         Rectangle {
@@ -149,7 +149,7 @@ Item {
             radius: width/2
             color: "#ffffff"
             border.color: "#aaaaaa"
-            border.width: 1*Devices.density
+            border.width: units.dp(1)
             x: (seeker_scene.width-seeker.width)*player.position/player.duration
         }
     }

diff --git a/telegram/app/qml/MessageReplyItem.qml b/telegram/app/qml/MessageReplyItem.qml
@@ -7,8 +7,8 @@ import "js/colors.js" as Colors
 
 Item {
     id: msg_reply
-    width: row.width + 12*Devices.density
-    height: row.height + 4*Devices.density
+    width: row.width + units.gu(1.5)
+    height: row.height + units.gu(0.5)
     visible: realMessage
 
     property Telegram telegram
@@ -37,7 +37,7 @@ Item {
         Column {
             id: column
             anchors.verticalCenter: parent.verticalCenter
-            spacing: 2*Devices.density
+            spacing: units.gu(0.25)
 
             Label {
                 id: name_text
@@ -55,7 +55,7 @@ Item {
             Image {
                 id: media_img
                 width: height*imageSize.width/imageSize.height
-                height: 48*Devices.density
+                height: units.gu(6)
                 fillMode: Image.PreserveAspectFit
                 asynchronous: true
                 sourceSize: Qt.size(width,height)

diff --git a/telegram/app/qml/TagSuggestionMenu.qml b/telegram/app/qml/TagSuggestionMenu.qml
@@ -8,7 +8,7 @@ import "js/colors.js" as Colors
 Item {
     id: root
     width: parent.width
-    height: 3 * 32*Devices.density + back_frame.anchors.topMargin
+    height: 3 * units.gu(4) + back_frame.anchors.topMargin
     visible: fmodel.count != 0
     clip: true
 
@@ -25,10 +25,10 @@ Item {
     DropShadow {
         anchors.fill: source
         source: back
-        radius: 8*Devices.density
+        radius: units.gu(1)
         samples: 16
-        horizontalOffset: 1*Devices.density
-        verticalOffset: 1*Devices.density
+        horizontalOffset: units.dp(1)
+        verticalOffset: units.dp(1)
         color: "#66111111"
     }
 
@@ -39,7 +39,7 @@ Item {
         Rectangle {
             id: back_frame
             anchors.fill: parent
-            anchors.topMargin: 8*Devices.density
+            anchors.topMargin: units.gu(1)
             color: Colors.white
 
             Rectangle {
@@ -53,8 +53,8 @@ Item {
 
     ListView {
         id: listv
-        width: back_frame.width-8*Devices.density
-        height: back_frame.height-4*Devices.density
+        width: back_frame.width-units.gu(1)
+        height: back_frame.height-units.gu(0.5)
         anchors.horizontalCenter: parent.horizontalCenter
         anchors.bottom: parent.bottom
         clip: true
@@ -64,20 +64,20 @@ Item {
         /*highlightMoveDuration: 0
         highlight: Rectangle {
             width: listv.width
-            height: 32*Devices.density
+            height: units.gu(4)
             color: Colors.list_pressed
-            radius: 2*Devices.density
+            radius: units.gu(0.25)
         }*/
 
         delegate: Item {
             width: listv.width
-            height: 32*Devices.density
+            height: units.gu(4)
 
             Text {
                 anchors.left: parent.left
                 anchors.right: parent.right
                 anchors.verticalCenter: parent.verticalCenter
-                anchors.margins: 4*Devices.density
+                anchors.margins: units.gu(0.5)
                 wrapMode: Text.WrapAtWordBoundaryOrAnywhere
                 elide: Text.ElideRight
                 maximumLineCount: 1