Commit e94e21f2 authored by Jin Liu's avatar Jin Liu Committed by Nate Graham
Browse files

applets/digital-clock: add a font size setting

This allows the user to choose between automatically determined font size
(the default, and the current behavior), and completely manual font settings.

The UI refactor and layout code changes necessary for this feature also
happily fix a few bugs along the way.
 
BUG: 413394
BUG: 421548
BUG: 395468
FIXED-IN: 5.26
parent 66884125
Pipeline #209636 passed with stage
in 8 minutes and 42 seconds
......@@ -26,6 +26,10 @@
<label>Custom date format string.</label>
<default>ddd d</default>
</entry>
<entry name="autoFontAndSize" type="Bool">
<label>Use Plasma default font and automatically determine font size.</label>
<default>true</default>
</entry>
<entry name="fontFamily" type="string">
<label>Font family. e.g "arial". The system font is used if this is not set.</label>
<default></default>
......@@ -38,6 +42,18 @@
<label>Sets the font to italic.</label>
<default>false</default>
</entry>
<entry name="fontWeight" type="Int">
<label>Sets font weight.</label>
<default>50</default>
</entry>
<entry name="fontStyleName" type="string">
<label>Sets font style </label>
<default></default>
</entry>
<entry name="fontSize" type="Int">
<label>Sets font size.</label>
<default>10</default>
</entry>
<entry name="timeFormat" type="string">
<default>default</default>
</entry>
......
......@@ -127,7 +127,7 @@ MouseArea {
target: contentItem
height: timeLabel.height + (main.showDate || timezoneLabel.visible ? 0.8 * timeLabel.height : 0)
width: Math.max(timeLabel.paintedWidth + (main.showDate ? timezoneLabel.paintedWidth : 0),
width: Math.max(timeLabel.width + (main.showDate ? timezoneLabel.paintedWidth : 0),
timezoneLabel.paintedWidth, dateLabel.paintedWidth) + PlasmaCore.Units.smallSpacing * 2
}
......@@ -149,7 +149,7 @@ MouseArea {
height: sizehelper.height
width: sizehelper.contentWidth
font.pixelSize: timeLabel.height
fontSizeMode: Text.VerticalFit
}
PropertyChanges {
......@@ -158,7 +158,8 @@ MouseArea {
height: main.showDate ? 0.7 * timeLabel.height : 0.8 * timeLabel.height
width: main.showDate ? timezoneLabel.paintedWidth : timeLabel.width
font.pixelSize: timezoneLabel.height
font.pointSize: main.showDate ? 0.7 * timeLabel.font.pointSize : 0.8 * timeLabel.font.pointSize
fontSizeMode: main.showDate ? Text.VerticalFit : Text.Fit
}
PropertyChanges {
......@@ -168,7 +169,9 @@ MouseArea {
width: dateLabel.paintedWidth
verticalAlignment: Text.AlignVCenter
font.pixelSize: dateLabel.height
font.pointSize: 0.8 * timeLabel.font.pointSize
font.pixelSize: -1
fontSizeMode: Text.VerticalFit
}
AnchorChanges {
......@@ -189,9 +192,9 @@ MouseArea {
* and still fits well into the panel with all the applied margins.
*/
height: Math.min(main.showDate || timezoneLabel.visible ? main.height * 0.56 : main.height * 0.71,
3 * PlasmaCore.Theme.defaultFont.pixelSize)
Plasmoid.configuration.autoFontAndSize ? 3 * PlasmaCore.Theme.defaultFont.pixelSize : 1024)
font.pixelSize: sizehelper.height
fontSizeMode: Text.VerticalFit
}
},
......@@ -222,16 +225,36 @@ MouseArea {
anchors.right: contentItem.right
}
PropertyChanges {
target: timeLabel
height: sizehelper.height
width: sizehelper.contentWidth
fontSizeMode: Text.VerticalFit
}
PropertyChanges {
target: timezoneLabel
height: 0.7 * timeLabel.height
width: timezoneLabel.paintedWidth
font.pointSize: 0.7 * timeLabel.font.pointSize
fontSizeMode: Text.VerticalFit
}
PropertyChanges {
target: dateLabel
height: timeLabel.height
width: dateLabel.paintedWidth + PlasmaCore.Units.smallSpacing
font.pixelSize: 1024
verticalAlignment: Text.AlignVCenter
anchors.rightMargin: labelsGrid.columnSpacing
font.pointSize: timeLabel.font.pointSize
font.pixelSize: -1
fontSizeMode: Text.VerticalFit
}
......@@ -242,32 +265,12 @@ MouseArea {
anchors.verticalCenter: labelsGrid.verticalCenter
}
PropertyChanges {
target: timeLabel
height: sizehelper.height
width: sizehelper.contentWidth
fontSizeMode: Text.VerticalFit
}
PropertyChanges {
target: timezoneLabel
height: 0.7 * timeLabel.height
width: timezoneLabel.paintedWidth
fontSizeMode: Text.VerticalFit
horizontalAlignment: Text.AlignHCenter
}
PropertyChanges {
target: sizehelper
height: Math.min(main.height, 3 * PlasmaCore.Theme.defaultFont.pixelSize)
height: Math.min(main.height, Plasmoid.configuration.autoFontAndSize ? 3 * PlasmaCore.Theme.defaultFont.pixelSize : 1024)
fontSizeMode: Text.VerticalFit
font.pixelSize: 3 * PlasmaCore.Theme.defaultFont.pixelSize
}
},
......@@ -302,18 +305,17 @@ MouseArea {
height: sizehelper.contentHeight
width: main.width
font.pixelSize: Math.min(timeLabel.height, 3 * PlasmaCore.Theme.defaultFont.pixelSize)
fontSizeMode: Text.HorizontalFit
fontSizeMode: Text.VerticalFit
}
PropertyChanges {
target: timezoneLabel
height: Math.max(0.7 * timeLabel.height, minimumPixelSize)
height: 0.7 * timeLabel.height
width: main.width
font.pointSize: 0.7 * timeLabel.font.pointSize
fontSizeMode: Text.Fit
minimumPixelSize: dateLabel.minimumPixelSize
elide: Text.ElideRight
}
......@@ -328,7 +330,8 @@ MouseArea {
verticalAlignment: Text.AlignTop
// Those magic numbers are purely what looks nice as maximum size, here we have it the smallest
// between slightly bigger than the default font (1.4 times) and a bit smaller than the time font
font.pixelSize: Math.min(0.7 * timeLabel.height, PlasmaCore.Theme.defaultFont.pixelSize * 1.4)
font.pixelSize: Math.min(0.7 * timeLabel.height, Plasmoid.configuration.autoFontAndSize ? PlasmaCore.Theme.defaultFont.pixelSize * 1.4 : 1024)
font.pointSize: -1
elide: Text.ElideRight
wrapMode: Text.WordWrap
}
......@@ -343,10 +346,10 @@ MouseArea {
PropertyChanges {
target: sizehelper
height: Plasmoid.configuration.autoFontAndSize ? 3 * PlasmaCore.Theme.defaultFont.pixelSize : 1024
width: main.width
fontSizeMode: Text.HorizontalFit
font.pixelSize: 3 * PlasmaCore.Theme.defaultFont.pixelSize
fontSizeMode: Text.Fit
}
},
......@@ -390,20 +393,20 @@ MouseArea {
height: 0.7 * timeLabel.height
width: main.width
font.pointSize: 0.7 * timeLabel.font.pointSize
fontSizeMode: Text.Fit
minimumPixelSize: 1
}
PropertyChanges {
target: dateLabel
height: 0.7 * timeLabel.height
font.pixelSize: 1024
width: Math.max(timeLabel.contentWidth, PlasmaCore.Units.gridUnit * 3)
verticalAlignment: Text.AlignVCenter
font.pointSize: 0.7 * timeLabel.font.pointSize
font.pixelSize: -1
fontSizeMode: Text.Fit
minimumPixelSize: 1
wrapMode: Text.WordWrap
}
......@@ -431,7 +434,6 @@ MouseArea {
width: main.width
fontSizeMode: Text.Fit
font.pixelSize: 1024
}
}
]
......@@ -493,30 +495,27 @@ MouseArea {
Components.Label {
id: timeLabel
font {
family: Plasmoid.configuration.fontFamily || PlasmaCore.Theme.defaultFont.family
weight: Plasmoid.configuration.boldText ? Font.Bold : PlasmaCore.Theme.defaultFont.weight
italic: Plasmoid.configuration.italicText
pixelSize: 1024
pointSize: -1 // Because we're setting the pixel size instead
// TODO: remove once this label is ported to PC3
}
font.family: Plasmoid.configuration.autoFontAndSize ? PlasmaCore.Theme.defaultFont.family : Plasmoid.configuration.fontFamily
font.weight: Plasmoid.configuration.autoFontAndSize ? PlasmaCore.Theme.defaultFont.weight : Plasmoid.configuration.fontWeight
font.italic: Plasmoid.configuration.autoFontAndSize ? PlasmaCore.Theme.defaultFont.italic : Plasmoid.configuration.italicText
font.pointSize: Plasmoid.configuration.autoFontAndSize ? 1024 : Plasmoid.configuration.fontSize
minimumPointSize: 1
minimumPixelSize: 1
text: Qt.formatTime(main.getCurrentTime(), main.timeFormat)
verticalAlignment: Text.AlignVCenter
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
}
Components.Label {
id: timezoneLabel
font.family: timeLabel.font.family
font.weight: timeLabel.font.weight
font.italic: timeLabel.font.italic
font.pixelSize: 1024
font.pointSize: -1 // Because we're setting the pixel size instead
// TODO: remove once this label is ported to PC3
font.pointSize: timeLabel.font.pointSize
minimumPointSize: 1
minimumPixelSize: 1
visible: text.length > 0
......@@ -533,9 +532,8 @@ MouseArea {
font.family: timeLabel.font.family
font.weight: timeLabel.font.weight
font.italic: timeLabel.font.italic
font.pixelSize: 1024
font.pointSize: -1 // Because we're setting the pixel size instead
// TODO: remove once this label is ported to PC3
font.pointSize: timeLabel.font.pointSize
minimumPointSize: 1
minimumPixelSize: 1
horizontalAlignment: Text.AlignHCenter
......@@ -553,7 +551,9 @@ MouseArea {
font.family: timeLabel.font.family
font.weight: timeLabel.font.weight
font.italic: timeLabel.font.italic
minimumPixelSize: 1
font.pointSize: timeLabel.font.pointSize
minimumPointSize: timeLabel.minimumPointSize
minimumPixelSize: timeLabel.minimumPixelSize
visible: false
}
......@@ -564,6 +564,7 @@ MouseArea {
font.family: timeLabel.font.family
font.weight: timeLabel.font.weight
font.italic: timeLabel.font.italic
font.pointSize: timeLabel.font.pointSize
}
// Qt's QLocale does not offer any modular time creating like Klocale did
......
......@@ -9,22 +9,31 @@
import QtQuick 2.0
import QtQuick.Controls 2.3 as QtControls
import QtQuick.Layouts 1.0 as QtLayouts
import QtQuick.Dialogs 1.1 as QtDialogs
import org.kde.plasma.plasmoid 2.0
import org.kde.plasma.core 2.0 as PlasmaCore
import org.kde.plasma.workspace.calendar 2.0 as PlasmaCalendar
import org.kde.kquickcontrolsaddons 2.0 // For KCMShell
import org.kde.kirigami 2.5 as Kirigami
QtLayouts.ColumnLayout {
id: appearancePage
signal configurationChanged
property alias cfg_autoFontAndSize: autoFontAndSizeRadioButton.checked
property string cfg_fontFamily
property alias cfg_boldText: boldCheckBox.checked
property string cfg_timeFormat: ""
property alias cfg_italicText: italicCheckBox.checked
// boldText and fontStyleName are not used in DigitalClock.qml
// However, they are necessary to remember the exact font style chosen.
// Otherwise, when the user open the font dialog again, the style will be lost.
property alias cfg_fontFamily : fontDialog.fontChosen.family
property alias cfg_boldText : fontDialog.fontChosen.bold
property alias cfg_italicText : fontDialog.fontChosen.italic
property alias cfg_fontWeight : fontDialog.fontChosen.weight
property alias cfg_fontStyleName : fontDialog.fontChosen.styleName
property alias cfg_fontSize : fontDialog.fontChosen.pointSize
property string cfg_timeFormat: ""
property alias cfg_showLocalTimezone: showLocalTimezone.checked
property alias cfg_displayTimezoneFormat: displayTimezoneFormat.currentIndex
property alias cfg_showSeconds: showSeconds.checked
......@@ -35,33 +44,6 @@ QtLayouts.ColumnLayout {
property alias cfg_use24hFormat: use24hFormat.currentIndex
property alias cfg_dateDisplayFormat: dateDisplayFormat.currentIndex
onCfg_fontFamilyChanged: {
// HACK by the time we populate our model and/or the ComboBox is finished the value is still undefined
if (cfg_fontFamily) {
for (var i = 0, j = fontsModel.count; i < j; ++i) {
if (fontsModel.get(i).value === cfg_fontFamily) {
fontFamilyComboBox.currentIndex = i
break
}
}
}
}
ListModel {
id: fontsModel
Component.onCompleted: {
var arr = [] // use temp array to avoid constant binding stuff
arr.push({text: i18nc("Use default font", "Default"), value: ""})
var fonts = Qt.fontFamilies()
var foundIndex = 0
for (var i = 0, j = fonts.length; i < j; ++i) {
arr.push({text: fonts[i], value: fonts[i]})
}
append(arr)
}
}
Kirigami.FormLayout {
QtLayouts.Layout.fillWidth: true
......@@ -232,55 +214,70 @@ QtLayouts.ColumnLayout {
Kirigami.FormData.isSection: true
}
QtLayouts.RowLayout {
QtLayouts.Layout.fillWidth: true
QtControls.ButtonGroup {
buttons: [autoFontAndSizeRadioButton, manualFontAndSizeRadioButton]
}
Kirigami.FormData.label: i18n("Font style:")
QtControls.RadioButton {
Kirigami.FormData.label: i18nc("@label:group", "Text display:")
id: autoFontAndSizeRadioButton
text: i18nc("@option:radio", "Automatic")
}
QtControls.ComboBox {
id: fontFamilyComboBox
QtLayouts.Layout.fillWidth: true
currentIndex: 0
// ComboBox's sizing is just utterly broken
QtLayouts.Layout.minimumWidth: Kirigami.Units.gridUnit * 10
model: fontsModel
// doesn't autodeduce from model because we manually populate it
textRole: "text"
onCurrentIndexChanged: {
var current = model.get(currentIndex)
if (current) {
cfg_fontFamily = current.value
appearancePage.configurationChanged()
QtControls.Label {
text: i18nc("@label", "Text will follow the system font and expand to fill the available space.")
QtLayouts.Layout.fillWidth: true
wrapMode: Text.Wrap
font: PlasmaCore.Theme.smallestFont
}
QtLayouts.RowLayout {
QtControls.RadioButton {
id: manualFontAndSizeRadioButton
text: i18nc("@option:radio setting for manually configuring the font settings", "Manual")
checked: !cfg_autoFontAndSize
onClicked: {
if (cfg_fontFamily === "") {
fontDialog.fontChosen = PlasmaCore.Theme.defaultFont
}
}
}
QtControls.Button {
id: boldCheckBox
QtControls.ToolTip {
text: i18n("Bold text")
text: i18nc("@action:button", "Choose Style…")
icon.name: "settings-configure"
enabled: manualFontAndSizeRadioButton.checked
onClicked: {
fontDialog.font = fontDialog.fontChosen
fontDialog.open()
}
icon.name: "format-text-bold"
checkable: true
Accessible.name: QtControls.ToolTip.text
}
QtControls.Button {
id: italicCheckBox
QtControls.ToolTip {
text: i18n("Italic text")
}
icon.name: "format-text-italic"
checkable: true
Accessible.name: QtControls.ToolTip.text
}
}
QtControls.Label {
visible: manualFontAndSizeRadioButton.checked
text: i18nc("@info %1 is the font size, %2 is the font family", "%1pt %2", cfg_fontSize, fontDialog.fontChosen.family)
font: fontDialog.fontChosen
}
}
Item {
QtLayouts.Layout.fillHeight: true
}
QtDialogs.FontDialog {
id: fontDialog
title: i18nc("@title:window", "Choose a Font")
modality: Qt.WindowModal
property font fontChosen: Qt.Font()
onAccepted: {
fontChosen = font
}
}
Component.onCompleted: {
if (!Plasmoid.configuration.showLocalTimezone) {
showLocalTimeZoneWhenDifferent.checked = true;
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment