スポンサーリンク

pythonでGUI画面を作成する(その3)~Sizer編~

スポンサーリンク

■概要

pythonを使ったツールの作成をするために、GUI画面を作成します。
今回は「wxPython」を使って画面の生成を行います。

「pythonでGUI画面を作成する(その2)」では、パネルを作成しました。
前回まではサイズや配置を絶対座標でしましたが、フレームのサイズに応じて変化させられるように、Sizerを利用していきます。

■環境

OS:windows10
ツール:wxPython
言語:python3.6

■Sizerの実装

Sizerを利用してパネルの配置をしてみます。
下記のサンプルコードを実行すると、フレームに応じたパネルが表示ができます。

import wx

#アプリケーションの初期化 
application = wx.App()

#Frameの生成
#引数は(親ウィンドウ,識別子,タイトル)
frame = wx.Frame(None, wx.ID_ANY, 'テストフレーム',size=(300, 300)) 

#パネル(赤)を生成 
r_panel = wx.Panel(frame, wx.ID_ANY) 
r_panel.SetBackgroundColour('#FF0000') 

#パネル(緑)を生成 
g_panel = wx.Panel(frame, wx.ID_ANY) 
g_panel.SetBackgroundColour('#00FF00') 

#パネル(青)を生成 
b_panel = wx.Panel(frame, wx.ID_ANY) 
b_panel.SetBackgroundColour('#0000FF') 

#Sizerで横並びに配置
layout = wx.BoxSizer(wx.HORIZONTAL)

#Sizerにパネルを追加
#引数は(追加対象,リサイズの有無(1or0),配置方法)
layout.Add(r_panel,1,wx.EXPAND)
layout.Add(g_panel,1,wx.EXPAND)
layout.Add(b_panel,1,wx.EXPAND)

#FrameにSizerを紐づける
frame.SetSizer(layout)

#Frameの可視化 
frame.Show() 

#イベントの待ち受け状態への遷移 
application.MainLoop() 

#Sizerで縦並びに配置
layout = wx.BoxSizer(wx.VERTICAL)

■Sizerの種類

  • BoxSizer
    縦もしくは横に連続して配置します。
  • StaticBoxSizer
    縦もしくは横に連続して配置し、ラベル付きボーダーで囲みます。
#StaticBoxを初期化
#引数は(親ウィンドウ,識別子,タイトル)
box = wx.StaticBox(frame,wx.ID_ANY, 'test1')

#StaticBoxSizerでboxを横並びに配置
layout = wx.StaticBoxSizer(box,wx.HORIZONTAL)

  • GridSizer
    マス目上に配置します。(全てのマスは同じ大きさ)
#GridSizerを初期化
#引数は(行,列,余白)
layout = wx.GridSizer(rows=2, cols=2, gap=(0,0))

  • FlexGridSizer
    マス目上に配置します。(それぞれのマスの大きさを変更可能)
#GridSizerを初期化
#引数は(行,列,余白)
layout = wx.FlexGridSizer(rows=2, cols=2, gap=(0,0))

#1行目をサイズ変更する
layout.AddGrowableRow(0)
#2列目をサイズ変更する
layout.AddGrowableCol(1)

■配置の詳細制御

layout.Addのオプションについて記載します。

#引数(対象,配置 | 配置の詳細)
layout.Add(button_5, flag=wx.SHAPED | wx.ALIGN_TOP)

【配置】
割り当てられた横幅に対して、アイテムのをどちらの縁に合わせるかを指定する。ALLは HORIZONTAL または、VERTICAL の指定方向だけで、wx.EXAND の場合は、指定方向に関係なく全方位。

  • wx.TOP
  • wx.BOTTOM
  • wx.LEFT
  • wx.RIGHT
  • wx.ALL

アイテムをすべての方向に対してフィットさせる。

  • wx.EXPAND

縦横の比率を維持したまま、できるだけ大きいサイズでフィットさせる。

  • wx.SHAPED

自動的に最適値として計算された最小の大きさのまま固定。

  • wx.FIXED_MINSIZE

【配置の詳細】
割り当てられたスペースの中での配置方法の指定。

  • wx.ALIGN_CENTER
  • wx.ALIGN_LEFT
  • wx.ALIGN_RIGHT
  • wx.ALIGN_TOP
  • wx.ALIGN_BOTTOM
  • wx.ALIGN_CENTER_VERTICAL
  • wx.ALIGN_CENTER_HORIZONTAL

コメント

タイトルとURLをコピーしました