Hello World in PySide and Qt Quick/ja

From Qt Wiki
Jump to: navigation, search
This article may require cleanup to meet the Qt Wiki's quality standards. Reason: Auto-imported from ExpressionEngine.
Please improve this article if you can. Remove the {{cleanup}} tag and add this page to Updated pages list after it's clean.

日本語 English 한국어

はじめてのPySideとQtQuick/QMLアプリケーション

QMLは、プログラムのユーザーインターフェイスの見た目と動作の両方を記述するために設計された宣言型言語です。QMLでは、プロパティを持つオブジェクトのツリーでユーザーインターフェイスを定義します。このチュートリアルでは、PySideとQMLを使った簡単なHello Worldアプリケーションの作り方を紹介します。

PySide/QMLアプリケーションは、最低2つのファイルから構成されます。一つはユーザーインターフェースのQML定義ファイル、そしてそのqmlファイルを読み込むpythonファイルです。当面、問題を避けるため、両方のファイルを同じフォルダに保存するようにします。

以下は簡単なQMLファイルの例です。 view.qml とします。

import Qt 4.7
 
Rectangle {
 width: 200
 height: 200
 color: "red"
 
Text {
 text: "Hello World"
 anchors.centerIn: parent
 }
}

まずQt 4.7のインポートから開始します。QtQuickはQt/PySideと異なるビルドスケジュールで進行しているので、近い将来、インポート文を import QtQuick 1.0 に変更しなければならないでしょう。今のところはこのままで動作します。

残りのコードは、HTMLやXMLファイルに慣れている人にとってはかなり易しいでしょう。基本的にはサイズ200 * 200の赤い四角形を作成し、その長方形の中で Hello World を表示するテキスト要素を追加します。コード anchors.centerIn:parent は、テキストをその直近の親の、相対的な中心に表示します。

では、このコードがPySide上でどうなるのか見てみましょう。 main.py とします。

#!/usr/bin/python
# -'''- coding: utf-8 -'''-
 
import sys
from PySide.QtCore import *
from PySide.QtGui import *
from PySide.QtDeclarative import QDeclarativeView
 
# Create Qt application and the QDeclarative view
app = QApplication(sys.argv)
view = QDeclarativeView()
# Create an URL to the QML file
url = QUrl('view.qml')
# Set the QML file and show
view.setSource(url)
view.show()
# Enter Qt main loop
sys.exit(app.exec_())

PySideを理解していて、これまでのチュートリアルを辿ってきた方なら、以上のコードのほとんどはもうご存知でしょう。ここで唯一目新しいのは、QDeclarativeViewをインポートして、QDeclarativeViewオブジェクトのソースにQMLファイルのURLを設定することです。その後、Qtウィジェットと同じように、 QDeclarativeView.show() をコールします 。

ヒント: デスクトップ向けのプログラミングをしているなら、viewの表示の前に、 view.setResizeMode(QDeclarativeView.SizeRootObjectToView) の追加を検討する必要があるでしょう。このコードは、外側のQML長方形のサイズを、外側のウィンドウと一緒に変更するように強制します。