Exemple de discours rapide

L'exemple de discours rapide lit un texte fourni par l'utilisateur.

Capture d'écran montrant un outil de synthèse vocale avec des options permettant de changer le moteur, la localisation, la voix, le volume, la hauteur et le débit.

L'exemple Quick Speech montre comment le type TextToSpeech peut être utilisé dans une application pour lire un texte et contrôler la parole. Qt Quick pour lire un texte et contrôler le discours.

L'exemple utilise Qt Quick Controls pour contrôler la hauteur, le volume et le débit de la parole. Il permet également à l'utilisateur de sélectionner un moteur, une langue et une voix.

Initialisation d'un TextToSpeech

Nous commençons par initialiser l'objet TextToSpeech tts:

    TextToSpeech {
        id: tts
        volume: volumeSlider.value
        pitch: pitchSlider.value
        rate: rateSlider.value

Obtenir l'état

Les cas de commutation sont utilisés pour mettre à jour l'étiquette statusLabel dans le pied de page.

        onStateChanged: updateStateLabel(state)

        function updateStateLabel(state)
        {
            switch (state) {
                case TextToSpeech.Ready:
                    statusLabel.text = qsTr("Ready")
                    break
                case TextToSpeech.Speaking:
                    statusLabel.text = qsTr("Speaking")
                    break
                case TextToSpeech.Paused:
                    statusLabel.text = qsTr("Paused...")
                    break
                case TextToSpeech.Error:
                    statusLabel.text = qsTr("Error!")
                    break
            }
        }

Mise en évidence des mots au fur et à mesure qu'ils sont prononcés

L'objet TextArea input est utilisé pour obtenir le texte à saisir et le signal onSayingWord comme déclencheur, ainsi que pour connaître la position de mise en évidence des mots au fur et à mesure qu'ils sont prononcés.

        onSayingWord: (word, id, start, length)=> {
            input.select(start, start + length)
        }

Le TextArea input est déclaré ici :

    ColumnLayout {
        anchors.fill: parent
        anchors.margins: 8
        id: inputForm

        TextArea {
            id: input
            wrapMode: TextEdit.WordWrap
            text: qsTr("Hello, world!")
            Layout.fillWidth: true
            Layout.minimumHeight: implicitHeight
            font.pointSize: 24
        }

Contrôle de la parole

Button Les types d'appareils sont disposés avec un RowLayout et configurés pour contrôler le TextToSpeech tts .

Le bouton "parler

Un site Button intitulé "Speak" est créé. Il est activé si la propriété d'état de tts est soit Paused, soit Ready. Lorsque le bouton est cliqué, les voix disponibles sur les dispositifs cibles sont récupérées et tts.voice est réglé sur la voix actuellement sélectionnée de voicesComboBox. Ensuite, TextToSpeech::say() est appelé et reçoit le texte dans inputbox.

        RowLayout {
            Button {
                text: qsTr("Speak")
                enabled: [TextToSpeech.Paused, TextToSpeech.Ready].includes(tts.state)
                onClicked: {
                    let voices = tts.availableVoices()
                    tts.voice = voices[voicesComboBox.currentIndex]
                    tts.say(input.text)
                }
            }

Les boutons de pause, de reprise et d'arrêt

La mise en œuvre de ces boutons est similaire à celle du bouton Speak:

            Button {
                text: qsTr("Pause")
                enabled: tts.state == TextToSpeech.Speaking
                onClicked: tts.pause()
                visible: tts.engineCapabilities & TextToSpeech.Capabilities.PauseResume
            }
            Button {
                text: qsTr("Resume")
                enabled: tts.state == TextToSpeech.Paused
                onClicked: tts.resume()
                visible: tts.engineCapabilities & TextToSpeech.Capabilities.PauseResume
            }
            Button {
                text: qsTr("Stop")
                enabled: [TextToSpeech.Speaking, TextToSpeech.Paused].includes(tts.state)
                onClicked: tts.stop()
            }

Sélection des options de synthèse vocale

Un site GridLayout est utilisé pour organiser les commandes et les étiquettes permettant de sélectionner les options de moteur, de locale, de voix, de volume, de hauteur et de débit pour la synthèse vocale.

Sélection du moteur, de la locale et de la voix

Un groupe de composants ComboBox est utilisé pour sélectionner ces paramètres.

Pour la sélection du moteur, ComboBox, tts.availableEngines() est utilisé comme modèle.

L'adresse onActivated déclenche l'attribution à tts.engine du texte actuel à l'index actuel des ComboBox.

            Label {
                text: qsTr("Engine:")
            }
            ComboBox {
                id: enginesComboBox
                Layout.fillWidth: true
                model: tts.availableEngines()
                onActivated: {
                    tts.engine = textAt(currentIndex)
                    updateLocales()
                    updateVoices()
                }
            }

Les deux dernières lignes de l'extrait de code ci-dessus montrent que les locales et les voix disponibles sont également mises à jour à ce stade, car elles dépendent du moteur sélectionné. Ces fonctions sont abordées dans la section suivante.

La fonction localesComboBox est mise en œuvre de la même manière que engineComboBox, mais sans mise à jour des moteurs disponibles.

            Label {
                text: qsTr("Locale:")
            }
            ComboBox {
                id: localesComboBox
                Layout.fillWidth: true
                onActivated: {
                    let locales = tts.availableLocales()
                    tts.locale = locales[currentIndex]
                    updateVoices()
                }
            }
            Label {
                text: qsTr("Voice:")
            }
            ComboBox {
                id: voicesComboBox
                Layout.fillWidth: true
            }

Sélection du volume, de la hauteur et de la vitesse

Ces commandes sont mises en œuvre avec Sliders de la manière suivante :

            Label {
                text: qsTr("Volume:")
            }
            Slider {
                id: volumeSlider
                from: 0
                to: 1.0
                stepSize: 0.2
                value: 0.8
                Layout.fillWidth: true
            }
            Label {
                text: qsTr("Pitch:")
            }
            Slider {
                id: pitchSlider
                from: -1.0
                to: 1.0
                stepSize: 0.5
                value: 0
                Layout.fillWidth: true
            }
            Label {
                text: qsTr("Rate:")
            }
            Slider {
                id: rateSlider
                from: -1.0
                to: 1.0
                stepSize: 0.5
                value: 0
                Layout.fillWidth: true
            }
        }
    }

Mise à jour des options disponibles

En utilisant le signal Component.onCompleted, les opérations suivantes sont effectuées une fois que la racine ApplicationWindow a été instanciée.

L'index enginesComboBox est remplacé par le moteur actuellement défini pour tts.
Les locales et les voix disponibles sont mises à jour.
L'état actuel de tts est signalé.

    Component.onCompleted: {
        enginesComboBox.currentIndex = tts.availableEngines().indexOf(tts.engine)
        // some engines initialize asynchronously
        if (tts.state == TextToSpeech.Ready) {
            engineReady()

Utilisées tout au long de l'application, les fonctions updateLocales() et updateVoice() sont mises en œuvre comme suit :

        } else {
            tts.stateChanged.connect(root.engineReady)
        }

        tts.updateStateLabel(tts.state)
    }

    function engineReady() {
        tts.stateChanged.disconnect(root.engineReady)
        if (tts.state != TextToSpeech.Ready) {
            tts.updateStateLabel(tts.state)
            return;
        }
        updateLocales()
        updateVoices()
    }

    function updateLocales() {
        let allLocales = tts.availableLocales().map((locale) => locale.nativeLanguageName)
        let currentLocaleIndex = allLocales.indexOf(tts.locale.nativeLanguageName)
        localesComboBox.model = allLocales
        localesComboBox.currentIndex = currentLocaleIndex
    }

    function updateVoices() {
        voicesComboBox.model = tts.availableVoices().map((voice) => voice.name)
        let indexOfVoice = tts.availableVoices().indexOf(tts.voice)
        voicesComboBox.currentIndex = indexOfVoice

Exécution de l'exemple

Pour exécuter l'exemple à partir de Qt Creatorouvrez le mode Welcome et sélectionnez l'exemple à partir de Examples. Pour plus d'informations, voir Qt Creator: Tutoriel : Construire et exécuter.

Exemple de projet @ code.qt.io

© 2026 The Qt Company Ltd. Documentation contributions included herein are the copyrights of their respective owners. The documentation provided herein is licensed under the terms of the GNU Free Documentation License version 1.3 as published by the Free Software Foundation. Qt and respective logos are trademarks of The Qt Company Ltd. in Finland and/or other countries worldwide. All other trademarks are property of their respective owners.