한국어
Qt
 

QML and Qt Quick QML 바인딩 끊김 진단

makersweb 2020.11.08 18:57 조회 수 : 266

속성(프로퍼티) 바인딩은 QML 언어의 가장 흥미로운 기능 중 하나다. QML에서 속성(프로퍼티)에 값을 설정하면 일반적인 명령형 언어처럼 오른쪽 표현식은 단지 한 번 연산하여 값을 산출하지 않는다. 특히 표현식에 다른 속성이 포함 된 경우 설정중인 속성이 표현식의 속성에 바인딩 된다. 값을 변경할 때마다 표현식이 자동으로 다시 산출되고 대상 속성 값이 업데이트된다.

 
예를 들면 :
import QtQuick 2.0

Rectangle {
    width: 100; height: 100

    // 바인딩:
    color: mouseArea.containsMouse ? "red" : "blue"

    MouseArea {
        id: mouseArea;
        anchors.fill: parent;
        hoverEnabled: true
    }
}
위의 코드에서 Rectangle 의 색상(color)은 바인딩의 대상이며, 내부 MouseArea 의 마우스 속성에 바인딩 된다. 마우스 포인터가 MouseArea 내부 또는 외부로 이동하면 mouse 속성이 변경되어 색상에 대한 표현이 다시 산출된다. 즉, 직사각형은 마우스 커서가 그 위를 맴돌면 빨간색이 되고, 그렇지 않으면 파란색이 된다.
 
속성 바인딩을 사용하면 매우 선언적인 방식으로 UI를 빌드 할 수 있다. 다른 속성이 값을 변경할 때 UI 요소를 업데이트하기 위해 "슬롯"을 작성할 필요가 없다.
 
오른쪽에 쓸 수 있는 표현식은 함수 호출을 포함하더라도 얼마든지 복잡할 수 있다. 엔진은 가능한 모든 작업을 할 것이고, 예상대로 바인딩을 할 것이다.
 
 
속성 바인딩 끊김
속성(프로퍼티) 바인딩에는 다음과 같은 제한이 있다. 속성에 값을 설정하기 위해 명령형 할당을 사용하는 경우 바인딩이 끊어진다. 예를 들어 사각형을 클릭 할 때 녹색으로 바뀌기를 원한다고 가정하자. 
 
다음과 같다:
import QtQuick 2.0

Rectangle {
    width: 100; height: 100

    // 이것은 여전히 바인딩.
    color: mouseArea.containsMouse ? "red" : "blue"

    MouseArea {
        id: mouseArea
        anchors.fill: parent
        hoverEnabled: true
        onClicked: {
            parent.color = "green" // 바인딩이 끊어짐
        }
    }
}
onClicked 신호 처리기에서 명령형 JavaScript 코드의 일반 할당을 사용하여 color 속성을 녹색으로 설정한다. 이 코드를 사용하여 사각형을 클릭 한 다음 마우스를 사각형 위로 이동하면 사각형이 더 이상 색상이 변경되지 않고 녹색으로 유지된다. 이는 명령형 할당이 바인딩을 파괴하고 color 속성을 하나의 특정 값으로 설정하기 때문에 발생한다.
 
일반적으로 위의 예는 문서화 된 QML 규칙을 따르는 100% 정확한 QML 코드다. 따라서 이러한 코드가 QML 엔진에 의해 거부되거나 무조건 경고를 발생시켜야 한다고 할 수는 없다. 
 
끊어진 바인딩은 항상 우연히 (리팩토링 중, 원래 속성이 무언가에 바인딩되어 있다는 사실을 인식하지 못함) 또는 (더 선언적인 접근 방식을 사용하는 대신) 상태를 관리하기 위해 JavaScript를 과도하게 사용하여발생한다. 이런경우, 일반적으로 QML 소스 코드를 읽을 때 문제가 무엇인지 명확하지 않기 때문에 이러한 문제를 디버깅하는 것은 매우 어려울 수 있다. 버그는 명령형 할당이 포함 된 JavaScript 코드가 실행될 때만 나타날 것이다.
 
 
끊어진 바인딩 디버깅
이러한 사례를 보다 쉽게 추적 할 수 있도록 QML 엔진에는 Qt 5.10 부터 추가된 디버깅 기능이 있다. QML 엔진은 바인딩이 끊어 질 때마다 디버깅 정보를 출력 한다.
디버그 출력을 활성화하려면 QT_LOGGING_RULES 환경변수를 설정하는 방식으로 qt.qml.binding.removal 로깅 범주에 대한 출력을 활성화하면 된다.
export QT_LOGGING_RULES="qt.qml.binding.removal.info=true"
 
위의 예제에 대해서 이제 다음 디버그 메시지를 출력한다.
qt.qml.binding.removal: Overwriting binding on MyItem_QMLTYPE_0::color at qrc:/MyItem.qml:14 that was initially bound at qrc:/MyItem.qml:7:5
 
메시지는 바인딩 된 속성, 바인딩이 설정된 위치 및 바인딩을 중단하는 명령문이 있는 위치를 알려준다.
번호 제목 글쓴이 날짜 조회 수
공지 Qt프로그래밍(QtQuick) Beginner를 위한 글 읽는 순서 운영자 2019.01.05 28546
141 Qt 응용프로그램에서 Lottie Animation사용 file makersweb 2021.05.30 168
140 싱글 샷(Single-Shot) 시그널/슬롯 연결 makersweb 2021.05.12 124
139 응용프로그램 자동실행 설정 (on Windows) makersweb 2021.05.08 107
138 Qt 6 에서 프로퍼티 바인딩 makersweb 2021.04.03 164
137 QML과 JavaScript 의 숫자 관련 내장된 함수 makersweb 2021.03.28 106
136 Qt 5 코드를 Qt 6로 포팅하기 위해 도움이 되는 Clazy Framework file makersweb 2021.03.01 225
135 C++로 작성한 클래스를 QML에서 생성 file makersweb 2021.02.10 670
134 Qt MQTT의 pus/sub 튜토리얼 file makersweb 2021.02.06 323
133 Qt 를 사용하거나 기반으로 하는 응용프로그램 file makersweb 2021.01.30 755
132 Loader를 사용하여 동적으로 QML 로드 makersweb 2021.01.19 379
131 QThread 및 QMutex 예제 makersweb 2021.01.12 307
130 그래픽 소프트웨어에서 디자인 내보내기 (Exporting Designs from Graphics Software) j2doll 2020.12.25 135
129 Qt5Compat 라이브러리를 사용하여 Qt5에서 Qt6로 포팅 [2] makersweb 2020.12.05 264
128 Qt Quick Controls 2에 네이티브 데스크탑 스타일 추가 file makersweb 2020.11.23 176
» QML 바인딩 끊김 진단 makersweb 2020.11.08 266
126 QML과 코루틴(Coroutines) makersweb 2020.11.03 269
125 Qt 6의 비동기 API makersweb 2020.10.19 395
124 QRandomGenerator 클래스를 사용하여 난수(random values) 생성 makersweb 2020.10.17 339
123 Qt 6에서 QList 변경사항 makersweb 2020.10.08 385
122 Qt 6.0의 개발 호스트 및 대상 플랫폼 makersweb 2020.09.16 563