한국어
Qt
 

Qt 6 Qt 6의 C++ 프로퍼티 바인딩 예제

makersweb 2021.11.01 21:59 조회 수 : 845

이 게시물에서는 Qt 6.0에 추가된 C++ 바인딩 기능을 잘 사용하는 방법을 설명하고 간단한 예제를 제공한다.

다음의 간단한 클래스와 같이 QBindable<int>를 반환하는 새로운 bindableX() 메서드를 추가하고 Q_PROPERTY 매크로에서 메타 개체 시스템에 이에 대해 알렸다. Qt 6.0부터 BINDABLE 을 사용하여 바인딩 가능한 속성을 지정할 수 있다.

myobject.h

#include <QObject>

class MyObject : public QObject
{
    Q_OBJECT
    Q_PROPERTY(int x READ x WRITE setX BINDABLE bindableX)

public:
    explicit MyObject(QObject *parent = nullptr);
    int x() { return xData; }
    void setX(int x) { xData = x; }
    QBindable<int> bindableX() { return &xData; }

signals:
    void xChanged();

private:
    // Qt5에서는 아래 줄이 "int xData;" 였다.
    Q_OBJECT_BINDABLE_PROPERTY(MyObject, int, xData, &MyObject::xChanged)

};

Qt 6 이전에 setter의 구현은 새 값과 기존 값을 비교하여 다를 경우에만 클래스 멤버변수를 업데이트하고 시그널을 방출했다. Qt 6.0 이상에서는 이 동일한 기능이 한 줄만 포함하도록 단순화되었다. 현재 값과 새 값에 대한 비교가 API 코드에서 수행되기 때문이다.

바인딩을 설정하거나 알림을 등록할 수 있다. 예를 들어 다음의 예제처럼 setBinding() 호출하여 MyObject의 x 속성에 대한 바인딩을 설정한다. 또 onValueChanged() 를 통해 속성 값이 변경될 때마다 호출되는 콜백을 등록할 수 있다. 여기서는 myobject1의 x 값이 변경되면 myobject2에 설정된 바인딩을 제거하도록했다.

main.cpp

...
#include "myobject.h"

int main(int argc, char *argv[])
{
...
    MyObject myobject1;
    MyObject myobject2;

    // 'x'프로퍼티 값 설정.
    myobject1.setX(50);

    // myobject1 의 'x'프로퍼티를 myobject2 의 'x'프로퍼티에 바인딩.
    myobject2.bindableX().setBinding([&](){
        return myobject1.x() + 50;
    });

    auto h1 = myobject1.bindableX().onValueChanged([&](){
        qDebug() << "myobject1 'x' Changed.";
        qDebug() << myobject2.bindableX().hasBinding();

        // 현재 설정된 바인딩을 제거.
        myobject2.bindableX().takeBinding();

        qDebug() << myobject2.bindableX().hasBinding();
    });

    QQmlApplicationEngine engine;
...
    // QML에 노출시킴.
    engine.rootContext()->setContextProperty("myobject1", &myobject1);
    engine.rootContext()->setContextProperty("myobject2", &myobject2);
...
}

Rectangle 의 width 는 myobject2 의 x 에 바인딩 되었으며 height 은 width 와 같다. Rectangle 영역을 마우스로 클릭하면 myobject1 의 x 값을 10 증가 시키도록했다.

main.qml

...
    Rectangle {
        width: myobject2.x // myobject2 의 'x'프로퍼티 바인딩.
        height: width

        border.width: 1

        anchors.centerIn: parent

        onWidthChanged: console.log("width:", width)
        onHeightChanged: console.log("height:", height)

        MouseArea {
            anchors.fill: parent
            onClicked: {
                myobject1.x += 10 // myobject1의 'x'값을 10 증가시킴.
            }
        }
    }
...

사각형을 클릭하면 시각적으로 어떻게 변하는지 알 수 있으며 콘솔 출력은 다음과 같다

qml: width: 100
qml: height: 100
qml: width: 110
qml: height: 110 
true 
myobject1 'x' Changed. 
false
번호 제목 글쓴이 날짜 조회 수
공지 Qt프로그래밍(QtQuick) Beginner를 위한 글 읽는 순서 운영자 2019.01.05 85342
176 가상키보드(Qt Virtual Keyboard)를 사용하는 방법 [32] file makersweb 2019.05.03 219953
175 콘솔에서 사용자 입력받기 file makersweb 2020.03.22 51789
174 QString 문자열 다루기 예제 운영자 2019.01.26 39601
173 Windows에서 Qt 설치 따라하기 file makersweb 2019.10.14 30790
172 Qt의 시그널 슬롯 시스템 file makersweb 2015.10.20 23429
171 QThread 소개 및 예제 makersweb 2019.12.25 19229
170 QtCreator Design으로 GUI만들기 (QML로 만드는 Hello World -2) [1] file makersweb 2019.05.26 14767
169 초보자를 위한 첫번째 프로젝트 - QML로 만드는 Hello World file makersweb 2018.03.16 14357
168 Qt 프로그래밍의 시작 makersweb 2015.10.25 14322
167 Qml과 C++로 구현하는 GUI어플리케이션 file makersweb 2018.12.25 13828
166 QML과 QtQuick 모듈 개념과 기본 타입들 makersweb 2019.04.26 13322
165 Windows에서 라즈베리파이3용 Qt5.10.0 크로스컴파일 [20] file makersweb 2018.02.23 12716
164 Qt의 오픈소스 라이센스 소개 file makersweb 2019.12.15 12377
163 Qml 기본 컴포넌트 강좌 (1) file makersweb 2019.01.03 11976
162 QtSerialPort를 사용한 시리얼(Serial)통신 [3] makersweb 2019.05.21 11754
161 Qt Installer Framework - 패키징, 설치프로그램 제작 file makersweb 2018.10.14 11598
160 Qt 응용프로그램 배포(windows) file makersweb 2018.10.10 11165
159 Ubuntu Linux에서 Qt Creator 설치 file makersweb 2016.03.06 10647
158 Qt의 스레드간 시그널 슬롯의 커넥션타입 [1] makersweb 2015.10.24 10103
157 QML 강좌 - 동적 Listing (ListView) file makersweb 2019.06.01 10029