mobile, QML: introduce basePointSize in subsurfaceTheme

By manipulation the used font pointSize property, we can dynamically
scale fonts and derived UI objects. At the same time, we have
some logic to determine the default font, its size, etc, for example
depending on screen properties. The scaling of the UI (and its font)
does not need to interfere with those defaults.

However, when we want to reset the pointSize, we alter the default, so
a backup of the default is needed. Ok, not al full backup, as the only
thing we like to manipulate is the pointSize, to which we want to be
able to return.

All this leads to this commit. A basePointSize property is added, that
is initialized from the default. Due to the binding logic of the QML
engine, it is not a classic initialization, but a binding between the
2 properties. We need to break that binding explicitly, so that
the original PointSize is always preserved.

In addition, a display of the new font property is added to the
developers theme test.

Signed-off-by: Jan Mulder <jlmulder@xs4all.nl>
This commit is contained in:
Jan Mulder 2018-09-25 12:48:48 +02:00
parent a9c6b1472b
commit c2c751c164
2 changed files with 27 additions and 4 deletions

View file

@ -61,6 +61,13 @@ Kirigami.Page {
Layout.columnSpan: 2
}
Controls.Label {
text: "basePointSize:"
}
Controls.Label {
text: subsurfaceTheme.basePointSize
}
Controls.Label {
text: "FontMetrics pointSize:"
}

View file

@ -46,7 +46,9 @@ Kirigami.ApplicationWindow {
FontMetrics {
id: fontMetrics
Component.onCompleted: {
console.log("Using the following font: " + fontMetrics.font.family + " at " + fontMetrics.font.pointSize + "pt")
console.log("Using the following font: " + fontMetrics.font.family
+ " at " + subsurfaceTheme.basePointSize + "pt" +
" with mobile_scale: " + PrefDisplay.mobile_scale)
}
}
visible: false
@ -444,9 +446,16 @@ if you have network connectivity and want to sync your data to cloud storage."),
QtObject {
id: subsurfaceTheme
property int regularPointSize: fontMetrics.font.pointSize
property int titlePointSize: Math.round(regularPointSize * 1.5)
property int smallPointSize: Math.round(regularPointSize * 0.8)
// basePointSize is determinded at start of the app and shall
// never be changed. This is very tricky. In order to break the
// binding between basePointSize and fontMetrics.font.pointSize we
// multipy it by 1.0 in the onComplete hander of this object.
property double basePointSize: fontMetrics.font.pointSize;
property double regularPointSize: fontMetrics.font.pointSize
property double titlePointSize: regularPointSize * 1.5
property double smallPointSize: regularPointSize * 0.8
// colors currently in use
property string currentTheme
@ -500,6 +509,13 @@ if you have network connectivity and want to sync your data to cloud storage."),
property int columnWidth: Math.round(rootItem.width/(Kirigami.Units.gridUnit*28)) > 0 ? Math.round(rootItem.width / Math.round(rootItem.width/(Kirigami.Units.gridUnit*28))) : rootItem.width
Component.onCompleted: {
// break binding explicitly. Now we have a basePointSize that we can
// use to easily scale against
basePointSize = basePointSize * 1.0;
// set the initial UI scaling as in the the preferences
fontMetrics.font.pointSize = subsurfaceTheme.basePointSize * PrefDisplay.mobile_scale;
// this needs to pick the theme from persistent preference settings
var theme = PrefDisplay.theme
if (theme == "Blue")