5

wxPython を使用して 3 ペイン ウィンドウをレイアウトする簡単な方法を見つけようとしています。

左ペインにツリー リストを表示し、右ペインを 2 つに分割して、上部に編集コンポーネント、下部にグリッド コンポーネントを配置したいと考えています。

次のようなもの：

--------------------------------------
| | | | | |
| | | | 編集 |
| | ツリー | ツリー | コントロール |
| | コントロール | | |
| | |----------------------|
| | | | | |
| | | | グリッド |
| | | | | |
--------------------------------------

ウィンドウのサイズを変更できるようにし、境界線をドラッグしてウィンドウ内の各コンポーネントの (相対的な) サイズを変更できるようにしたいと考えています。

サイザーやスプリッター ウィンドウ コンポーネントの組み合わせが必要だと思いますが、ドキュメントや Web でこの種のウィンドウの適切な例を見つけることができません。

4

4 に答える 4

8

これは、wx.aui と 3 つのパネルを使用した非常に単純なレイアウトです。ニーズに合わせて簡単に調整できると思います。

オルジャンプ...

import wx
import wx.aui

class MyFrame(wx.Frame):
    def __init__(self, *args, **kwargs):
        wx.Frame.__init__(self, *args, **kwargs)

        self.mgr = wx.aui.AuiManager(self)

        leftpanel = wx.Panel(self, -1, size = (200, 150))
        rightpanel = wx.Panel(self, -1, size = (200, 150))
        bottompanel = wx.Panel(self, -1, size = (200, 150))

        self.mgr.AddPane(leftpanel, wx.aui.AuiPaneInfo().Bottom())
        self.mgr.AddPane(rightpanel, wx.aui.AuiPaneInfo().Left().Layer(1))
        self.mgr.AddPane(bottompanel, wx.aui.AuiPaneInfo().Center().Layer(2))

        self.mgr.Update()


class MyApp(wx.App):
    def OnInit(self):
        frame = MyFrame(None, -1, '07_wxaui.py')
        frame.Show()
        self.SetTopWindow(frame)
        return 1

if __name__ == "__main__":
    app = MyApp(0)
    app.MainLoop()
于 2009-02-10T15:50:22.113 に答える
7

まず、 wxPython 用の GUI ビルダーであるwxGladeをダウンロードします(代替のXRCed、私は wxGlade を好みます)。

次に、GridSizerを使用するか、Splitterを使用するかを決定する必要があります。これで完了です。以下に両方があります (ツリーと右側の間には GridSizer -> 自動的にサイズ変更されます)。Edit と GridCtrl の間には Sizer (手動のサイズ変更) があります。

よろしく。

コードを 1 行も入力せずに 1 分で作業できます。

#!/usr/bin/env python
# -*- coding: utf-8 -*-
# generated by wxGlade 0.6.3 on Sat Feb 07 10:02:31 2009

import wx
import wx.grid

# begin wxGlade: extracode
# end wxGlade



class MyDialog(wx.Dialog):
    def __init__(self, *args, **kwds):
        # begin wxGlade: MyDialog.__init__
        kwds["style"] = wx.DEFAULT_DIALOG_STYLE|wx.RESIZE_BORDER|wx.THICK_FRAME
        wx.Dialog.__init__(self, *args, **kwds)
        self.window_1 = wx.SplitterWindow(self, -1, style=wx.SP_3D|wx.SP_BORDER)
        self.tree_ctrl_1 = wx.TreeCtrl(self, -1, style=wx.TR_HAS_BUTTONS|wx.TR_LINES_AT_ROOT|wx.TR_DEFAULT_STYLE|wx.SUNKEN_BORDER)
        self.text_ctrl_1 = wx.TextCtrl(self.window_1, -1, "This is the Edit", style=wx.TE_MULTILINE)
        self.grid_1 = wx.grid.Grid(self.window_1, -1, size=(1, 1))

        self.__set_properties()
        self.__do_layout()
        # end wxGlade

    def __set_properties(self):
        # begin wxGlade: MyDialog.__set_properties
        self.SetTitle("dialog_1")
        self.grid_1.CreateGrid(10, 3)
        # end wxGlade

    def __do_layout(self):
        # begin wxGlade: MyDialog.__do_layout
        grid_sizer_1 = wx.FlexGridSizer(1, 2, 3, 3)
        grid_sizer_1.Add(self.tree_ctrl_1, 1, wx.EXPAND, 0)
        self.window_1.SplitHorizontally(self.text_ctrl_1, self.grid_1)
        grid_sizer_1.Add(self.window_1, 1, wx.EXPAND, 0)
        self.SetSizer(grid_sizer_1)
        grid_sizer_1.Fit(self)
        grid_sizer_1.AddGrowableRow(0)
        grid_sizer_1.AddGrowableCol(0)
        grid_sizer_1.AddGrowableCol(1)
        self.Layout()
        # end wxGlade

# end of class MyDialog


class MyApp(wx.App):
    def OnInit(self):
        wx.InitAllImageHandlers()
        mainDlg = MyDialog(None, -1, "")
        self.SetTopWindow(mainDlg)
        mainDlg.Show()
        return 1

# end of class MyApp

if __name__ == "__main__":
    app = MyApp(0)
    app.MainLoop()
于 2009-02-07T09:08:11.593 に答える
3

wxSplitter を使用する必要があります。例を次に示します。ここにもう一つ。そしてもう一つ。

于 2009-02-07T07:20:29.360 に答える
2

このような UI を非常に簡単に構築できるため、 wx.aui高度なユーザー インターフェイス モジュールの使用を検討できます。また、ユーザーは、ペインを最小化、最大化、ドラッグして、適切かどうかを判断できます。それはかなり柔軟です。この種の UI は、グリッドやスプリッターを使用するよりも、aui ツールキットを使用してレイアウトする方が簡単です。さらに、派手なボタンがすべてアプリの見た目をクールにします。:)

公式のデモには、AUI_DockingWindowMgr と呼ばれる良い例があります。

于 2009-02-07T18:31:34.043 に答える