We have moved

This is just a quick post to say we have moved to
http://wxpython.webs.com
Hope to see you there

wxPython Tutorial Part 6

Today we will be learning how easy it is to use images from your computer in wxPython. We are going to make an image viewer, using a Panel to display the images. We will also have an open dialog that looks quite fancy and is very useful for programs in which you open files.

Part6
Images

1 import wx

2 class ImageFrame(wx.Frame):
3 def __init__(self):
4 wx.Frame.__init__(self,None,title = "Picture Viewer")
5 self.menubar = wx.MenuBar()
6 self.file = wx.Menu()
7 self.SetMenuBar(self.menubar)
8 self.menubar.Append(self.file,'&File')
9 self.get = self.file.Append(wx.ID_ANY,'Get &Picture')
10 self.Bind(wx.EVT_MENU,self.getpicture,self.get)
11 self.picturepanel = wx.Panel(self,style = wx.SUNKEN_BORDER)
12 self.vbox = wx.BoxSizer(wx.VERTICAL)
13 self.getpicbut = wx.Button(self,wx.ID_ANY,label = 'Get Picture')
14 self.getpicbut.Bind(wx.EVT_LEFT_DOWN,self.getpicture)
15 self.vbox.Add(self.getpicbut,proportion=0,flag = wx.EXPAND)
16 self.vbox.Add(self.picturepanel,proportion=1,flag = wx.EXPAND)
17 self.SetSizer(self.vbox)
18 self.Show()
19 self.img =0


20 def getpicture(self,event):
21 filedialog = wx.FileDialog(self,
22 message = 'Choose an image to open',
23 defaultDir = '',
24 defaultFile = '',
25 wildcard = 'Supported Image files (*.gif;*.png;*.jpg;*.bmp) | *.gif; *.png; *.jpg; *.bmp',
27 style = wx.OPEN)
28 if filedialog.ShowModal() == wx.ID_OK:
29 if self.img:
30 self.img.Destroy()
31 self.path = filedialog.GetPath()
32 self.bmp = wx.Bitmap(self.path)
33 self.img = wx.StaticBitmap(self.picturepanel,wx.ID_ANY,self.bmp)
34 self.picturepanel.Refresh()
35 imgsize = self.img.Size
36 x = imgsize[0]+12
37 y = imgsize[1]+80
38 self.Size = (x,y)


39 app = wx.App(redirect = False)
40 frame = ImageFrame()
41 app.MainLoop()

So the first thing you'll probably notice is the numbers, this is to make refrencing the lines easiers for you and me.
LINE BY LINE

Line 1-4:Here we just to the usual stuff except we give out frame the title of 'Picture Viewer'

Line 5-10:This is getting the menu set up, notice we are only having one menu so we only create one wx.Menu(). For more info on menus see my last tutorial which outlines how to make them.

Line 11: Here we make our panel that will house our picture, notice that we add a style as well as a parent to the panel. This is to make the panel look different. In this case it will have a sunken border all around it. There are many other styles you can use with panels, to find out which ones you like its easiest to experiment with the wxPython libraries. Oh and finally make sure to make you panels after you have made your menus otherwise the menus will try to add themselves to the panel and things start to screw up.

Line 12:Just making a vertical sizer for later use

Line 13,14:Here we make a button and bind it to the event getpicture. We will use this button as well as the menu item we made to get the image. Note the button is a child to self, not self.picturepanel

Line 15,16:Now to add our stuff to the sizer. We will add the button first and then make its proportion=0, this means it will stay as flat as possible (if it were a horizontal sizer it would remain as thin as possible). We also add a flag, wx.EXPAND. This now means out button will be as flat as possible but will take up as much room as possible from left to right.

Then we get to add our panel to the sizer, we make this as big as possible by having proportion=1 and a flag of wx.EXPAND

Line 17,18:Just the usual setting the sizer and setting the frame to show

Line 19: What we are doing here is creating a variable for use later in the program. This is used to determine the first time that getpicture method is run. We will talk about this variable a bit more later.

Line 21: Welcome to the wonderful world of FileDialogs. These are great for using if you want to load or save a file. The possible arguments for this are as follows:
wxFileDialog

wxFileDialog (parent, message = "Choose a file", defaultDir = "", defaultFile = "", wildcard="*.*", style = wxFD_DEFAULT_STYLE, pos = wxDefaultPosition, sz = xDefaultSize, name = "filedlg")

The style we need to add to our FileDialog is wx.OPEN, this will convert the FileDialog into something prepared to open files, all the buttons in filedialog will be labeled appropriatley.

Something i feel i should go through is wildcards, wildcards are the things that let programs only open some types of files by restricting what files types can be shown in the dialog. For a FileDialog you first type in the label you want to be seen down the bottom under Files of Type. Then we put a | sign, then in the same string you put all the file types to allow in the following format:

*.filetype;*.filetype'

Leaving the defaultDir blank will mean it will resort to the default window

Line 28-38: Here we put all of the rest of our method to get the picture. Notice that we put it all in the IF that checks if the user pressed OK. We do this becuase if the used pressed another button apart from OK then they would not have selected a file and the rest of the program would bug.

The first thing we do here is check if there is an image on the panel already, if there is we need to destroy it to make way for the new image we will be putting in. Remember at the start we set that variable to zero? Well now it becomes useful becuase the If asks if there is self.img. If a variable is zero then is has a boolen value of false so this IF is not executed and we get no errors about there being no image to destroy.

Line 31:Now we grab the path of the file that the user selected in the filedialog. We do this by going filedialog.GetPath(). This gives a string of the position of the file.

Line 32:What we are doing is converting the picture into a wx.Bitmap that the method wx.StaticBitmap will be able to process.

Line 33:Here we make out image and set it to the panel. Here is the syntax for wx.StaticBitmap. Note that the parent is where the picture will be placed upon.

The label is where you put the wx.Bitmap that we made earlier.

wxStaticBitmap

wxStaticBitmap(parent, id, label, pos

= wxDefaultPosition, size = wxDefaultSize,style = 0, name = "staticBitmap")

Line 35-38:This bit resizes the frame to the size of the picture so the full thing gets shown. First we collect the size of the image we just loaded, then i added a bit to each of the x and y values so it would fit nicely and finally we set the size of the frame to (x,y) that i just made.

The rest: Just the norm to start the program off.

RESULT

VIDEO--(probably by the end o

f the month)

wxPython Tutorial Part 5

Well so far we have covered frames, buttons, dialogs and sizers. Today we will delve into menus. Menus are a really pivotal part to a good looking wxPython program so learning how to use them is a really good idea. We will also start to lean about panels and what they can help us do in wxPython.

Oh i just have a little note, when i do the line by line explaination down the bottom line 1 in the first line of code and line 3 would be the third line of actuall code, i dont count the lines with nothing on them.

Part5
Menus and Panels

To start this one off we need to grab the code that we made in the last tutorial as this is what we are going to add to today, no need to make a whole new program.

import wx


class MainFrame(wx.Frame):
def __init__(self):
#Start the frame
wx.Frame.__init__(self,None,wx.ID_ANY,title='hello world')
#Declare Sizers
self.hbox = wx.BoxSizer()
self.vbox= wx.BoxSizer(wx.VERTICAL)
#TextCtrl
self.text = wx.TextCtrl(self)
self.retext = wx.TextCtrl(self,style = wx.TE_READONLY|wx.TE_MULTILINE)
#Button
self.buthello = wx.Button(self,wx.ID_ANY,label = 'Transfer')
#Setting up the sizers
self.hbox.Add(self.text,proportion = 1,border=0)
self.hbox.Add(self.buthello,proportion =0,border=0)
self.vbox.Add(self.hbox,proportion = 0,border=0,flag = wx.EXPAND)
self.vbox.Add(self.retext,proportion=1,border=0,flag = wx.EXPAND)
self.SetSizer(self.vbox)
self.Show()


app = wx.App(redirect=False)
frame = MainFrame()
app.MainLoop()

Okay so thats where we left off at the end of the last tutorial. We had a large text control and a smaller one and a button. One problem was that nothing happend when you clicked or types things in. So as well as adding a menu we will make an event handler to go with the program.

Our aim is to change the program so that when you type in the top text control and press enter or the transfer button the value is added to the bottom text control. The next thing we want to be able to do is to make the menu have 2 sub menus, File and Help. In file we will have an exit command and in help we will add a help message dialog to appear when you press help.

CODE

import wx


class MainFrame(wx.Frame):
def __init__(self):
#Start the frame
wx.Frame.__init__(self,None,wx.ID_ANY,title='hello world')
#Declare Sizers
self.hbox = wx.BoxSizer()
self.vbox= wx.BoxSizer(wx.VERTICAL)
#TextCtrl
self.menu = wx.MenuBar()
self.file = wx.Menu()
self.help = wx.Menu()
self.SetMenuBar(self.menu)

self.menu.Append(self.file,'&File')
self.exititem = self.file.Append(wx.ID_ANY,'E&xit')
self.Bind(wx.EVT_MENU,self.exitevent,self.exititem)

self.menu.Append(self.help,'&Help')
self.helpitem = self.help.Append(wx.ID_ANY,'&Help')
self.Bind(wx.EVT_MENU,self.helpevent,self.helpitem)

self.background = wx.Panel(self)
self.text = wx.TextCtrl(self.background,style=wx.PROCESS_ENTER)
self.text.Bind(wx.EVT_TEXT_ENTER,self.transevent)
self.retext = wx.TextCtrl(self.background,style = wx.TE_READONLY|wx.TE_MULTILINE)
#Button
self.buthello = wx.Button(self.background,wx.ID_ANY,label = 'Transfer')
self.buthello.Bind(wx.EVT_LEFT_DOWN,self.transevent)
#Setting up the sizers

self.hbox.Add(self.text,proportion = 1,border=0)
self.hbox.Add(self.buthello,proportion =0,border=0)

self.vbox.Add(self.hbox,proportion = 0,flag = wx.EXPAND,border=0)
self.vbox.Add(self.retext,proportion=1,flag = wx.EXPAND,border=0)

self.background.SetSizer(self.vbox)
self.Show()



def helpevent(self,event):
msg = 'Insert help here'
msgbox = wx.MessageDialog(self.background,message=msg,style=wx.OK)

if msgbox.ShowModal() == wx.ID_OK:
msgbox.Destroy()

def exitevent(self,event):
self.Destroy()

def transevent(self,event):
data = self.text.GetValue()
redata = self.retext.GetValue()
self.retext.SetValue(redata+'\n'+data)
self.text.SetValue('')







app = wx.App(redirect=False)
frame = MainFrame()
app.MainLoop()

LINE BY LINE

Line1: Add the wx libaries as usual

Line 10:Welcome to menus, to start a menu we need to make a bar for all the menus to go on, without this the whole thing would be unusable. We dont need any arguments for this.

Line 11,12:Now we make some menu objects. Making menufile and menuhelp means pretty much nothing yet becuase they have menubar to go on and no items in them, all we do is make menu objects so that we can manipulate them later.

Line 13:Here we tell the frame what its menubar is, in this case it is the one we created 3 lines ago.

Line 14:What we are doing here is adding the menu objects we created before to the actual menubar. We also give them ID's and titles. Titles for menus got me very confused when i started becuase i couldn't understand what the '&' sign did. What these mean is that the next character gets turned into a shortcut to access that menu object. To give an example press alt and the f while alt is still held. Your file menu should open in your webbrowser. That is what we are doing here, in out program if we press alt then F the file menu will open, cool huh!

Line 15:Here we add an item to the file menu, note that we still make an instance of appending the menu. The reason we do that is so we can bind the instance to an event. The only arguments you need for that line are the ID of the menu as well as the title.

Line 16:Now we have to bind the menu item to an event. Normally we would do it in the style:

• self.item.Bind(event,method)

But for menus its a bit different;

• self.Bind(event,method,menuinstance)

This is why we need to make an instance when appending to a menu, so we can bind it properly. Note that for menus you use wx.EVT_MENU rather than wx.EVT_LEFT_DOWN.

Line 17-19:Here we just do the same except for the other menu

Line 20: Okay, what is declared on line 20 is a panel. Panels are really useful for organising things in your program. To re-use a metaphor imagine that there is a big table, this is the whole frame. Then panels are almost sub-frames. They are like laying a small tablemat on that table, you can then put things on the tablemat and move it around all you like, without worrying about the actual table. These are really useful when you are using sizers and need to set out things nicely. There are other advantages to Panels you will find with just using them. Any way, back to the actual line. For a wx.Panel the only argument you need is the Parent, in this case the frame. i.e. Self.


Line 24-38: This is what we did last time. Note how we applied the objects to self.background rather than just self. This is becuase we want them to appear on the panel. The rest is still the same from last time. Oh and also, for the object self.text we added style=wx.PROCESS_ENTER. This means you can bind it to events using the wx.EVT_TEXT_ENTER. If we didnt have the process enter, the program would not process it and therefore the action would not be taken when you hit enter.

Method - Transend(self,event): What we are doing in this method is getting the current value of the readonly textctrl and then adding what the user has typed in the other textctrl (you must remember to have self and event in the arguments if a method is used in an event handler). Then the program wipes all the characters from self.text which is the textctrl you can write in.
What we do to start this off is get the value of self.text (the one you write in) and then in one line we set the value of the readonly textctrl by using SetValue(). Then by using self.textin.GetValue() + data + '\n'. That gets the current value of the textctrl and then adds on the data and then goes to a new line.

Finally we set the value self.text as nothing.

Method - Helpevent(self,event):In this one we simply create a textbox using stuff we have learnt before, you can then replace the message with an appropriate text message.

Method - Exitevent(self,event):This just closes the program with self.Destroy(). This (as the name suggests) destroys the frame and then the app.MainLoop() stops due to having no frames or anything going on. If you want to explicitly tell the app.MainLoop() to die you can destroy app by going app.Destroy()

The rest:Just the usual stuff to start the program off.

VIDEO
PART1


PART2

Useful Links for Python

I thought i might get a list of really useful Python links like forums to go to, tutorials to read, modules to download and IDE's that are good fun.

Tutorials

1. You can't go past Guido van Rossum's Python tutorial. Written by the man who made python, the address is:-http://docs.python.org/tut/tut.html
2. This is another good tutorial for the non programmer. This gets a new programmer up and running in minutes. http://hetland.org/writing/instant-hacking.html
3. This is quite a good tutorial as well. It shows a lot of pictures which can be really nice if you like to learn that way. http://hkn.eecs.berkeley.edu/~dyoo/python/idle_intro/index.html

Forums

1. There is a python forum i think is much better then the rest of them, there are really experienced people and they are willing to give their time to help you. The place I'm talking about is DaniWeb. My favourite forum. Address: www.DaniWeb.com/forums/forum114.html
2. There is another forum that is alright but not quite as good as daniweb. It's called Python Forum.org. Its Address is: http://python-forum.org

Modules

1. wxPython. I really can't go past this one can i? I mean i have been praising its name and for a good reason too. wxPython is an awesome GUI. Download is available from here:www.wxpython.org.
2. Pygame. This is a fairly good GUI module and is mainly used for (as the name suggests) games. If you are mainly into making games this might be worth a look. It can be downloaded from here: www.pygame.org

IDE's

1. IDLE. This is the IDE that comes with python so you should already have it installed on your computer. This is a great and simple IDE.
2. PyScripter. This IDE is really good. It works really nicely and also has really good support for debugging, i would recommend this to all people. Address:http://mmm-experts.com/Products.aspx?ProductId=4
3. DrPython. This one is pretty good. It has support for more languages than just python. It has useful tools that will help you program. Address:http://drpython.sourceforge.net/index.php
4. Now usually i don't like things that you have to pay for as I'm sure many of you would understand. With the amount of good free software out there who needs to pay? Well there is one python IDE that i think is actually worth it. Wingware's Python IDE is great. It makes it a charm programming and increases your productivity with all the features that help you along. If you want to check it out i believe it is constantly hanging around as an ad or you can go to:http://www.wingware.com/

Extra Downloads

1. At the moment there is only one thing i can think of that every python programmer should download that does not fit into any of the other categories. The thing I'm talking about is Py2Exe. This is a great program that does exactly what the name suggests, it makes python programs into executable files for use on any computer. You can download it from the following website: http://www.py2exe.org/

Well that's it for now but if i come across anything new that strikes my fancy don't be surprised if this is updated.

wxPython Tutorial Part4

Okay welcome to part 4 of my wxPython tutorial. Today we will learn how to use sizers as well as a bit more on text control

Part4
Sizers

Okay we will start by just making a frame with 2 text controls and a button, no event handling yet. Then we will make it so when you expand the frame everything stays in proportion.
Sizers are a really important tool in any wxPython program so getting to know how to use them is a must.




CODE

import wx


class MainFrame(wx.Frame):
def __init__(self):
#Start the frame
wx.Frame.__init__(self,None,wx.ID_ANY,title='hello world')
#Declare Sizers
self.hbox = wx.BoxSizer()
self.vbox= wx.BoxSizer(wx.VERTICAL)
#TextCtrl
self.text = wx.TextCtrl(self)
self.retext = wx.TextCtrl(self,style = wx.TE_READONLY|wx.TE_MULTILINE)
#Button
self.buthello = wx.Button(self,wx.ID_ANY,label = 'Transfer')
#Setting up the sizers
self.hbox.Add(self.text,proportion = 1,border=0)
self.hbox.Add(self.buthello,proportion =0,border=0)
self.vbox.Add(self.hbox,proportion = 0,border=0,flag = wx.EXPAND)
self.vbox.Add(self.retext,proportion=1,border=0,flag = wx.EXPAND)
self.SetSizer(self.vbox)
self.Show()


app = wx.App(redirect=False)
frame = MainFrame()
app.MainLoop()

LINE BY LINE
Line 1:We start as always import wxPython libraries.

Line 2:We make a class 'MainFrame'. We then put wx.Frame in the brackets. You will know what this does if you have watched the previous tutorial but to run through it again, putting something in the brackets means the class will inherit all its attributes. So in this case once we initialise wx.Frame, the class MainFrame will have all the attributes of wx.Frame. This is really useful.

Line 3-5:In this we start by defining what will happen when the class is initialised. Then we keep going to say 'wx.Frame.__init__(self,None,wx.ID_ANY,title="hello world")' this runs the initialisation program of wx.Frame. Now the class MainFrame has all the attributes of wx.Frame.

Line 6-8:Here is where we set up the sizers. We make one sizer horizontal (sizers default to horizontal) and then we make another sizer vertical by putting wx.VERTICAL in the brackets.

Line 9-11:Here we set some text controls. We do this with wx.TextCtrl, the only argument you need is the parent. The rest are keyword arguments. In the first one we just set the parent as self. Remember self is 'MainFrame'. But since 'MainFrame' has all the attributes of wx.Frame means you are putting your textctrl on a frame.

The second TextCtrl has some different features from the first namely style. Style adds attributes to something so with wx.TE_MULTILINE and wx.TE_READONLY we make the text control multi line and readonly. Note the TE after the wx., this means that it is a text only method. So you can't use these styles on buttons or something of the like.

Line 12-13:Here we just make your average button.

Line 14-19:Well now we have all out components of our program we need to put the in sizers. We do this with the sizer.Add function. There are 4 arguments that can go in the brackets. Those
are window, proportion, flag and border. The window is what you want to go into the sizer. The proportion is a funny one. If proportion =0 then the window will take up as little room as possible but if you have several things in a sizer one thing might have a proportion of 1, another of 4. This would mean that the window with proportion of 1 got 1/5th of the space while the other window would take the rest of the space.

Borders are easy. The number is how many pixels there is a border around it.

Flags are really pivotal to sizers if you want to use their full capacity. A flag tells the sizer what to do when there is space space after somebody re sized the screen or something. A flag of wx.EXPAND will make the sizer and everything inside it to expand to fit into the new space.

Here is a full list of flags:

• These flags are different. These tell the sizer which side the border will be on
  
• wx.TOP
• wx.BOTTOM
• wx.LEFT
• wx.RIGHT
• wx.ALL
• This one is familiar
  
• wx.EXPAND
• This keeps the objects aspect ratio
• wx.SHAPED
• These are used to align the object
  
• wx.ALIGN_CENTER
• wx.ALIGN_LEFT
• wx.ALIGN_RIGHT
• wx.ALIGN_TOP
• wx.ALIGN_BOTTOM
• wx.ALIGN_CENTER_VERTICAL
• wx.ALIGN_CENTER_HORIZONTAL

We now add the text control we can type in to the hbox. This is a horizontal sizer remember. Also remember that which objects you put into the sizer first really matter. When i put the text control in to the sizer it slides it as far as it can to the left. A vertical sizer slides it as far as it can to the top. So anyway, we set the proportion to 1 because we want this to use all the room possible. We then add the hellobutton to the sizer. This will be at the right of the screen when the frame is shown. We set the proportion to 0 so this uses up minimal space.

Now we start using the vertical sizer. We start by adding the horizontal sizer to the vertical sizer with the flag wx.EXPAND. This means of course that the horizontal sizer will expand to fill all room possible. We give this a proportion of zero because we want out other text control to take most of the screen.

Lastly we add the other text control and give it a flag and proportion of 1.


Line 19-20:Here we set the frame's sizer. This means that everything applied in the sizer becomes applied to the frame. Then we set the frame to show by going 'self.Show()'

The rest:Standard stuff we do at the end of every wxPython Program.


VIDEO

Python Programming contest

Well this is for all the Aussie High School Kids out there who learn Python or are Interested in it. The National Computer Science School based in Sydney is running a web based contest where each week problems will be posted and you have the rest of the week to solve them and give your program to the judges.

The fee is $11 but its not much for the amount you will be learning I'm sure. I'm really looking forward to this so if anyone from Australia who is a High School Student is interested here are the details




When: Monday, July 28 for five weeks
Site: http://challenge.ncss.edu.au/
Cost: $11 (inc. GST)

wxPython Tutorial Part3

kay so to sum up, you can now:

1. Make a frame
2. Add a button

The way that we have set out our programs so far is not quite how your meant to though when doing more complex programs. Today i am going to make Frame with a button that when you press it a message appears. As well i am going to use classes to make my program

Part3
Classes, events and MessageDialogs

So how we have been working with up to this point has not really been the way that you program in wxPython. It is good for beginners but to use wxPython well and have a good layout you need to learn how to use classes.

Also a major thing that needs to be learnt is event handling. You want something to happen when you press buttons right? Well that's why you need event handling. It is used for anything pretty much involving clicking and intractability.

So this tutorial if making use of classes, events and MessageDialogs

import wx

class MainFrame(wx.Frame):
def __init__(self):
wx.Frame.__init__(self,None,wx.ID_ANY,title='hello world')
self.buthello = wx.Button(self,wx.ID_ANY,label = 'hello')
self.buthello.Bind(wx.EVT_LEFT_DOWN,self.helloevent)
self.Show()
def helloevent(self,event):
msg = 'hello'
msgbox = wx.MessageDialog(self,message = msg,style = wx.OK)
if msgbox.ShowModal() == wx.ID_OK:
msgbox.Destroy()

app = wx.App(redirect=False)
frame = MainFrame()
app.MainLoop()

Okay for this one i recommend watching the video to get the line by line analysis. Sorry. The video covers anything i would normally write down. If i get time maybe i will update this to also have it in text as well as a video for all the poor people with dial up (my sympathy to you guys).



That's it for now. Tune in later for more tutorials!