한국어
Qt
 

Qt는 기본적으로 QObject를 기반으로 시그널, 슬롯 시스템으로 동작된다. 이 것은 QML에서도 마찬가지이며 간단한 예제들을 통해 QML내에서 어떻게 사용되는지 알아보자.

 
기본 시그널
모든 qml 아이템은 다음과 같은 기본 시그널들이 있다.
 
completed()
객체가 생성될 때 발생
 
destruction()
객체가 파괴될 때 발생
 
간단한 예제를 보자.
SignalItem.qml
import QtQuick 2.12

QtObject {

}

 

main.qml

import QtQuick 2.13
import QtQuick.Window 2.13

Window {
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")

    // Completed 시그널은 qml객체가 인스턴스화 되면 가장 먼저 발생하며 모든 qml에서 사용 할 수 있다. 
    Component.onCompleted: {
        console.log("Window created.")
    }

    SignalItem{
        id: mySignalItem
        Component.onCompleted: {
            console.log("SignalItem created.")
        }
    }
}

 

결과:

qml: Window created.
qml: SignalItem created.

 

사용자정의 시그널
새로운 시그널을 정의해서 다음과 같이 사용할 수도 있다.
 
SignalItem.qml
import QtQuick 2.12

QtObject {

    // 사용자정의 시그널
    signal signalItemCreated(string name)

    Component.onCompleted: {
        signalItemCreated("SignalItem")
    }
}

 

main.qml

import QtQuick 2.13
import QtQuick.Window 2.13

Window {
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")

    Component.onCompleted: {
        console.log("Window created.")
    }

    SignalItem{
        id: mySignalItem
        onSignalItemCreated: {
            console.log(name + " created.")
        }
    }
}

 

결과:
qml: Window created.
qml: SignalItem created.

 

서로 다른 객체간 시그널과 슬롯을 연결

위의 예제에서는 시그널을 해당객체내에서 처리하였다. 이번에는 QML내에서 객체간 시그널 및 슬롯을 연결하는 방법을 소개한다.

 

QML내에서 객체간 시그널 슬롯을 연결하는 일반적인 방법은 Connections 요소를 사용하는 것이다. 

대상(객체id)을 설정후 다음과 같이 시그널이 발생할 때 시그널을 처리하는 "on<Signal이름>"핸들러를 작성한다.

 

main.qml

import QtQuick 2.13
import QtQuick.Window 2.13

Window {
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")

    Component.onCompleted: {
        console.log("Window created.")
    }

    Connections{
        target: mySignalItem

        onSignalItemCreated:{
            console.log("SignalItem created.")
        }
    }

    SignalItem{
        id: mySignalItem
    }
}

 

결과:
qml: Window created.
qml: SignalItem created.

 

다만 Connections 의 사용에는 몇가지 제약이 있는데 예를들어 하나의 Connections에 같은 시그널 처리 함수를 여러개 만들 수 없고 대상(target) 객체가 사용되는 범위내에서만 사용할 수 있다. (물론 전역 객체의 시그널에 연결하는 건 가능하다.)

 

이번엔 조금더 C++ 스러운 방법을 알아보자.

C++에서 QObject의 connect, disconnect 메서드를 QML에서도 그대로 사용하여 서로 다른 객체간 시그널과 슬롯을 연결 할 수 있다.

 

main.qml

import QtQuick 2.13
import QtQuick.Window 2.13

Window {
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")

    Component.onCompleted: {
        console.log("Window created.")

        // SignalItem의 시그널을 Window에 정의한 슬롯에 연결.
        mySignalItem.signalItemCreated.connect(signalItemCreatedHandler)
    }

    function signalItemCreatedHandler(){
        console.log("SignalItem created.")
    }

    SignalItem{
        id: mySignalItem
    }
}

 

결과:
qml: Window created.
qml: SignalItem created.

 

번호 제목 글쓴이 날짜 조회 수
공지 Qt프로그래밍(QtQuick) Beginner를 위한 글 읽는 순서 운영자 2019.01.05 4528
87 Windows에서 Qt 설치 따라하기 file makersweb 2019.10.14 28
86 Qbs 프로젝트를 정의하기 위해 사용되는 몇가지 중요한 아이템들 file makersweb 2019.10.13 5
85 많은 리소스를 사용하는 Qt프로젝트에서 고려해봐야 할 qmake 옵션 makersweb 2019.10.11 20
84 Qbs에 대한 소개와 설치하는 방법 makersweb 2019.10.09 34
83 OpenGL 렌더링을 QtQuick과 통합하는 방법 file makersweb 2019.10.01 44
» QML내에서의 시그널, 슬롯 시스템 makersweb 2019.09.29 63
81 컨테이너에 적재된 객체를 편리하게 삭제하기 makersweb 2019.09.18 26
80 C++로 구현된 모델을 QML의 ListView에서 참조 file makersweb 2019.09.07 116
79 QSocketNotifier로 파일 디스크립터의 활동감지 makersweb 2019.08.28 342
78 MCU용 Qt에 대해서 makersweb 2019.08.22 313
77 [Qt News] Qt for Python을 위한 기술 비전 j2doll 2019.08.20 83
76 열거형(enum)을 QML에서 사용하는 방법과 문자열(QString)로 얻기 makersweb 2019.08.20 76
75 [Qt News] Qt 6 기술 비전 (Technical vision for Qt 6) [2] j2doll 2019.08.08 168
74 [Qt News] Qt6 Git 개발 초기 단계 시작하기 j2doll 2019.08.02 401
73 [Qt] Google Play의 향후 요구 사항을 준수하는 방법 [1] j2doll 2019.07.29 239
72 Qt기반의 오픈소스 프로젝트들 - 2 운영자 2019.07.21 206
71 QML, 이미지, 폰트등을 바이너리 리소스로 만들기 makersweb 2019.06.24 303
70 Qt Creator에서 임베디드 장치로 deploy설정(Custom Process Step) file makersweb 2019.06.15 148
69 Qt Quick Controls 2사용 및 스타일 설정 file makersweb 2019.06.07 920
68 QML 강좌 - 동적 Listing (ListView) file makersweb 2019.06.01 817