In this article, we will be building a dictionary app with Python and the Tkinter GUI library. The app is going to receive words from the user and it will display their definition. The definition is going to come from a third-party API.
The dictionary should look as shown in the picture below:
Figure 1: The dictionary app
The app has the following dependencies:
We need urllib to make the request to the API, json to read the JSON response of the API and Tkinter for our GUI.
We set up our app, create our app window’s title and icon, initialize the Dictionary class which we are about to show passing it our app and start its main loop.
root = Tk()
root.wm_title(“Fast and Free English Dictionary”)
app = Dictionary(master=root)
def __init__(self, master):
self.input = None
self.responseText = None
Whenever a Dictionary gets instantiated we initialize the GUI and our dictionary through the initializeDictionary method.
The initializeDictionary method sets up an Entry widget (which is similar to <input>in HTML) and attach its value to the class property input. Then, we can get what the user has typed through that property or modify it. We actually set the input’s text to “Enter your word here”when the dictionary startsso that the user can see where he has to type the word that he is seeking a definition for.
We change some UI keys of the Entry widget and add a button which when clicked would call the findWord method of our Dictionary class. We also set up a Scrollbar widget. The Scrollbar will be used to scroll across the definitions if they are longer than the screen’s vertical real estate.
self.input = StringVar() self.scrollbar = Scrollbar(self)
self.scrollbar.pack(side = RIGHT, fill=BOTH)
input = Entry(self, textvariable=self.input)
self.input.set(“Enter your word here”)
input[‘bg’] = “#000”
input[‘fg’] = “#fff”
input[‘borderwidth’] = 5
input[‘width’] = 20
input[‘font’] = (“Comic Sans MS”, 25)
input[‘relief’] = ‘flat’
btn = Button(self, text=“Define”)
btn[‘width’] = 20
btn[‘bg’] = “green”
btn[‘font’] = (“Comic Sans MS”, 25)
btn[‘fg’] = “#33aa55”
btn[‘command’] = self.findWord
The findWord method makes an HTTP request to the API passing it the user’s input (remember that our input property will be updated whenever the Entry widget’s value changes). Then, we parse the JSON returned by the API and loop over each word that the API returns (the API can return different word definitions with the word as a noun, as a verb and so on) and try to make the JSON presentable for our UI. We take advantage of newlines and add them after each word, after the forms of the word and after each specific word definition. We use the out variable to prepare the string that we will pass to the Text widget. If the user has already been shown a text widget, we remove the old Text widget (with the help of pack_forget) and add the Text anew. Notice that we pass the scrollbar’s set method in yscrollcommandwhen building up the Text widget – we do this because we want for users to be able to scroll down/up with their mouse when reading the text. We also add a command to our scrollbar which would scroll the Text widget according to the user’s interactions with the scrollbar’s UI.