2014/08/06

【PySide】横レイアウト/ラジオボタン/仕切り

vol.3では伊藤達弘さん(a.k.a takkun)が取り上げてくれている「PySide」ですが、調べているとけっこうな確率でこちらのブログにたどり着きます(▼)

mtazmi-lab
http://mtazmi-lab.blogspot.jp


その中でも先日、下記の記事に非常に助けられました。

[PySide] UIからいろいろな値を取ろう @mtazmi-Lab
http://mtazmi-lab.blogspot.jp/2013/01/pysidegetvalue.html

シンプルかつ丁寧で、素晴らしい情報に感謝。
ここでは、その記事内容を受けて、そこに載っていない内容を補足してみたいと思います。
具体的には下記

【補足する内容】
  • 横レイアウト
  • ラジオボタンのグルーピング
  • 仕切り線（ディスプレイウィジェット＞ライン）

ちなみ PySide についですが……

「Qt」というGUI/アプリケーション構築用のライブラリがあるんですが
クロスプラットフォームかつ多機能ということで、
多くの言語から使えるようにいろいろ取り組まれています。
Python版も3つほど(!?)あるんですが、
PySideはそのうちのひとつです。

ちなみにPython版Qt三兄弟は、具体的には以下。
PyQt : http://www.riverbankcomputing.com/software/pyqt/intro
（要は、リバーバンク社版です）
PySide : http://qt-project.org/wiki/PySide
（上の子よりは「公式」感のあるPythonバインディング）
PythonQt : http://pythonqt.sourceforge.net/
http://pythonqt.sourceforge.net/Features.html#Comparison

それぞれの違いがよく話題になりますが、ここでは触れません。
特に前二者を比べたものはよく見かける気がしますね。最後のお方はﾇｰﾝ…


＝＝＝＝＝

さて。
あらためて、まずはもと記事を存分にお楽しみの上で、
下記はそのあとお時間あればご覧下さい。


横レイアウト

まず横レイアウトについて。
先ほどの記事で取り上げられているのは、縦レイアウト『QtGui.QVBoxLayout()』です。
横レイアウトは、『QtGui.QHBoxLayout()』
V (= Vertical)が H (= Horizontal)に変わっただけですね。

使い方も同様。
なんか変数に入れてあげて、
QtGuiに収録されているウィジェットを足す場合は .addWidget() 。
普通に使う場合には .setLayout() に入れてあげるっていうところも、元記事と同様。

レイアウトの中にレイアウトを入れ子にすることも出来ます。
レイアウトオブジェクトに .addLayout() というメソッドがあるので、
引数に、入れ子にしたいレイアウトを与えてあげます。
こんな感じ。

self.myVLayout = QtGui.QVBoxLayout()
self.setLayout( self.layout )

self.myHLayout = QtGui.QHBoxLayout()
###〜〜なんだかんだ〜〜###
self.myVLayout.addLayout( self.myHLayout )



ラジオボタン グルーピング

つぎ、ラジオボタンのグルーピングです。
一つのUIに複数ラジオボタンを置くと、
自動的に「そのうち一つしか選択できない」ラジオボタンらしい動作になります。
でも、当然「こいつとこいつはAの指定、こいつらはBの指定」みたいに、
UI上に複数あるラジオボタンを意味合いで分けたい時はあると思います。
（そんなときにまで「そのうちから一つ」っていう動きでは困ります）

というわけで、こんな感じ。

        # ラジオボタンA
        self.radio_a = QtGui.QRadioButton('A')
        self.myHLayout.addWidget(self.radio_a)
        # ラジオボタンB
        self.radio_b = QtGui.QRadioButton('B')
        self.myHLayout.addWidget(self.radio_a)
        # ラジオボタンC
        self.radio_c = QtGui.QRadioButton('C')
        self.myHLayout.addWidget(self.radio_a)
        # ラジオボタンD
        self.radio_d = QtGui.QRadioButton('D')
        self.myHLayout.addWidget(self.radio_a)
        
        ###グループ化するよ
        #グループA
        self.group_a = QtGui.QButtonGroup()
        self.group_a.addButton(self.radio_a,1)
        self.group_a.addButton(self.radio_b,2)
        #グループB
        self.group_b = QtGui.QButtonGroup()
        self.group_b.addButton(self.radio_c,3)
        self.group_b.addButton(self.radio_d,4)

とりあずラジオボタンを四つ作って、さっき作った横レイアウト「myHLayout」に組み込んで行っています。
それから、「QtGui.QButtonGroup()」にてグループを作成し、
そこに .addButton() メソッドをつかってボタンをつっこんでいます。
ちなみに.addButton()の第一引数はグループに加えたいボタン、第二引数は、そのボタンのIDを指定したいときに与えてあげます。とくに意図が無ければ入力しなくてよいみたいです。勝手に割り振られますので。

ユーザーの操作結果は以下のようにして取得します。
        print 'group A result :', self.group_a.checkedButton()
        print 'group A result(ID) : ', self.group_a.checkedId()

ラジオボタンのグループ化については以上です。

仕切り

最後に、UIに表示させる仕切り線。
       ### ラインを足してみる
        self.line = QtGui.QFrame()
        self.line.setFrameStyle( QtGui.QFrame.HLine|QtGui.QFrame.Sunken )
        self.myVLayout.addWidget( self.line )

はい。QLineとかで探してたんですが、QtGui.QFrame() を使うんですね。
線の見た目を調整するには .setFrameStyle() メソッドを使います。
なんか引数に「パイプ（ | ←これ）でつないだなにか」を渡すのがナカナカですね。
その辺の詳細に付いてはこちらのドキュメントを。
QFrame　URL : http://srinikom.github.io/pyside-docs/PySide/QtGui/QFrame.html#detailed-description


……というわけで、

  • 横レイアウト
  • ラジオボタンのグルーピング
  • 仕切り線（ディスプレイウィジェット＞ライン）

について書いてみました。
元記事のブログ「mtazmi-Lab」さんには、ほかにも素敵なPySide記事があって
大変読み応えがありますので、ぜひぜひ

〜〜〜〜〜〜〜〜

さて、
多分いまごろ絶賛印刷中(?)のvol.3「萌えるCG読本」ですが、冒頭でも触れたように伊藤達弘さんのPySide記事が載ってます。
前半がMayaに搭載されている「PyMEL」について、後半がPySideについての記事になっています。後半では、Maya特有のUI要素をPySide内で使うには？というテーマをトリッキーに解説。乞うご期待です！

> vo.3 特設ページできました - こちら



時刻:
ラベル: , , ,

0 件のコメント:

コメントを投稿

登録: コメントの投稿 (Atom)