[solved] How to make Text font size to be auto adjusted
-
How to make Text font size to be adjusted depending on parent width & height?
Here is code snippet:
@
Item {
width: 200 // that value will vary
height: 100 // that value will varyText {
id: label
anchors.top: parent.top; anchors.left: parent.left
font.pointSize: 10 // this can be static size
text: "current"
}Text {
id: data
anchors.top: label.bottom; anchors.bottom: parent.bottom;
anchors.left: parent.left;
anchors.topMargin: 5
font.pointSize: 40 // this should resize to fit parent size
text: "100"
}Text {
id: units
anchors.bottom: data.bottom; anchors.left: data.right
anchors.leftMargin: 5
font.pointSize: data.font.pointSize/2 // this will be resized aswell
text: "mA"
}
}
@ -
It's very simple.
You need to explicit specify the width and height of your Text item and then specify minimumPointSize and fontSizeMode:
@
Text {
width: parent.width
height: parent.height
font.pointSize: 100
minimumPointSize: 10
fontSizeMode: Text.Fit
}
@fontSizeMode doesn't work if you don't explicit set the width and height to the Text items. Anchors is not enough.