Python入門から応用までの学習サイト


GridSizer

BoxSizerと並び、wxPythonの基本的なSizerであるGridSizerです。GridSizerはマス目状に部品を配置します。

まずはパラメータなどを指定せずに部品を追加します。処理の順番は下記の通りです。

  • アプリケーションの初期化  (5行目)
  • フレームの初期化  (10行目)
  • フレームを親としてパネルを初期化  (12行目)
  • 配置するボタンを初期化  (11,12,13,14行目)
  • GridSizerを2列・2行で初期化  (16行目)
  • GridSizerへボタンの追加  (17,18,19,20行目)
  • パネルへGridSizerをセット  (22行目)

※ 配置をわかりやすくするために「Button」を使用していますが、Buttonについては別項にて解説します。

# -*- coding: utf-8 -*- 

import wx

application = wx.App()
frame = wx.Frame(None, wx.ID_ANY, u"テストフレーム", size=(300,300))

panel = wx.Panel(frame, wx.ID_ANY)
panel.SetBackgroundColour("#AFAFAF")

button_1 = wx.Button(panel, wx.ID_ANY, u"1")
button_2 = wx.Button(panel, wx.ID_ANY, u"2")
button_3 = wx.Button(panel, wx.ID_ANY, u"3")
button_4 = wx.Button(panel, wx.ID_ANY, u"4")

layout = wx.GridSizer(2, 2)
layout.Add(button_1)
layout.Add(button_2)
layout.Add(button_3)
layout.Add(button_4)

panel.SetSizer(layout)

frame.Show()
application.MainLoop()

--実行結果--

GridSizerをセットしているPanelには、わかりやすくするために色を付けています。

wxPython_gridsizer_01



配置を細かく制御するには「flag」を指定します。「GROW」は自身に割り当てられている領域を全て使用するようにリサイズされ、「SHAPED」は自分自身の縦横比率を維持したままフレームサイズに合わせてリサイズされます。(「EXPAND」は「GROW」と同じ)また「 | 」を使用して、さらに詳細な配置場所の指定を行う事も可能です。

# -*- coding: utf-8 -*- 

import wx

application = wx.App()
frame = wx.Frame(None, wx.ID_ANY, u"テストフレーム", size=(600,300))

panel = wx.Panel(frame, wx.ID_ANY)
panel.SetBackgroundColour("#AFAFAF")

button_1 = wx.Button(panel, wx.ID_ANY, u"1", size=(30,30))
button_2 = wx.Button(panel, wx.ID_ANY, u"2", size=(30,30))
button_3 = wx.Button(panel, wx.ID_ANY, u"3", size=(30,30))
button_4 = wx.Button(panel, wx.ID_ANY, u"4", size=(30,30))
button_5 = wx.Button(panel, wx.ID_ANY, u"5", size=(30,30))
button_6 = wx.Button(panel, wx.ID_ANY, u"6", size=(30,30))
button_7 = wx.Button(panel, wx.ID_ANY, u"7", size=(30,30))
button_8 = wx.Button(panel, wx.ID_ANY, u"8", size=(30,30))
button_9 = wx.Button(panel, wx.ID_ANY, u"9", size=(30,30))

layout = wx.GridSizer(3, 3)
layout.Add(button_1)
layout.Add(button_2)
layout.Add(button_3, flag=wx.GROW)
layout.Add(button_4, flag=wx.SHAPED)
layout.Add(button_5, flag=wx.SHAPED | wx.ALIGN_TOP)
layout.Add(button_6, flag=wx.SHAPED | wx.ALIGN_BOTTOM)
layout.Add(button_7, flag=wx.SHAPED | wx.ALIGN_CENTER)
layout.Add(button_8, flag=wx.SHAPED | wx.ALIGN_LEFT)
layout.Add(button_9, flag=wx.SHAPED | wx.ALIGN_RIGHT)

panel.SetSizer(layout)

frame.Show()
application.MainLoop()

--実行結果--

フレームのサイズを変えてみると、より詳細に挙動が判ると思います。

wxPython_gridsizer_02



「border」で余白のピクセル数を指定し、「flag」で余白部分を指定します。 使用出来る余白部分の指定は「wx.TOP」「wx.LEFT」「wx.RIGHT」「wx.BOTTOM」「wx.ALL 」の5つです。

# -*- coding: utf-8 -*- 

import wx

application = wx.App()
frame = wx.Frame(None, wx.ID_ANY, u"テストフレーム", size=(300,300))

panel = wx.Panel(frame, wx.ID_ANY)
panel.SetBackgroundColour("#AFAFAF")

button_1 = wx.Button(panel, wx.ID_ANY, u"1")
button_2 = wx.Button(panel, wx.ID_ANY, u"2")
button_3 = wx.Button(panel, wx.ID_ANY, u"3")
button_4 = wx.Button(panel, wx.ID_ANY, u"4")

layout = wx.GridSizer(2, 2)
layout.Add(button_1, flag=wx.EXPAND | wx.TOP,   border=10)
layout.Add(button_2, flag=wx.EXPAND | wx.LEFT,  border=10)
layout.Add(button_3, flag=wx.EXPAND | wx.RIGHT, border=10)
layout.Add(button_4, flag=wx.EXPAND | wx.ALL,   border=10)
    
panel.SetSizer(layout)

frame.Show()
application.MainLoop()

--実行結果--

ボタン1の上部に余白10px、ボタン2の左部に余白10px、ボタン3の右部に余白10px、ボタン4の全方位に余白10pxとなります。

wxPython_gridsizer_03



Python
スタートブック


入門 Python 3


Effective
Python


退屈なことは
Pythonにやらせよう

 
 
 

柔軟なGridSizer!?

▶GUI:FlexGridSizer



確かな力が身につく
Python「超」入門




P  R