Back to Qt.io
Contact Us Blog Download Qt
이 페이지에서

Quick Speech 예제

'Quick Speech' 예제는 사용자가 입력한 텍스트를 음성으로 읽어줍니다.

엔진, 지역, 음성, 볼륨, 음높이, 속도를 변경할 수 있는 옵션이 포함된 텍스트 음성 변환 도구가 표시된 스크린샷

'Quick Speech' 예제는 ' TextToSpeech ' 유형을 Qt Quick 텍스트를 읽어주고 음성 출력을 제어하는 방법을 보여줍니다.

이 예제는 Qt Quick Controls 를 사용하여 음성 피치, 볼륨 및 속도를 제어합니다. 또한 사용자가 엔진, 언어 및 목소리를 선택할 수 있게 해줍니다.

TextToSpeech 초기화

먼저, 텍스트 음성 변환 객체 ` tts`를 초기화합니다:

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

상태 확인

switch-case 문을 사용하여 푸터에 있는 레이블 statusLabel 의 내용을 업데이트합니다.

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

발음되는 단어를 강조 표시하기

TextArea input 는 입력할 텍스트를 가져오고, onSayingWord 신호를 트리거로 사용하며, 단어가 발음될 때 강조 표시할 위치를 파악하는 데 사용됩니다.

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

TextArea ( input )는 다음과 같이 선언됩니다:

    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
        }

음성 제어

Button 타입들은 RowLayout 와 함께 배열되어 있으며, TextToSpeech tts 를 제어하도록 구성되어 있습니다.

말하기 버튼

"Speak"이라는 레이블이 붙은 Button 가 생성됩니다. 이 버튼은 tts 의 state 속성이 Paused 또는 Ready 일 때 활성화됩니다. 버튼을 클릭하면 대상 기기에서 사용 가능한 음성이 검색되며, tts.voice 는 voicesComboBox 에서 현재 선택된 음성으로 설정됩니다. 그런 다음 TextToSpeech::say()가 호출되며, 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)
                }
            }

일시 정지, 재개 및 중지 버튼

이 버튼들은 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()
            }

텍스트 음성 변환 옵션 선택

GridLayout 는 텍스트 음성 변환 합성을 위한 엔진, 로케일, 음성, 볼륨, 피치 및 속도 옵션 선택을 위한 컨트롤과 레이블을 구성하는 데 사용됩니다.

엔진, 로케일 및 음성 선택

이러한 매개변수를 선택하기 위해 일련의 ComboBox 컴포넌트가 사용됩니다.

엔진 선택용 ComboBox 의 경우, 모델로 tts.availableEngines() 이 사용됩니다.

onActivated 는 ComboBox의 현재 인덱스에 있는 텍스트를 tts.engine에 할당하도록 트리거합니다.

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

위 코드 스니펫의 마지막 두 줄은 사용 가능한 로케일과 음성이 선택된 엔진에 따라 달라지기 때문에 이 시점에서 함께 업데이트됨을 보여줍니다. 해당 함수들은 다음 섹션에서 다룹니다.

localesComboBox 는 engineComboBox 와 동일한 방식으로 구현되지만, 사용 가능한 엔진을 업데이트하지는 않습니다.

            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
            }
음량, 음정 및 발화 속도 선택

이러한 제어 기능은 다음과 같이 ` Sliders `를 사용하여 구현됩니다:

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

사용 가능한 옵션 업데이트

Component.onCompleted 신호를 사용하여, 루트 ApplicationWindow 가 인스턴스화되면 다음 작업이 수행됩니다.

  • enginesComboBox 인덱스는 tts 의 현재 설정된 엔진으로 설정됩니다.
  • 사용 가능한 로케일 및 음성이 업데이트됩니다.
  • tts 의 현재 상태가 신호로 전달됩니다.
    Component.onCompleted: {
        enginesComboBox.currentIndex = tts.availableEngines().indexOf(tts.engine)
        // some engines initialize asynchronously
        if (tts.state == TextToSpeech.Ready) {
            engineReady()

애플리케이션 전반에서 사용되는 updateLocales() 및 updateVoice() 함수는 다음과 같이 구현됩니다:

        } 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

예제 실행

다음에서 예제를 실행할 수 있습니다:

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.