소개

어제는 @task_kr 씨에 의한 Qt 의 값형의 클래스로 사용되고 있는 Implicit Sharing 기술의 소개와 구현 이었습니다.

오늘은 공부회중에 참가할 예정이었습니다만, 가족 일동 컨디션이 나쁘고 캔슬해 버렸습니다. . .

QtWebService란?

q와 ぇb세r 비세. 이오 가 공식 사이트입니다.
개요는 Qt Advent Calendar 2017 5일째의 QtWebService 소개를 봐 주세요.

QtWebService 이미지 지원

지금까지 다양한 텍스트 형식의 데이터를 QML로 기술하는 것을 목표로 해 온 QtWebService입니다만, 여러 사정에 의해 이미지의 동적 생성에 대응했습니다.

hello.qml

import QtWebService.Image 1.0

Image {
    id: root
    width: 100
    height: 100
    contentType: 'image/png'
    source: './qt-logo.png'

    Text {
        y: 70
        text: 'Hello World'
    }
}

이러한 QML을 작성하면 다음 이미지가 생성됩니다.

주의점 QtWebService 이미지 생성 기능을 사용하려면 QtGui 모듈이 필요합니다. QT = webservice QT += gui 그런 다음 QCoreApplication 대신 QGuiApplication 을 사용해야 합니다. 또한 QtQuick 모듈의 Image 및 Text와 같은 이름이지만 전혀 관계없는 요소입니다. 그중 비슷한 속성을 정비할 예정입니다만, 지금은 최저한의 기능 밖에 준비하고 있지 않습니다. 뭐가 기뻐요? 이미지를 생성할 수 있습니다. 옛날 그리운 이미지의 액세스 카운터를 다음과 같은 느낌으로 만드는 것도 가능합니다. counter.qml import QtWebService.Image 1.0 import QtWebService.Cache 1.0 import QtQml 2.2 이미지 { id: 루트 width: 100 height: 30 contentType: 'image/png' Cache { id: cache } Text { id: text y: 20 x: root.width - text.width } Component.onCompleted: { var counter = cache.fetch('counter') counter = counter ? counter + 1 : 1 cache.add('counter', counter) text.text = counter } } 실행 결과:

왜 만들었어?

Google의 Static Maps API 에서 지도에 이미지 마커를 지정할 때 다양한 이미지를 준비하는 것이 번거로웠기 때문에 QtWebService에서 제공한 이미지를 표시하도록 하고 있습니다.

다음과 같은 marker.png를 사용하여,

다음과 같은 코드로 이미지를 생성합니다.

marker.qml

import QtWebService.Image 1.0

Image {
    id: root
    width: 32
    height: 32
    contentType: 'image/png'
    source: './marker.png'

    Text {
        x: (root.width - width) / 2
        y: 22
        text: (new Date).getSeconds()
    }
}

이것을 보면 다음과 같습니다.

실제로 운영하는 (비밀) 서비스는 이미지의 qml에 매개 변수를 전달하여 약간 고급 이미지를 생성합니다. 결론 Qt를 사용하면 웹 서비스에서 동적 이미지를 생성하는 것이 쉽습니다. 아이디어 나름으로 정말 여러가지 일을 할 수 있으므로, 여러가지 일에 활용해 보세요. 내일은 @argama147 씨에 의한 「 지금 들리지 않는 신호 슬롯 총 정리 」입니다. 기대하세요!