QML

QML コンパイラパイプラインの最適化

Published Tuesday September 18th, 2018 | Leave a comment
Posted in Qt | Tags: , , , , , ,

この記事は The Qt Blog の Optimizing the QML compiler pipeline を翻訳したものです。 執筆: Lars Knoll, 2018年05月22日 Qt QML は Qt Quick でユーザーインターフェースを構築する際のプログラミング言語である QML を実行するためのエンジンです。Qt QML 自体には描画機能に関する依存が一切ありません。このモジュールでは、QML 言語のサポートに加え、ECMAScript 5.1 に準拠した JavaScript のエンジンを提供しています。 Qt Quick というユーザーインターフェース技術の基礎を提供するこのモジュールは、Qt のユーザーに向けた核となるものです。内部的には主に2つの要素で構成されています。QML と ECMAScript をバイナリデータ構造とバイトコード/アセンブリにコンパイルするためのコンパイラパイプラインと、そこで生成されたコードを実行するためのランタイムです。今回の記事は前者についてのものになります。 5.10 まで利用していた Qt QML のコンパイラパイプラインはここ数年の Qt のアップデートでとても複雑になってしまいました。 以下の図は簡易化した以前のコンパイラパイプラインを示したものです。 まず QML と JavaScript のコードを 字句解析器(Lexer) と 構文解析器(Parser) に送り、抽象構文木(AST) というコンパイル用のコードに変換します。この […]

Read More

QML と Qt for Python の連携

Published Saturday September 8th, 2018 | Leave a comment
Posted in Qt for Python | Tags: , ,

この記事は The Qt Blog の QML and Qt for Python interaction を翻訳したものです。 執筆: Friedemann Kleint, 2018年05月14日 QtWidgets というデスクトップのアプリケーション向けの UI 技術に加え、Qt は QML という UI 技術も提供しています。 今回は、Qt for Python で QML をどう使うのかを、declarative/extending/chapter3-bindings を基に大まかに説明をしたいと思います。 まず初めに、.qml ファイルをロードするための基本的な型を見てみましょう。QGuiApplication と QQuickView のインスタンスを生成します。 QML のエレメントがビューのサイズに追従するよう、resizeMode プロパティに SizeRootObjectToView を設定します。 app = QGuiApplication(sys.argv) view = QQuickView() view.setResizeMode(QQuickView.SizeRootObjectToView) その後、ビューの setSource メソッドを使用して QML のロードを行います。 QML […]

Read More

Qt 5.8.0 での QML のパフォーマンスの改善について

Published Wednesday April 5th, 2017 | Leave a comment
Posted in Qt | Tags: , , ,

この記事は The Qt Blog の Qt QML Performance improvements in Qt 5.8.0 を翻訳したものです。 執筆: Alex Blasche, 2017年3月8日 Qt 5.8 では大幅な Qt QML のパフォーマンスの改善がなされました。数人のエンジニアが多くの時間を費やし、どこがどう遅いのか、どう改善できるのかを調べました。これは Qt QML を最初にリリースした時から常に継続していることで、今後もこれは続くでしょう。ある程度の検討を重ねた結果、実際にどういう作業が行われているかをわかりやすくすることにしました。この長期に渡るプロジェクトを通していくつものパフォーマンス関連のツールや社内外のエンジニアによるベンチマークに関するノウハウが蓄積されています。これにより複雑なアレコレを一般化することが可能になりました。 起動時間 Qt 5.6.2 と Qt 5.8.0 で、グラフィカルと非グラフィカルなベンチマークで起動時間を比較してみました。対象のプラットフォームは Windows と Ubuntu、macOS、iMX6 ボード(この中で唯一32bitの環境になります)です。起動時間は以下の Qt の環境で確認しました。 Qt 5.6.2 Qt 5.6.2 + 商用の Qt Quick Compiler (qmlcompiler) Qt 5.8.0 + QML キャッシュなし Qt […]

Read More

Qt 5 向けの新しい QML デモ

Published Thursday July 26th, 2012 | Leave a comment
Posted in Qt Quick | Tags: , ,

この記事は Qt Blog の “New QML demos for Qt 5” を翻訳したものです。 執筆: Alan Alpert, 2012年7月17日 ブリスベンの QML コアチームに、Qt 5 に向けて新しいメンバーが加わりました。やっとチームにデザイナーが加わったことで、QML を最もデザイナーにやさしい UI 言語にするという目標に近づくことができます。この記事ではチームで開発した最新のアプリやゲームのデモビデオを紹介したいと思います。ただ、ビデオで見せることがデモの一番の目的ではありません。これらのデモのソースコードが qt-project.org で BSD ライセンスで公開されています。新しいエキサイティングな機能の裏側にある実装を見て頂くために、ソースコードへのリンクも随所に入れていこうと思います。

Read More

Qt Quick 2 のデバッグ – Console API

Published Thursday March 22nd, 2012 | Leave a comment
Posted in Qt Creator | Tags: , ,

この記事は Qt Blog の “Debugging Qt Quick 2 – Console API” を翻訳したものです。 執筆: Aurindam Jana, 2012年3月1日 Qt Quick はより柔軟でスピーディーな開発が可能になります。これまでは「コンパイル」「パッケージング」「デプロイ」「実行」というサイクルを何度も何度も繰り返す必要がありましたが、Qt Quick では実行中にソースを変更することも可能です。Qt Creator ではバージョンが新しくなるたびに Qt Quick をさらに効果的に使うことができるようにしてきました。しかし、どんなプログラミング言語も完璧ではありません。QML では文法の間違いは実行時のエラーになります。QtDeclarative のバインディングループに悩まされた経験がある方もいると思いますが、JavaScript には嵌りどころがたくさんあります。これらに対しては、デバッガやプロファイラ、インスペクタといった武器で対抗しましょう 🙂 この記事ではデバッグ、特に最も簡単な Console API を使用した手法について紹介します。console.log() メソッドはこの API の一部で、すでにみなさんも helloworld.qml でこの API を使ったことがあると思いますが、使用する機会はとても多いです。少し前に、(ウェブブラウザでのデファクトスタンダードである) FireBug console API を参考に、Qt 5 の API にとても便利なメソッドをいくつか追加しました。 ログの出力 console.log と console.debug は Qt Quick […]

Read More

Qt Graphical Effects プロジェクト

Published Friday February 3rd, 2012 | Leave a comment
Posted in リサーチプロジェクト | Tags: , , ,

この記事は Qt Blog の “Qt Graphical Effects in Qt Labs” を翻訳したものです。 執筆: Sami Lehtonen, 2012年2月2日 はじめに Qt Graphical Effects プロジェクトは Qt Quick 2.0 向けの特定のデザインに依存しないビジュアルエフェクトのセットを提供するために進められています。 現在は20種類以上の QML のグラフィックエフェクト要素が利用可能です。このエフェクトにはブレンド、マスク、ぼかし、色付けをはじめ、様々なコードが含まれています。まだまだ改善や拡張の余地があり、アイデア、フィードバック、提案や、より具体的な貢献はどんなものでも大歓迎です! エフェクトの一覧

Read More

Qt Quick 3D の新しいパッケージができました

Published Thursday September 29th, 2011 | Leave a comment
Posted in リサーチプロジェクト | Tags: , , ,

この記事は Qt Blog の “New Qt Quick3D Packages Available” を翻訳したものです。 執筆: thoughthorizon, 2011年9月19日 「3D 的なものを入れてみない?」と 2009 年に誰かが言ったのがきっかけで、最初は単純な Qt 向けの OpenGL バインディングだったものが、今ではすっかり成熟した Qt モジュールになりました。R&D プロジェクトから「本当の」Qt の一部になるまでは長い道のりでした。だからこそ Qt Quick 3D の 2 度目のテクノロジープレビューを公開できるのはとても嬉しいことです。 このプレビューは前回の 5 月の 発表に続くものです。前回のプレビューから学んだことを取り入れ、Qt Quick 3D をより効率的に、より完全に、そして全体的に(少なくとも私たちの意見では)改善しました。 コミュニティからの継続的で価値のあるフィードバックにお礼を申し上げたいと思います。何よりも Qt Quick 3D の開発を推し進めたのはこうした皆さんとのやり取りであり、これからもそうあり続けるでしょう。ここ4ヶ月ほどの間私たちは皆さんから報告していただいたバグを修正し、全ての主要プラットフォームで 3D フレームワークをより安定させ、拡張する為に努力してきました。現在サポートされているプラットフォームは以下のとおりです。 Symbian Meego 1.2 Harmattan Maemo いつものデスクトップ OS バグの修正に加え以下のような新しい機能も追加しました。

Read More

QML プレゼンテーションシステム

Published Tuesday May 31st, 2011 | Leave a comment
Posted in リサーチプロジェクト | Tags: ,

この記事は Qt Blog の “A QML Presentation System” を翻訳したものです。 執筆: gunnar 2011年5月30日 昨年の Qt Developer Days の準備でプレゼンテーションをとあるツールで作り始めたのですが、いくつか気に入らないところがありました。それで、スライドを QML で作ることにしました。これは QML をさらに学べると同時に、クールにできると思ったからです。そのツールを若干簡略化させて、個人的に納得できるレベルに達しました。おそらくみなさんの中にもそう思ってくれる人がいるでしょう。全てを QML と JavaScript で書いてあるのでコンパイルは必要ありません。 リポジトリ: https://qt.gitorious.org/qt-labs/qml-presentation-system 全ての .qml ファイルは import QtQuick 2.0 を使っているので、qtdeclarative-staging の “qtquick2″ ブランチをビルドした Qt 5 が必要です。 使い方とリポジトリのサンプルを説明したビデオもあります。

Read More

Qt Quick 入門 第10回: プロパティバインディング

Published Wednesday April 27th, 2011 | Leave a comment
Posted in Qt Quick 入門 | Tags: ,

今回は QML の [qt ‘プロパティ’ l=qdeclarativeintroduction m=#properties] とその重要な特徴である「[qt “プロパティバインディング” l=propertybinding]」に関する説明します。 プロパティの設定方法 これまでの連載でもプロパティを使ってきましたが、改めて QML でのプロパティの設定方法についておさらいしてみましょう。 QML では基本的に、各要素のプロパティを以下のように ‘:’ を使って設定します。このプロパティの設定方法は JSON の書式とよく似ています。 Rectangle { width: 360 height: 360 } この例では即値で指定していますが、プロパティに設定できるのは JavaScript の式となります。以下にその例を挙げてみましょう。 Rectangle { x: 10 y: otherItem.y width: 2 * otherItem.width height: Math.max(otherItem.height, 50) color: height > 100 ? “lightgreen” : “lightred” border.width: { if (withBorder) […]

Read More

Qt Quick 入門 第8回: QML の描画処理

Published Thursday March 10th, 2011 | Leave a comment
Posted in Qt Quick 入門 | Tags: ,

今回の「Qt Quick 入門」では、QML の各要素で共通する描画関連の処理やプロパティについて説明していきます。前回の「レイアウト」と合わせて、QML のレイアウトと描画に関する基本をマスターしましょう。 表示の優先順位 今まで、QML の各要素を表示する優先順位については、特に触れてきませんでした。前回の「レイアウト」で説明したような各要素が重ならない場合には、どの要素から描画されても問題ありません。また、親子関係にある要素では、子要素が優先されて前面に表示されます。このあたりは一般的なルールだと思います。 それでは、親子関係にはない複数の要素が互いに重なっていた場合、そのどちらが優先して表示されるのでしょうか。その場合、ソース内で後から定義された要素が優先されて前面に表示されます。たとえば、次の二つのリストを実行してみてください。 // リストA import Qt 4.7 Rectangle { width: 200; height: 200 Rectangle { id: rect1 x: 25; y: 25 width: 100; height: 100 color: “red” } Rectangle { id: rect2 x: 75; y: 75 width: 100; height: 100 color: “green” } } // リストB import Qt […]

Read More
Get started today with Qt Download now