Why is my text not aligned correctly in wxPython?

Question

I am using wxPython to create a GUI, and I am trying to align some text, but it does not work at all. I am trying to align three different static text elements in three places (right alignment, center alignment and left alignment) in three separate panels. The result I get is that all three static text controls are aligned in the upper left corners of the respective panels.

This is the code I have:

self.lastText=wx.StaticText(self.textDisplayPanel1, label=self.lastWords, style=wx.ALIGN_RIGHT) self.currentText=wx.StaticText(self.textDisplayPanel2, label=self.currentWords, style=wx.ALIGN_CENTRE) self.nextText=wx.StaticText(self.textDisplayPanel3, label=self.nextWords, style=wx.ALIGN_LEFT) 

Any ideas on how I can fix this?

Thanks!

I am running mac OSX 10.7.2 with Python 2.7.1 and wxPython 2.8.12.1

Answer 1

Edit: Although everything commented below works on Windows, the first option will not work, for example, Ubuntu, possibly due to an error. The previous post mentioned in the comments indicates that the same problem is encountered in OSX.
In any case, the second option using vertical sizers works on both Ubuntu and Windows, so you can try it on OSX.

---

There is a command in your text to align as you wish with wx.ALIGN... and, in fact, it is aligned. However, the size of the StaticText does not match the size of the panel, but only the size of the text. By limiting your position to your size, you cannot see the difference between alignment modes.

You have two options for solving the problem:

Option 1. Expand the size of the StaticText widget and place your text on it

You can increase the size of the StaticText widget using its size parameter. This is a bad decision, with the exception of parents or fixed-size frames that you are not going to resize or reuse in other applications. If the widget containing the text is resized, the relative position of the text will also be resized, since its size remains fixed. Therefore, it is always better to organize your widgets using sizers.

The share of available space that the widget occupies in the sizer slot is set by the second parameter in sizer.Add() ( 0 - minimum size, 1 - full occupation):

 sizer_2.Add(self.label_1, 0, 0, 0) 

To see the text aligned on the panel as you want, you must specify a StaticText to expand to the entire available space:

 sizer_2.Add(self.label_1, 1, 0, 0) 

Here you have the appropriate code:

 class MyFrame(wx.Frame): def __init__(self, *args, **kwds): wx.Frame.__init__(self, *args, **kwds) self.panel_1 = wx.Panel(self, -1) self.label_1 = wx.StaticText(self.panel_1, -1, "label_1", style=wx.ALIGN_RIGHT) self.panel_2 = wx.Panel(self, -1) self.label_2 = wx.StaticText(self.panel_2, -1, "label_2", style=wx.ALIGN_CENTRE) self.panel_3 = wx.Panel(self, -1) self.label_3 = wx.StaticText(self.panel_3, -1, "label_3") self.panel_1.SetBackgroundColour(wx.Colour(0, 255, 0)) self.panel_2.SetBackgroundColour(wx.Colour(0, 255, 255)) self.panel_3.SetBackgroundColour(wx.Colour(219, 112, 147)) sizer_1 = wx.BoxSizer(wx.HORIZONTAL) sizer_2 = wx.BoxSizer(wx.HORIZONTAL) sizer_3 = wx.BoxSizer(wx.HORIZONTAL) sizer_4 = wx.BoxSizer(wx.HORIZONTAL) sizer_2.Add(self.label_1, 1, 0, 0) sizer_3.Add(self.label_2, 1, 0, 0) sizer_4.Add(self.label_3, 1, 0, 0) self.panel_1.SetSizer(sizer_2) self.panel_2.SetSizer(sizer_3) self.panel_3.SetSizer(sizer_4) sizer_1.Add(self.panel_1, 1, wx.EXPAND, 0) sizer_1.Add(self.panel_2, 1, wx.EXPAND, 0) sizer_1.Add(self.panel_3, 1, wx.EXPAND, 0) self.SetSizer(sizer_1) sizer_1.Fit(self) self.Layout() 

Note that the code is longer than necessary to match your example with three panels. You get the same kind of frame using only one panel. In fact, it could be simplified without using panels and installing StaticText directly on sizer:

 class MyFrame2(wx.Frame): def __init__(self, *args, **kwds): wx.Frame.__init__(self, *args, **kwds) self.label_1 = wx.StaticText(self, -1, "label_1", style=wx.ALIGN_RIGHT) self.label_2 = wx.StaticText(self, -1, "label_2", style=wx.ALIGN_CENTRE) self.label_3 = wx.StaticText(self, -1, "label_3") self.label_1.SetBackgroundColour(wx.Colour(127, 255, 0)) self.label_2.SetBackgroundColour(wx.Colour(0, 255, 255)) self.label_3.SetBackgroundColour(wx.Colour(219, 112, 147)) sizer = wx.BoxSizer(wx.HORIZONTAL) sizer.Add(self.label_1, 1, wx.EXPAND, 0) sizer.Add(self.label_2, 1, wx.EXPAND, 0) sizer.Add(self.label_3, 1, wx.EXPAND, 0) self.SetSizer(sizer) sizer.Fit(self) self.Layout() 

Option 2. Find the widget itself in the right place in the available sizer space. For this purpose, you can use the position parameter StaticText . But this will have the same problems as indicated above for using size . So again, you want to control the geometry of your views with sizers. You place the widget in sizer using one of:

 sizer_6.Add(self.label_5, 0, wx.ALIGN_RIGHT, 0) 

or

 sizer_7.Add(self.label_6, 0, wx.ALIGN_CENTER_HORIZONTAL, 0) 

For some reason, you need a vertical BoxSizer for this (and just like that, if you want to use wx.ALIGN_CENTER_VERTICAL, you will need a horizontal BoxSizer :

 class MyFrame(wx.Frame): def __init__(self, *args, **kwds): wx.Frame.__init__(self, *args, **kwds) self.panel_4 = wx.Panel(self, -1) self.label_5 = wx.StaticText(self.panel_4, -1, "label_5") self.panel_5 = wx.Panel(self, -1) self.label_6 = wx.StaticText(self.panel_5, -1, "label_6") self.panel_6 = wx.Panel(self, -1) self.label_7 = wx.StaticText(self.panel_6, -1, "label_7") self.panel_4.SetBackgroundColour(wx.Colour(0, 255, 255)) self.panel_5.SetBackgroundColour(wx.Colour(127, 255, 0)) self.panel_6.SetBackgroundColour(wx.Colour(219, 112, 219)) sizer_1 = wx.BoxSizer(wx.HORIZONTAL) sizer_8 = wx.BoxSizer(wx.VERTICAL) sizer_7 = wx.BoxSizer(wx.VERTICAL) sizer_6 = wx.BoxSizer(wx.VERTICAL) sizer_6.Add(self.label_5, 0, wx.ALIGN_RIGHT, 0) sizer_7.Add(self.label_6, 0, wx.ALIGN_CENTER_HORIZONTAL, 0) sizer_8.Add(self.label_7, 0, 0, 0) self.panel_4.SetSizer(sizer_6) self.panel_5.SetSizer(sizer_7) self.panel_6.SetSizer(sizer_8) sizer_1.Add(self.panel_4, 1, wx.EXPAND, 0) sizer_1.Add(self.panel_5, 1, wx.EXPAND, 0) sizer_1.Add(self.panel_6, 1, wx.EXPAND, 0) self.SetSizer(sizer_1) sizer_1.Fit(self) self.Layout() 

This option involves a combination of panels and sizers, which create code that is more difficult to simplify than the one shown for the first option.

Answer 2

I think the text is not aligned because the size is not set. Try:

 t1=wx.StaticText(smth, label="foo", pos=(0,0), size=(200,20), style=wx.ALIGN_RIGHT) t2=wx.StaticText(smth, label="bar", pos=(0,0), size=(200,20), style=wx.ALIGN_CENTRE) 

And it will be aligned inside the 200 * 20 field. By default, the size is "auto", that is (-1, -1), i.e. It is enough that the text is visible, and alignment in this field does not give a visible effect.

However, this does not always work .

Answer 3

I also had the same problem yesterday, I am using MAC OS X, wxpython 4.0.6. Finally, I find out that this script works for me.

And I understand that unless you finally install SetSizer, static text will not be centered.

My code