Làm cách nào để bố trí cửa sổ 3 ngăn bằng wxPython?

Question

Tôi đang cố gắng tìm một cách đơn giản để bố trí cửa sổ 3 ngăn bằng cách sử dụng wxPython.

Tôi muốn có danh sách cây ở ô bên trái, sau đó có ngăn bên phải được chia thành hai - với thành phần chỉnh sửa ở phần trên cùng và thành phần lưới ở phần dưới cùng.

cái gì đó dọc theo dòng:

 
-------------------------------------- 
|    |      | 
|    |  Edit   | 
| Tree  |  Control  | 
| Control |      | 
|    |----------------------| 
|    |      | 
|    |  Grid   | 
|    |      | 
-------------------------------------- 

Tôi muốn các cửa sổ để được tái khá lớn và cung cấp cho người dùng khả năng để thay đổi (tương đối) kích thước của từng thành phần trong các cửa sổ bằng cách kéo biên giới.

Tôi nhận thấy rằng tôi cần một số kết hợp các bộ phận và/hoặc các thành phần cửa sổ chia nhỏ nhưng không thể tìm thấy một ví dụ điển hình về loại cửa sổ này trong tài liệu hoặc trên web.

Answer 1

Trước hết, hãy tải xuống wxGlade trình tạo gui cho wxPython (thay thế XRCed, i prefere wxGlade).

Sau đó, bạn phải quyết định xem bạn có muốn sử dụng GridSizer hoặc Splitter và bạn đã hoàn tất. Dưới đây bạn tìm thấy cả hai (giữa cây và bên phải là một GridSizer -> thay đổi kích thước tự động). Giữa Edit và GridCtrl là một Sizer (thay đổi kích thước thủ công).

Trân trọng.

một phút làm việc mà không cần nhập dòng mã:

#!/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() 

Answer 2

Bạn nên sử dụng wxSplitter, here's ví dụ. Một số khác here. Và another.

Answer 3

Bạn có thể xem xét sử dụng wx.aui mô-đun giao diện người dùng tiên tiến, vì nó cho phép bạn xây dựng UI như thế này rất dễ dàng. Ngoài ra, người dùng sau đó có thể thu nhỏ, phóng to và kéo các ô xung quanh khi chúng thấy vừa vặn hoặc không. Nó khá linh hoạt. Tôi thực sự thấy dễ dàng hơn khi đặt loại giao diện người dùng này với bộ công cụ aui, thay vì với lưới và bộ tách. Cộng với tất cả các nút ưa thích làm cho các ứng dụng trông mát mẻ hơn. :)

Có một ví dụ hay trong các bản trình diễn chính thức, được gọi là AUI_DockingWindowMgr.

Answer 4

Đây là bố cục rất đơn giản sử dụng wx.aui và ba bảng. Tôi đoán bạn có thể dễ dàng điều chỉnh nó cho phù hợp với nhu cầu của bạn.

Orjanp ...

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()