How to create a text with transparent background (Phoenix)
Keywords : StaticText, Transparent background, Customized text.
Contents
Demonstrating :
Tested py3.x, wx4.x and Win10.
Are you ready to use some samples ? 
Test, modify, correct, complete, improve and share your discoveries ! 
First example
1 # sample_one.py
2
3 import wx
4
5 # class MyStaticText
6 # class MyFrame
7 # class MyApp
8
9 #---------------------------------------------------------------------------
10
11 class MyStaticText(wx.Window):
12 """
13 Thanks to Alain Delgrange.
14 """
15 def __init__(self, parent, label):
16 wx.Window.__init__(self, parent, -1)
17
18 #------------
19
20 # Attributes.
21 self.parent = parent
22 self.label = label
23
24 #------------
25
26 # Simplified init method.
27 self.SetBackground()
28 self.SetProperties()
29 self.BindEvents()
30
31 #-----------------------------------------------------------------------
32
33 def SetBackground(self):
34 """
35 ...
36 """
37
38 self.SetBackgroundStyle(wx.BG_STYLE_CUSTOM)
39
40
41 def SetProperties(self):
42 """
43 Set the properties.
44 """
45
46 self.police = wx.Font(18, wx.MODERN, wx.NORMAL, wx.BOLD, False, "Tahoma")
47
48 width, height = self.GetFullTextExtent(self.label, font=self.police)[0:2]
49 self.SetSize((width, height))
50
51
52 def BindEvents(self):
53 """
54 Bind all the events related to my dialog.
55 """
56
57 # Bind a event to an events handler.
58 self.Bind(wx.EVT_PAINT, self.OnPaint)
59
60
61 def OnPaint(self, event):
62 """
63 ...
64 """
65
66 x, y = self.GetPosition()
67
68 # Thank you Robin !
69 dc = wx.BufferedPaintDC(self)
70 l, h = dc.GetFullTextExtent(self.label, font=self.police)[0:2]
71 dc.SetFont(wx.Font(18, wx.MODERN, wx.NORMAL, wx.BOLD, False, "Tahoma"))
72 self.SetSize((l, h))
73 dc.Blit(0, 0, l, h, dc, x, y)
74 dc.SetTextBackground(wx.NullColour)
75 dc.SetTextForeground(wx.WHITE)
76 dc.DrawText(self.label, 0, 0)
77
78 #---------------------------------------------------------------------------
79
80 class MyFrame(wx.Frame):
81 """
82 Thanks to Alain Delgrange.
83 """
84 def __init__(self):
85 style = (wx.DEFAULT_FRAME_STYLE)
86 wx.Frame.__init__(self,
87 None,
88 -1,
89 title="",
90 size=(380, 130),
91 style=style)
92
93 #------------
94
95 # Simplified init method.
96 self.SetProperties()
97 self.CreateCtrls()
98 self.BindEvents()
99
100 #-----------------------------------------------------------------------
101
102 def SetProperties(self):
103 """
104 Set the frame properties (title, icon...).
105 """
106
107 self.SetTitle("Text with transparent background - 1")
108
109 #------------
110
111 frameicon = wx.Icon("Icons/wxWidgets.ico")
112 self.SetIcon(frameicon)
113
114
115 def CreateCtrls(self):
116 """
117 Make widgets for my frame.
118 """
119
120 self.pnl = wx.Panel(self,
121 -1,
122 size=self.GetClientSize(),
123 style=wx.TAB_TRAVERSAL |
124 wx.CLIP_CHILDREN)
125 self.pnl.SetBackgroundStyle(wx.BG_STYLE_CUSTOM)
126
127 self.staticTxt = MyStaticText(self.pnl, "Hello world !")
128 self.staticTxt.CentreOnParent()
129
130
131 def BindEvents(self):
132 """
133 Bind all the events related to my frame.
134 """
135
136 # Bind some events to an events handler.
137 self.Bind(wx.EVT_SIZE, self.OnResize)
138 self.pnl.Bind(wx.EVT_PAINT, self.OnPaint)
139
140
141 def OnResize(self, event):
142 """
143 ...
144 """
145
146 self.pnl.SetSize(self.GetClientSize())
147 self.pnl.Refresh()
148 self.staticTxt.CentreOnParent()
149
150
151 def OnPaint(self, event=None):
152 """
153 ...
154 """
155
156 size = self.pnl.GetRect()
157
158 dc = wx.BufferedPaintDC(self.pnl)
159 dc.GradientFillLinear((0,
160 0,
161 int(size[2]/2),
162 int(size[3])),
163 wx.RED,
164 wx.SystemSettings.GetColour(wx.SYS_COLOUR_MENU),
165 wx.WEST)
166
167 dc.GradientFillLinear((int(size[2]/2),
168 0,
169 int(size[2]/2),
170 int(size[3])),
171 wx.RED,
172 wx.SystemSettings.GetColour(wx.SYS_COLOUR_MENU),
173 wx.EAST)
174
175 #---------------------------------------------------------------------------
176
177 class MyApp(wx.App):
178 """
179 ...
180 """
181 def OnInit(self):
182
183 #------------
184
185 frame = MyFrame()
186 self.SetTopWindow(frame)
187 frame.Show(True)
188
189 return True
190
191 #---------------------------------------------------------------------------
192
193 def main():
194 app = MyApp(False)
195 app.MainLoop()
196
197 #---------------------------------------------------------------------------
198
199 if __name__ == "__main__" :
200 main()
Second example
1 # sample_two.py
2
3 import wx
4
5 # class MyPanel
6 # class MyFrame
7 # class MyApp
8
9 #---------------------------------------------------------------------------
10
11 class MyPanel(wx.Panel):
12 """
13 Thanks to Alain Delgrange.
14 """
15 def __init__(self, parent):
16 wx.Window.__init__(self, parent, -1)
17
18 #------------
19
20 # Attributes.
21 self.parent = parent
22
23 #------------
24
25 # Simplified init method.
26 self.SetBackground()
27 self.BindEvents()
28
29 #-----------------------------------------------------------------------
30
31 def SetBackground(self):
32 """
33 ...
34 """
35
36 self.SetBackgroundStyle(wx.BG_STYLE_CUSTOM)
37
38
39 def BindEvents(self):
40 """
41 Bind all the events related to my dialog.
42 """
43
44 # Bind a event to an events handler.
45 self.Bind(wx.EVT_SIZE, self.OnResize)
46 self.Bind(wx.EVT_PAINT, self.OnPaint)
47
48
49 def OnResize(self, event):
50 """
51 ...
52 """
53
54 self.Refresh()
55
56
57 def OnPaint(self, event=None):
58 """
59 ...
60 """
61
62 width, height = self.GetClientSize()
63
64 dc = wx.BufferedPaintDC(self)
65 dc.GradientFillLinear((0,
66 0,
67 int(width/2),
68 int(height)),
69 wx.YELLOW,
70 wx.SystemSettings.GetColour(wx.SYS_COLOUR_MENU),
71 wx.WEST)
72
73 dc.GradientFillLinear((int(width/2),
74 0,
75 int(width/2),
76 int(height)),
77 wx.YELLOW,
78 wx.SystemSettings.GetColour(wx.SYS_COLOUR_MENU),
79 wx.EAST)
80
81 label = "Hello World !"
82 wt, ht = self.GetTextExtent(label)
83 dc.SetFont(wx.Font(18, wx.SWISS, wx.NORMAL, wx.BOLD, False, "Tahoma"))
84 dc.SetTextForeground("#b4b4b4")
85 dc.DrawText(label, int(width/2-(wt+8)), int(height/2-(ht)))
86
87 #---------------------------------------------------------------------------
88
89 class MyFrame(wx.Frame):
90 """
91 Thanks to Alain Delgrange.
92 """
93 def __init__(self):
94 style = (wx.DEFAULT_FRAME_STYLE)
95 wx.Frame.__init__(self,
96 None,
97 -1,
98 title="",
99 size=(380, 130),
100 style=style)
101
102 #------------
103
104 # Simplified init method.
105 self.SetProperties()
106 self.CreateCtrls()
107
108 #-----------------------------------------------------------------------
109
110 def SetProperties(self):
111 """
112 Set the frame properties (title, icon...).
113 """
114
115 self.SetTitle("Text with transparent background - 2")
116
117 #------------
118
119 frameicon = wx.Icon("Icons/wxWidgets.ico")
120 self.SetIcon(frameicon)
121
122
123 def CreateCtrls(self):
124 """
125 Make widgets for my frame.
126 """
127
128 self.pnl = MyPanel(self)
129
130 #---------------------------------------------------------------------------
131
132 class MyApp(wx.App):
133 """
134 ...
135 """
136 def OnInit(self):
137
138 #------------
139
140 frame = MyFrame()
141 self.SetTopWindow(frame)
142 frame.Show(True)
143
144 return True
145
146 #---------------------------------------------------------------------------
147
148 def main():
149 app = MyApp(False)
150 app.MainLoop()
151
152 #---------------------------------------------------------------------------
153
154 if __name__ == "__main__" :
155 main()
Third example
1 # sample_three.py
2
3 import wx
4
5 """
6
7 https://stackoverflow.com/questions/9136179/what-are-my-options-for-drawing-controls-with-transparent-translucent-background
8 Author : Dan Horner and teuobk
9
10 """
11
12 # class TransparentText
13 # class GradientPanel
14 # class MyStaticText
15 # class MyStaticTextWithCustomBackground
16
17 #---------------------------------------------------------------------------
18
19 class TransparentText(wx.StaticText):
20 def __init__(self, parent, id=wx.ID_ANY, label='',
21 pos=wx.DefaultPosition, size=wx.DefaultSize,
22 style=wx.TRANSPARENT_WINDOW, name='transparenttext'):
23 wx.StaticText.__init__(self, parent, id, label,
24 pos, size, style, name)
25
26 self.Bind(wx.EVT_PAINT, self.on_paint)
27 self.Bind(wx.EVT_ERASE_BACKGROUND, lambda event: None)
28 self.Bind(wx.EVT_SIZE, self.on_size)
29
30 #-----------------------------------------------------------------------
31
32 def on_paint(self, event):
33 bdc = wx.PaintDC(self)
34 dc = wx.GCDC(bdc)
35
36 font_face = self.GetFont()
37 font_color = self.GetForegroundColour()
38
39 dc.SetFont(font_face)
40 dc.SetTextForeground(font_color)
41 dc.DrawText(self.GetLabel(), 0, 0)
42
43
44 def on_size(self, event):
45 self.Refresh()
46 event.Skip()
47
48 #---------------------------------------------------------------------------
49
50 class GradientPanel(wx.Panel):
51 def __init__(self, *args, **kwargs):
52 wx.Panel.__init__(self, *args, **kwargs)
53
54 self.Bind(wx.EVT_PAINT, lambda e: self.paintBackground())
55 self.Bind(wx.EVT_ERASE_BACKGROUND, lambda e: None)
56
57 self.t = wx.StaticText(self,
58 pos=(30, 20),
59 label="wxStaticText. Looks bad on MSW")
60
61 self.t2 = MyStaticText(self,
62 pos=(30, 50),
63 size=(300, 25),
64 label="MyStaticText. Needs ClipChildren turned off",
65 style=wx.TRANSPARENT_WINDOW)
66
67 self.t3 = MyStaticTextWithCustomBackground(self,
68 pos=(30, 80),
69 size=(300, 25),
70 label="This Control touches up its own background",
71 paintBackgroundToDC=self.paintBackgroundToDC)
72
73 self.t4 = TransparentText(self,
74 pos=(30, 110),
75 size=(300, 25),
76 label="Method TransparentText",
77 style=wx.TRANSPARENT_WINDOW)
78
79 # Event Handlers
80 self.Bind(wx.EVT_SIZE, self.OnSize)
81
82 #-----------------------------------------------------------------------
83
84 def OnSize(self, event):
85 self.Refresh()
86 self.Update()
87
88
89 def paintBackground(self):
90 dc = wx.PaintDC(self)
91 self.paintBackgroundToDC(self, dc)
92
93
94 def paintBackgroundToDC(self, ofWindow, dc=None):
95 r = self.GetScreenRect()
96 r.SetTopLeft(ofWindow.ScreenToClient(r.GetTopLeft()))
97 dc.GradientFillLinear(r, wx.Colour(240, 240, 240),
98 wx.Colour(128, 128, 255), wx.SOUTH)
99
100 #---------------------------------------------------------------------------
101
102 class MyStaticText(wx.Window): # wx.TRANSPARENT_WINDOW
103 def __init__(self, parent, label, **kwargs):
104 wx.Window.__init__(self, parent, **kwargs)
105
106 self.label = label
107
108 self.Bind(wx.EVT_PAINT, lambda e: self.repaint())
109 self.Bind(wx.EVT_ERASE_BACKGROUND, lambda e: None)
110
111 #-----------------------------------------------------------------------
112
113 def repaint(self):
114 self.repaintToDC(wx.PaintDC(self))
115
116
117 def repaintToDC(self,dc):
118 dc.DrawText(self.label, 0, 0)
119
120 #---------------------------------------------------------------------------
121
122 class MyStaticTextWithCustomBackground(MyStaticText):
123 def __init__(self, parent, label, paintBackgroundToDC=None, **kwargs):
124 self.paintBackgroundToDC=paintBackgroundToDC
125 MyStaticText.__init__(self, parent, label, **kwargs)
126
127 #-----------------------------------------------------------------------
128
129 def repaint(self):
130 dc = wx.PaintDC(self)
131 if self.paintBackgroundToDC:
132 self.paintBackgroundToDC(self, dc)
133 MyStaticText.repaintToDC(self, dc)
134
135 #---------------------------------------------------------------------------
136
137 class MyFrame(wx.Frame):
138 def __init__(self):
139 style = (wx.DEFAULT_FRAME_STYLE)
140 wx.Frame.__init__(self,
141 None,
142 -1,
143 title="",
144 size=(320, 250),
145 style=style)
146
147 #------------
148
149 # Simplified init method.
150 self.SetProperties()
151 self.CreateCtrls()
152
153 #-----------------------------------------------------------------------
154
155 def SetProperties(self):
156 self.SetTitle("Transparent Controls")
157
158 #------------
159
160 frameicon = wx.Icon("Icons/wxWidgets.ico")
161 self.SetIcon(frameicon)
162
163
164 def CreateCtrls(self):
165 panel = GradientPanel(self)
166
167 #---------------------------------------------------------------------------
168
169 class MyApp(wx.App):
170 """
171 ...
172 """
173 def OnInit(self):
174
175 #------------
176
177 # wx.SystemOptions.SetOption('msw.window.no-clip-children', 1)
178
179 frame = MyFrame()
180 self.SetTopWindow(frame)
181 frame.Show(True)
182
183 return True
184
185 #---------------------------------------------------------------------------
186
187 def main():
188 app = MyApp(False)
189 app.MainLoop()
190
191 #---------------------------------------------------------------------------
192
193 if __name__ == "__main__" :
194 main()
Download source
Additional Information
Link :
- - - - -
https://wiki.wxpython.org/TitleIndex
Thanks to
Alain Delgrange (sample_one.py coding), Dan Horner and teuobk (sample_three.py coding), Robin Dunn, the wxPython community...
About this page
Date (d/m/y) Person (bot) Comments :
16/03/18 - Ecco (Created page for wxPython Phoenix).
09/08/22 - Ecco (Added example three).
Comments
- blah, blah, blah...