Merge pull request #49 from eekkelund/fontScaling

[Scaling] Request to change fontSize to font.pixelSize and recalculate Theme.fontSizes

examples/touch/content/SliderPage.qml

@@ -60,6 +60,10 @@ Page {
             anchors.margins: 20
             showValue: true
             value: 0.5
+            minimumValue: 1
+            maximumValue: 100
+            stepSize: 1
+
         }
         Slider {
             anchors.margins: 20

src/controls/Checkbox.qml

@@ -3,5 +3,6 @@ import QtQuick.Controls 1.0
 import QtQuick.Controls.Styles.Nemo 1.0
 
 CheckBox {
+    property int fontSize: Theme.fontSizeSmall
     style: CheckBoxStyle{}
 }

src/controls/HeaderToolsLayout.qml

@@ -64,7 +64,7 @@ Item {
         clip: true
         font.family: Theme.fontFamily
         color: Theme.textColor
-        font.pointSize: Theme.fontSizeLarge
+        font.pixelSize: Theme.fontSizeMedium
         font.weight: Font.Bold
         LinearGradient {
             anchors.right: parent.right

src/controls/Label.qml

@@ -35,5 +35,5 @@ Text {
     renderType: Text.NativeRendering
     font.family: Theme.fontFamily
     color: Theme.textColor
-    font.pointSize: Theme.fontSizeLarge
+    font.pixelSize: Theme.fontSizeMedium
 }

src/controls/ListView.qml

@@ -9,6 +9,9 @@ ListView {
     signal hideAllActions(int hideIndex)
 
     property bool showDecorator: false
+    property color delegateColor: Theme.backgroundColor
+    property color bottomGradientColor: Theme.backgroundColor
+    property color scrollerDecoratorColor: Theme.accentColor
 
     section.criteria: ViewSection.FullString
     section.delegate: Component{
@@ -16,13 +19,13 @@ ListView {
         Rectangle {
             width: listView.width
             height: size.dp(44)
-            color: Theme.backgroundColor
+            color: delegateColor
 
             Text {
                 id: sectionText
                 text: section
                 font.capitalization: Font.AllUppercase
-                font.pixelSize: Theme.fontSizeMedium
+                font.pixelSize: Theme.fontSizeSmall
                 color: Theme.textColor
                 anchors{
                     left: parent.left
@@ -59,7 +62,7 @@ ListView {
             end: Qt.point(0, size.dp(30))
             gradient: Gradient {
                 GradientStop { position: 0.0; color: "transparent" }
-                GradientStop { position: 1.0; color: Theme.backgroundColor }
+                GradientStop { position: 1.0; color: bottomGradientColor }
             }
 
         }
@@ -68,7 +71,7 @@ ListView {
     Rectangle{
         id: scrollerDecorator
         visible: (listView.showDecorator && listView.contentHeight > listView.height)
-        color: Theme.accentColor
+        color: scrollerDecoratorColor
 
         width: size.dp(5)
         height: listView.height*listView.height/listView.contentHeight

src/controls/Slider.qml

@@ -7,6 +7,7 @@ import QtQuick.Controls.Styles.Nemo 1.0
 Slider {
     id: slider
     property bool showValue: false
+    property int valueFontSize: Theme.fontSizeTiny
 
     style: SliderStyle{}
 }

src/controls/theme.cpp

@@ -30,11 +30,11 @@ Theme::Theme(QObject *parent) : QObject(parent)
     m_itemSpacingSmall = 10*m_dp;
     m_itemSpacingExtraSmall = 8*m_dp;
 
-    m_fontSizeExtraLarge = 30*m_dp;
-    m_fontSizeLarge = 24*m_dp;
-    m_fontSizeMedium = 20*m_dp;
-    m_fontSizeSmall = 18*m_dp;
-    m_fontSizeTiny = 16*m_dp;
+    m_fontSizeExtraLarge = 50*m_dp;
+    m_fontSizeLarge = 40*m_dp;
+    m_fontSizeMedium = 32*m_dp;
+    m_fontSizeSmall = 26*m_dp;
+    m_fontSizeTiny = 18*m_dp;
     m_fontWeightLarge = 63*m_dp;
     m_fontWeightMedium = 25*m_dp;
     m_fontFamily = "/usr/share/fonts/google-opensans/OpenSans-Regular.ttf";

src/controls/theme.h

@@ -147,11 +147,11 @@ private:
     qreal m_itemSpacingSmall;       //10
     qreal m_itemSpacingExtraSmall;         //8
 
-    int m_fontSizeExtraLarge;     //30
-    int m_fontSizeLarge;          //24
-    int m_fontSizeMedium;         //20
-    int m_fontSizeSmall;          //18
-    int m_fontSizeTiny;           //16
+    int m_fontSizeExtraLarge;     //50
+    int m_fontSizeLarge;           //40
+    int m_fontSizeMedium;      //32
+    int m_fontSizeSmall;          //26
+    int m_fontSizeTiny;           //18
     int m_fontWeightLarge;        //63
     int m_fontWeightMedium;       //25
     QString m_fontFamily;         //???

src/styles/ButtonStyle.qml

@@ -73,7 +73,7 @@ ButtonStyle {
         text: control.text
         color: Theme.textColor
         font.family: Theme.fontFamily
-        font.pointSize: Theme.fontSizeLarge
+        font.pixelSize: Theme.fontSizeMedium
         font.weight: control.primary ? Theme.fontWeightLarge : Theme.fontWeightMedium
         opacity: control.enabled ? 1.0 : 0.3
     }

src/styles/CheckBoxStyle.qml

@@ -130,6 +130,7 @@ CheckBoxStyle {
     }
     label: Label {
         text: control.text
+        font.pixelSize:control.fontSize
     }
     spacing: 10
 }

src/styles/SliderStyle.qml

@@ -37,9 +37,10 @@ SliderStyle{
         Text{
             id: valueLabel
             anchors.centerIn: parent
-            text: parseInt(control.value*100)
+            text: parseInt(control.value)
             visible: control.showValue
             color: Theme.textColor
+            font.pixelSize: control.valueFontSize
         }
     }
 

src/styles/TextFieldStyle.qml

@@ -25,8 +25,9 @@ TextFieldStyle {
     selectedTextColor: Theme.textColor
     selectionColor: Theme.accentColor
     textColor: Theme.textColor
-    font.pointSize: Theme.fontSizeTiny
+    font.pixelSize: Theme.fontSizeMedium
     font.family: Theme.fontFamily
+    placeholderTextColor: Theme.textColor
 
     background: Item {
         anchors{