Qt Quick Beispiele - Text

Text ist eine Sammlung von kleinen QML-Beispielen zum Thema Text. Jedes Beispiel ist eine kleine QML-Datei, die normalerweise einen bestimmten Typ oder eine bestimmte Funktion enthält oder hervorhebt. Sie können jedes Beispiel ausführen und sein Verhalten beobachten.

Hallo

Hello zeigt, wie man den Buchstabenabstand einer Text -Schrift ändern und animieren kann. Es verwendet eine sequenzielle Animation, um zunächst die Eigenschaft font.letterSpacing über drei Sekunden von 0 auf 50 zu animieren und dann den Text an eine zufällige Position auf dem Bildschirm zu verschieben:

            SequentialAnimation on font.letterSpacing {
                loops: Animation.Infinite
                NumberAnimation {
                    from: 0
                    to: 50
                    easing.type: Easing.InQuad
                    duration: 3000
                }
                ScriptAction {
                    script: {
                        container.y = (screen.height / 4) + (Math.random() * screen.height / 2)
                        container.x = (screen.width / 4) + (Math.random() * screen.width / 2)
                    }
                }
            }

Schriftarten

Fonts zeigt verschiedene Möglichkeiten der Verwendung von Schriftarten mit dem Typ Text. Einfach durch den Namen, indem Sie die Eigenschaft font.family direkt verwenden:

            font.family: "Times"

oder unter Verwendung von FontLoader und Angabe einer lokalen Schriftartdatei:

    FontLoader {
        id: localFont
        source: "content/fonts/tarzeau_ocr_a.ttf"
    }

oder schließlich unter Verwendung von FontLoader und Angabe einer entfernten Schriftartdatei:

    FontLoader {
        id: webFont
        source: "http://www.princexml.com/fonts/steffmann/Starburst.ttf"
    }

Verfügbare Schriftarten

Verfügbare Schriftarten zeigt, wie das globale Objekt Qt und eine Listenansicht verwendet werden, um alle auf dem System verfügbaren Schriftarten anzuzeigen. Der Typ ListView verwendet die Liste der verfügbaren Schriftarten als Modell:

        model: Qt.fontFamilies()

Innerhalb des Delegaten wird die Schriftfamilie mit den modelData festgelegt:

                font.family: parent.modelData

Banner

Banner ist ein einfaches Beispiel, das zeigt, wie man ein Banner mit einer Reihe von Texttypen und einem NumberAnimation erstellt.

Img-Tag

Das Img-Tag zeigt verschiedene Möglichkeiten der Darstellung von Bildern in Textobjekten unter Verwendung des <img> -Tags.

Text-Layout

Text Layout zeigt, wie man ein komplexeres Layout für ein Textelement erstellen kann. In diesem Beispiel wird der Text in zwei Spalten angeordnet, wobei der onLineLaidOut-Handler verwendet wird, mit dem Sie jede Zeile positionieren und in der Größe verändern können:

        onLineLaidOut: (line) => {
            line.width = width / 2  - main.margin

            if (line.y + line.height >= height) {
                line.y -= height - main.margin
                line.x = width / 2 + main.margin
            }

            if (line.isLast) {
                lastLineMarker.x = line.x + line.implicitWidth
                lastLineMarker.y = line.y + (line.height - lastLineMarker.height) / 2
            }
        }

Beispielprojekt @ code.qt.io