Change Font Size of Button in Qt QML

user1054922 picture user1054922 · Aug 6, 2014 · Viewed 19.8k times · Source

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

fxam picture fxam · Aug 6, 2014

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
      }
    }
  }
}