Search code examples
python-3.xlayoutwxwidgetswxpython

Adding vertical boarders


This is how my programm looks like

Picture of programm

I want to have darker blue borders on the left and right side of the Window. Despite setting the size manually, for some reason, the top level panel "panel" is resized to the toplevelsizer size. And I don't know why. The way I achieve the other borders is by having a blue panel below the top-sizer and adding spacer between the other panels/widgets.

import wx
from threading import Thread
from wx.lib.agw import ultimatelistctrl as ULC
import wx.lib.inspection


class Uploader(wx.App):


def __init__(self,redirect=False,filename=None):
    wx.App.__init__(self,redirect,filename)   
    self.width=900
    self.widthBoarder=2
    self.frame=wx.Frame(None,size=(self.width+4*self.widthBoarder,700),style = wx.DEFAULT_FRAME_STYLE & ~(wx.RESIZE_BORDER | wx.MAXIMIZE_BOX))

    #Fonts
    self.header=wx.Font(16, wx.DEFAULT, wx.NORMAL, wx.NORMAL, False, "Arial")
    self.ListText=wx.Font(12, wx.DEFAULT, wx.NORMAL, wx.NORMAL, False, "Arial")
    ######################################################################
    #Panels
    #Toplevelpanel
    self.panel=wx.Panel(self.frame,size=(self.width+4*self.widthBoarder,700)) 
    self.panel.SetBackgroundColour((65,113,156))
    #Panelfor Header
    self.panelForHeading=wx.Panel(self.panel,size=(self.width,50))
    self.panelForHeading.SetBackgroundColour((91,155,213))
    #Bottom Panel for Detail Information
    self.InfoPanel=wx.Panel(self.panel,size=(self.width,100))
    self.InfoPanel.SetBackgroundColour((195,195,195))        
    #Bottom Panel for Button
    self.ButtonPanel=wx.Panel(self.panel,size=(self.width,100))
    self.ButtonPanel.SetBackgroundColour("White")

    ######################################################################
    #widgets
    #Header
    self.NameOfDatabase=wx.StaticText(self.panelForHeading,-1)
    self.NameOfDatabase.SetLabel(' Some Header')
    self.NameOfDatabase.SetFont(self.header)

    #ultimatelist
    self.FileList=ULC.UltimateListCtrl(self.panel,size=(self.width,400),agwStyle=wx.LC_REPORT|ULC.ULC_USER_ROW_HEIGHT|ULC.ULC_SINGLE_SEL|ULC.ULC_BORDER_SELECT|ULC.ULC_AUTO_TOGGLE_CHILD)
    self.FileList.SetUserLineHeight(30)
    self.FileList.SetHeaderHeight(40)
    #self.FileList.Bind(wx.EVT_LIST_ITEM_FOCUSED,self.OnItemSelect)

    #First Column
    info=ULC.UltimateListItem()
    info._mask=wx.LIST_MASK_TEXT|wx.LIST_MASK_IMAGE|wx.LIST_MASK_FORMAT|ULC.ULC_MASK_CHECK
    info._image=[]
    info._format=0
    info._text="Select"
    info._kind=1
    self.FileList.InsertColumnInfo(0,info)
    self.FileList.SetColumnWidth(0,100)

    #Second Column
    info=ULC.UltimateListItem()
    info._mask=wx.LIST_MASK_TEXT|wx.LIST_MASK_IMAGE|wx.LIST_MASK_FORMAT|ULC.ULC_MASK_CHECK
    info._image=[]
    info._format=0
    info._text="Name"
    self.FileList.InsertColumnInfo(1,info)
    self.FileList.SetColumnWidth(1,300)

    #Third Column
    info=ULC.UltimateListItem()
    info._mask=wx.LIST_MASK_TEXT|wx.LIST_MASK_IMAGE|wx.LIST_MASK_FORMAT|ULC.ULC_MASK_CHECK
    info._image=[]
    info._format=0
    info._text="Type"
    self.FileList.InsertColumnInfo(2,info)
    self.FileList.SetColumnWidth(2,150)

    #fourth Column
    info=ULC.UltimateListItem()
    info._mask=wx.LIST_MASK_TEXT|wx.LIST_MASK_IMAGE|wx.LIST_MASK_FORMAT|ULC.ULC_MASK_CHECK
    info._image=[]
    info._format=0
    info._text="Date modified"
    self.FileList.InsertColumnInfo(3,info)
    self.FileList.SetColumnWidth(3,150)

    #Fifth Column
    info=ULC.UltimateListItem()
    info._mask=wx.LIST_MASK_TEXT|wx.LIST_MASK_IMAGE|wx.LIST_MASK_FORMAT|ULC.ULC_MASK_CHECK
    info._image=[]
    info._format=0
    info._text="Status"
    self.FileList.InsertColumnInfo(4,info)
    self.FileList.SetColumnWidth(4,198)


    ######################################################################
    #sizer
    self.TopLevelSizer=wx.BoxSizer(wx.VERTICAL)
    self.HeaderSizer=wx.BoxSizer(wx.VERTICAL)
    self.ListSizer=wx.BoxSizer(wx.VERTICAL)

    self.panelForHeading.SetSizer(self.HeaderSizer)
    self.panel.SetSizer(self.TopLevelSizer)


    #add widget to sizer and panels
    self.HeaderSizer.AddStretchSpacer()
    self.HeaderSizer.Add(self.NameOfDatabase,0, wx.ALIGN_BOTTOM | wx.ALIGN_LEFT | wx.ALL)
    self.HeaderSizer.AddSpacer(5)


    self.ListSizer.Add(self.FileList,0,wx.ALIGN_CENTER)



    self.TopLevelSizer.AddSpacer(self.widthBoarder)
    self.TopLevelSizer.Add(self.panelForHeading,0,wx.ALIGN_CENTER)
    self.TopLevelSizer.AddSpacer(self.widthBoarder)
    self.TopLevelSizer.Add(self.ListSizer,0,wx.ALIGN_CENTER)
    self.TopLevelSizer.AddSpacer(self.widthBoarder)
    self.TopLevelSizer.Add(self.InfoPanel,0,wx.ALIGN_CENTER)
    self.TopLevelSizer.AddSpacer(self.widthBoarder)
    self.TopLevelSizer.Add(self.ButtonPanel,0,wx.ALIGN_CENTER)





    self.frame.Show()

    self.TestInsertList()

    wx.lib.inspection.InspectionTool().Show()

def TestInsertList(self):

    for i in range(5):
        self.FileList.InsertStringItem(i,"",it_kind=1)
        self.FileList.SetItemFont(i,self.ListText)
        self.FileList.SetStringItem(i,1,'File '+str(i))











if __name__=='__main__':
    app=Uploader()
    app.MainLoop()

Solution

  • You don't leave any borders around the elements added to TopLevelSizer, so there are none in the left and the right directions. You could simply remove the spacers and use Add(whatever, 0, wx.EXPAND|wx.ALL, self.widthBoarder) to have the borders show through.