Paul Sutton

programming

Addition Application

So following on from the previous posts, I am how sharing a small application, that makes use of what we have been learning.

This presents 2 input boxes and an output box, any values entered in to the first two, the sum is placed in to the last box.

addition app

This is not perfect, but getting there slowly.

We need to:-

  • Fix the name of the button from button1
  • Detect if the user has entered numerical values
  • Detect for empty boxes
  • Make labels more useful
  • Fix spelling in comments
  • Fix clarity of comments

The code for the above is as follows.

#!/usr/bin/env python
import Tkinter # note use of caps
from Tkinter import *

window = Tk()
window.title('App 1')
window.geometry("650x125") # w x h
window.resizable(0,0)

#define button actions
def btn1():
	#convert box text in to integers	
	ent1 = int(entrytext.get())
	ent2 = int(entrytext2.get())
	
	#add the 2 integers and store in variable add
	add = (ent1 + ent2)
	print add
	
	#instert value add in	to box outtext 
	outtext1.insert(0,str(add)) # insert response
	
btn_tog2 = Button( window, text ='button1', command=btn1)
btn_exit = Button( window, text ='exit',command=exit)	

# define some labels
box1 = Label(window, text="Entry 1: ")
box2 = Label(window, text="Entry 2: ")
box3 = Label(window, text="Ouput1: ")

#define entry box 
entry1 = StringVar() # this is our entry box
entry2 = StringVar()
entrytext = Entry(window, textvariable=entry1) # this is our entry box
entrytext2 = Entry(window, textvariable=entry2) # this is our second entry box

#define out box 

entry2 = StringVar() # this is our output box
outtext1 = Entry(window, textvariable=entry2) # this is our output box

#display boxes
entrytext.grid(row = 3, column = 2,)  #display entry box
entrytext2.grid(row = 3, column = 3,)  #display entry box
outtext1.grid(row = 3, column = 4,) #display output box

#place labels
box1.grid(row = 1	, column = 2, padx = 5, pady = 5)
box2.grid(row = 1	, column = 3, padx = 5, pady = 5)
box3.grid(row = 1	, column = 4, padx = 5, pady = 5)

#buttons
btn_tog2.grid(row = 3, column = 5, padx = 5, pady = 5)
btn_exit.grid(row = 3, column = 6, padx = 5, pady = 5)

window.mainloop()

#python, #tkinter, #programming, #python, #graphic, #applications, #bugs, #troubleshooting, #howto, #paignton, #library, #virtual, #codeclub

Happy to provide help and support via decentralised social media. I can be contacted on Mastodon here. You can get a free account on the http://qoto.org instance by following this link.

cc-by logo

Licenced under Attribution 4.0 International (CC BY 4.0)

More improvements

Adding labels

So last time we added some text boxes and made the application a little more presentable. Now we are going to do is add some labels above the boxes to help describe what they do.

Add this above were we define the entry boxes

# define some labels
box1 = Label(window, text="Entry 1: ")
box2 = Label(window, text="Entry 2: ")
box3 = Label(window, text="Ouput1: ")

Now add this below where we place the entry boxes but above window.mainloop()

#place labels
box1.grid(row = 1	, column = 2, padx = 5, pady = 5)
box2.grid(row = 1	, column = 3, padx = 5, pady = 5)
box3.grid(row = 1	, column = 4, padx = 5, pady = 5)

So here we have a window, with three text boxes.

app1

So again we have something that looks a little more like an application.

#tkinter,#python,#gui,#programming.

Tidying up our application

So my last post produced something that did not really look very good. So I have now tidied the code up a little bit to make it look better.

So one of the useful things within this is to adjust the dimensions of our application, so everything fits in to the window area nicely, but not leave too much empty space.

#!/usr/bin/env python
import Tkinter # note use of caps
from Tkinter import *

window = Tk()
window.title('App 1')
window.geometry("600x50") # w x h
window.resizable(0,0)

#define entry box 

entry1 = StringVar() # this is our entry box
entrytext = Entry(window, textvariable=entry1) # this is our entry box
entrytext2 = Entry(window, textvariable=entry1) # this is our second entry box
#define out box 

entry2 = StringVar() # this is our output box
outtext1 = Entry(window, textvariable=entry2) # this is our output box


#display boxes
entrytext.grid(row = 3, column = 2,)  #display entry box
entrytext2.grid(row = 3, column = 3,)  #display entry box
outtext1.grid(row = 3, column = 4,) #display output box


window.mainloop()

So here we have a window, with three text boxes.

app1

Which is starting to look a little better. The main bit of advice I can give here, is test, test and test again, that way you know your application is working as you go.

#tkinter,#python,#gui,#programming.

More tkinter : Add entry and text box

This code adds a box to our application, a box can serve either as a text output box OR a text entry box.

Note I have included the whole program here. I have also defined the size of our application.

While the window is bigger and the boxes are at the top, the idea is that it just displays those boxes. We can tidy things up later.

#!/usr/bin/env python
import Tkinter # note use of caps
from Tkinter import *

window = Tk()
window.title('GUI Tkinter 1')
window.geometry("300x250") # w x h
window.resizable(0,0)

#define entry box 

circleVar = StringVar()
circletext = Entry(window, textvariable=circleVar)

#define out box 

circleVar2 = StringVar()
circletext2 = Entry(window, textvariable=circleVar2)

circleVar2 = StringVar()
circletext2 = Entry(window, textvariable=circleVar2)


#display boxes
circletext.grid(row = 1, column = 2,)
circletext2.grid(row = 2, column = 2,)


window.mainloop()

We get:

tk label

#tkinter,#python,#gui,#programming.

More tkinter : Combine buttons and labels.

Now that we can add a label and a button, it is time to combine the two. The following code does this.

#define functions for button(s)
def btn1():
	print ("button pressed")
	
	
#create button object	
btn_tog2 = Button( window, text ='button1', command=btn1)
btn_exit = Button( window, text ='exit',command=exit)	

#place button object
btn_tog2.grid(row = 1, column = 2, padx = 5, pady = 5)
btn_exit.grid(row = 2, column = 2, padx = 5, pady = 5)

#define labeles
button1 = Label(window, text="press button")
button2 = Label(window, text="exit program")

#place labels
button1.grid(row = 1, column = 1, padx = 5, pady = 5)
button2.grid(row = 2, column = 1, padx = 5, pady = 5)

We get:

tk label

#tkinter,#python,#gui,#programming.

More tkinter : Adding buttons

So to carry on with some basic tk development, Once we can add a label, we add buttons. While buttons have a built in label, the label widget could be useful to add more description to that area of the application.

def btn1():
	print ("button pressed")
	
btn_tog2 = Button( window, text ='button1', command=btn1)
btn_exit = Button( window, text ='exit',command=exit)	


btn_tog2.grid(row = 1, column = 1, padx = 5, pady = 5)
btn_exit.grid(row = 2, column = 1, padx = 5, pady = 5)

We get:

tk label

With this we have added an event, so in this case the btn_tog2 runs the function btn1 which prints “button pressed” to the console.

#tkinter,#python,#gui,#programming.

More tkinter development

So further to yesterdays post

The next step is to add some widgets to our application. It is generally useful to label any items. That way a user knows what purpose an entry box has.

If we take the code block from yesterday and add

#define labeles
box1 = Label(window, text="Entry 1: ")

#place labels
box1.grid(row = 1, column = 1, padx = 5, pady = 5)

before the window.mainloop() statement.

We get:

tk label

#tkinter,#python,#gui,#programming.

Tkinter Development

A few years ago, I created a resource to explain how to create use some of the widgets within tkinter. This is a Python widget for creating graphical user interfaces (GUIs).

The following code is what you need to get started. This creates, just a single application window.

#!/usr/bin/env python
import Tkinter # note use of caps
from Tkinter import *

window = Tk()
window.title('GUI Tkinter 1')
window.geometry("300x250") # w x h
window.resizable(0,0)

window.mainloop()

This produces

tk window

Over the next few days, I will make more posts covering adding labels, buttons and entry / text boxes.

Hopefully it will be of use to someone.

#tkinter,#python,#gui,#programming.

More Trinket Coding

Trinket is a web based development platform. One of it's features is the programming language blocks, which is in fact a block based front end and creates Python programs.

I am sharing these on my blog today, even though I also shared earlier in the week on LinkedIn and also on Twitteras part of the Paignton Library Virtual Code Club.

Drawing a circle

circle1

And the associated output

circle1

Drawing a star

star1

And the associated output

star2

I am working on a book to update my previous Nested loops guide I wrote a few years ago. This needed updating anyway so it would cover Scratch 3.0. This book / guide is work in progress, and will be typeset in $\LaTeX$ using Overleaf

#programming, #trinket, #Blocks, #python, #WebIDE, #LaTeX, #Overleaf, #nestedloops, #loops, #codeclub

cc-by logo

Licenced under Attribution 4.0 International (CC BY 4.0)

This post is NOT endorsed by FreeBSD.

I am creating this post to try and bring together some information on how to get involved with the FreeBSD project. I am not a developer in this project. This information may simply be useful as it points to various related resources.

It would be really good to get a Devon based developer / tester community set up, where people can work together, learn essential computer skills, have fun, be social but at the same time develop some real world developer / work skills that can be useful later on.

Being part of any developer community can also open up doors. Learning c / c++ for example is useful, but as would learning shell scripting.

Resources

1 FeeeBSD Project 2 About FreeBSD 3 FreeBSD Developer Handbook 4 FreeBSD Twitter 5 Default Shell 6 tcsh tutorial 7 sh tutorial 8 Repl.it 9 Developer roadmap 10 CodeCademy 11 Freshports

#FreeBSD. #Development, #Get, #Involved, #programming, #documentation, #testing

You can find me on Friendica at [email protected]


cc-by logo

Licenced under Attribution 4.0 International (CC BY 4.0)