In this article, we will learn how to create a standard converter using tkinter. Now we are going to create an introduction window that displays loading bar, welcome text, and user's social media profile links so that when he/she shares his code with some others, they can contact the author using those resources. It looks like a bit lengthy code, but believe me, guys if you start understanding it is so easy and i divided the code into blocks which helps you to understand better.
Steps to create an introduction window:
First of all, "Tkinter" and "webbrowser" modules to be imported.
Create an intro class that fires the introduction window.
Create a Toplevel Tkinter window in order to use full features of a window.
Place a welcome label on the top of the window.
Create one "ttk.Progressbar" which gives us loading effect.
Finally, create four buttons and provide your social media links using "webbrowser" module.
And you have to download/create four images to represent your social media links.
Below is the Intro class implementation :
Steps to create a Converter window:
Create a separate class for the converter window.
We will split the window into two halves horizontally with suitable color combination.
And now we need to create two Tkinter entry boxes, two Tkinter labels, two buttons to activate a list box, one hamburger icon for the menu.
Place the above things at their respective positions using .place method of a Tkinter widget.
Now we need to feed the formulae of each unit, to convert into other units, in separate dictionaries.
Feed the input values in the main function and pass them while initializing or using the setter method of a class
We need to create shift function using which the user will be able to shift from one parameter to another parameter.
Below is the Converter class implementation :
Now create a main function and create a set of dictionaries to feed unit formulae values and call the "intro()" class to fire the converter. Here you can see your contact links, loading bar etc. You will also need to create a "center" function if you want your window to be fired at the center of the screen.
Below is the Full code implementation :
Code block
Output:
Important Points:
You need to install "tkinter" and "webbrowser" libraries.
Creating an introduction window is your choice(It's not mandatory). But I suggest you to create that one also.
You need to create toplevel windows because we can't destroy a main window as it may corrupt all our project.
You don't need to install various IDE's, it works perfectly fine on python IDLE.
Code Explanation:
The code starts by importing the required modules.
The first module is tkinter, which provides the basic functionality for creating graphical user interfaces (GUIs).
Next, the tkinter module helps create a Progressbar object.
This object displays the progress of an operation or task.
Finally, time is imported to help calculate how long it has been since the last sleep command was executed.
Next, the intro class is created.
The _init_() method is used to initialize the class variables and also open a hidden window.
The wind variable stores information about the current window's position and size onscreen.
The resize() method allows you to change these values without closing or reopening the window.
The next line of code uses the deiconify() function to hide the main window and then calls resizable() to make sure that it remains invisible while still allowing users to resize it as needed.
The code firstly creates an instance of the intro class.
This class will be used to display information about the app and its features.
Next, the _init_() method is called.
This method is used to initialize the class variables and also to open a hidden window.
The hidden window will be used to display information about the app and its features.
The last part of this code is used to resize the hidden window if needed.
The code starts by creating a new GeeksforGeeks Unit Converter window.
The window has a label (wind) and a background color (#008080).
The text in the label is "Welcome to GeeksforGeeks Unit Converter!"
The next line of code creates a Label object named entry.
The entry object has the following properties: • x position (50, 30), • y position (30, 50), • width (410, 30), and • height (30).
Next, the code sets up the load bar.
This bar will show how much progress is being made in converting units.
The bar has an orientation property of HORIZONTAL and a length property of 250 pixels.
The mode property is set to "indeterminate."
This means that the progressbar will not display any specific values but will instead remain in an indeterminate state until it is clicked or interacted with.
Finally, the code creates an Analyze() function which will be used later on to perform unit conversions.
The code creates a Label object called entry and sets the text to "Welcome to GeeksforGeeks Unit Converter!".
The label is then placed at (x=50,y=30) with a width of 410 pixels and a height of 30 pixels.
Next, the code creates a Progressbar object and sets its orientation to be HORIZONTAL.
The progress bar's length is set to 250 pixels and its mode is set to "indeterminate".
Finally, the code loads the GeeksforGeeks Unit Converter module onto the screen.
The code starts with a self.start button.
This button opens the converter window.
Next, there is a follow label.
The follow label has the same background color as the start button and has white text on a blue background.
The text says "Follow Me On."
The next part of the code creates two buttons: self.start and follow.
The self.start button is black with a white text box that says "START."
The follow button is blue with white text that says "Follow Me On."
Finally, the code sets up how these buttons will look onscreen by setting their widths and heights.
The code creates a start button and a follow me label.
The start button will open the converter window, while the follow me label will display the text "Follow Me On."
The code starts with a self.git variable that stores the image of your GitHub profile.
Next, there are three buttons: one for Instagram, one for Facebook, and one for Twitter.
The code to create each button is very simple.
The first line creates a PhotoImage object and assigns it to the self.instag variable.
The second line creates a Button object and assigns it to the self.fcb variable.
Finally, the third line places each button on the screen at (x=190, y=190), (x=110, y=190), and (x=350, y=190), respectively.
When you run this program, you'll see three buttons on your screen: one for GitHub, one for Instagram, and one for Facebook.
To use these buttons in your code, you need to add some code to handle user input.
In this example, all three buttons have command properties that allow you to execute arbitrary Python commands when the user clicks on them.
For example: self.instag.command("upload_image") This will upload an image from your computer's hard drive to Instagram using the Instagram API!
The code will create a toolbar at the top of your document that includes buttons for GitHub, Instagram, Facebook, and Twitter.
The buttons will be placed at (x=186, y=150), (x=110, y=190), (x=350, y=190), and (x=-10, y=190).
The width and height of each button will be 30 pixels.
The command attribute of each button will contain a lambda function that will open the corresponding link in a new tab or window.
The code first opens the Google Chrome browser.
It then uses the links() function to open the author's website in a new tab.
The loading() function displays a ProgressBar while the website is being loaded.
Finally, the start() and load() functions are used to position and display the buttons, respectively.
The code will open the link in a new browser window and load the progress bar.
