Change Font Size of Button in Qt QML - qt

Question

How can the font size of the text in a Button control be set in QML? The designer has not option, and 'font' is not a valid property of Button.
Button {
id: cmdQuit
text: qsTr("Quit")
width: 64
height: 32
}

Answer 1

You set the Button's style property:
import QtQuick 2.2
import QtQuick.Controls 1.2
import QtQuick.Controls.Styles 1.2
Rectangle {
id: container
width: 800
height: 800
Button {
id: cmdQuit
text: qsTr("Quit")
width: 64
height: 32
style: ButtonStyle {
label: Text {
renderType: Text.NativeRendering
verticalAlignment: Text.AlignVCenter
horizontalAlignment: Text.AlignHCenter
font.family: "Helvetica"
font.pointSize: 20
color: "blue"
text: control.text
}
}
}
}

Answer 2

For QtQuick 2, you have to use the contentItem property as shown here: https://doc.qt.io/qt-5/qtquickcontrols2-customize.html#customizing-button
import QtQuick 2.12
import QtQuick.Controls 2.12
Button {
id: control
text: qsTr("Button")
contentItem: Text {
text: control.text
font.pointSize: 20
opacity: enabled ? 1.0 : 0.3
color: control.down ? "#17a81a" : "#21be2b"
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
elide: Text.ElideRight
}
}

Answer 3

This is an old question, but since it comes first in search engines I'm providing an update on the situation.
For QtQuick2, unlike what Chris said, you don't need to use the contentItem property anymore. You can access the font property directly from Button.
Example:
Button {
id: btn
text: "Test"
font.pixelSize: 18
}