import QtQuick 2.5 import QtQuick.Window 2.2 import QtQuick.Controls 1.0 import QtQuick.Layouts 1.0 Window { id: root visible: true width: 640 height: 480 title: qsTr("Hello World") property string asciiString: "The quick brown fox jumps over the lazy dog" property string unicodeString: "😙💆🤐👩😏😱🤐👷😷👦💋😃🕵👨🤠💁‍♂️💓💌😌😳👦💇‍♂️🤤😈😴💆🙍" ColumnLayout { anchors.centerIn: parent spacing: 10 Repeater { model: [{ font: "Arial", text: asciiString }, { font: "Segoe UI Emoji", text: asciiString }, { font: "Arial", text: unicodeString }, { font: "Segoe UI Emoji", text: unicodeString }] Text { id: label text: modelData.text font.family: modelData.font font.pointSize: 25 textFormat: Text.PlainText renderType: Text.NativeRendering TextMetrics { id: metrics text: label.text font: label.font } Rectangle { z: -1 anchors.fill: parent color: "lightgrey" } Rectangle { z: 1 width: label.contentWidth height: label.contentHeight color: "transparent" border.color: "green" } Rectangle { z: 1 width: label.width height: label.height color: "transparent" border.color: "yellow" } Rectangle { z: 1 x: label.childrenRect.x y: label.childrenRect.y width: label.childrenRect.width height: label.childrenRect.height color: "transparent" border.color: "blue" } Rectangle { z: 1 //x: metrics.boundingRect.x //y: metrics.boundingRect.y width: metrics.boundingRect.width height: metrics.boundingRect.height color: "transparent" border.color: "orange" } Rectangle { z: 1 x: metrics.tightBoundingRect.x - metrics.boundingRect.x y: metrics.tightBoundingRect.y - metrics.boundingRect.y width: metrics.tightBoundingRect.width height: metrics.tightBoundingRect.height color: "transparent" border.color: "red" } } } } }