Python Tkinter Loading/Splash Screen Using a GIF & Multithreading to Run a Task in Background

gifts are often used to create animations in loading screens but there is a problem in tkinta there isn't a simple way to play them and also perform other tasks with your python code at the same time like for example loading something in the background to be honest there is actually a fairly simple way to do that using multi-threading and that's what you're gonna learn in this video by the way before you get started if you're here I'm sure you want to become a programmer and yes here on YouTube you can learn a lot but one of the best ways to actually improve especially if you want to turn this into Korea is to take some courses made by experts in the field usually these courses are structured in a way that makes it easier for you to learn properly and I've selected for you some of the best courses and learning platforms you'll find the links in the description down below and by using those links you're gonna help this channel as well so first of all we need to import TK inter s t k yeah I'm going to import time and threading and then foam pill I'm going to import image image TK like that if you don't have pill installed this is just a library for the images so you can install it by doing something like pip install pillow or P3 install pillow all right so in this video as usual I'm gonna use a class structure if you don't know what a class is and how to use it then I highly recommend you go and watch my series on classes to have a better understanding of this video but also have a better understanding of object-oriented programming as well so you'll find the link in the description box down below so first of all let's start with class my up I'm gonna inherit from frame like that then you need itself root and then I'm gonna call Super as I said if you don't know what I'm doing I really recommend you go and watch my series on classes then root background white like that and then down here shelter main frame able to solve this is not really needed but it's just to make things easy to to understand because otherwise there would be like self pack etc etc and it doesn't make sense because it looks like an instance method of the class so if you use Mainframe instead of self is better all right so I'm gonna do something like this and fill TK both spawn true Mainframe column configure zero weight one and then zero wait one all right and now we can add the code needed to actually run the application so down here we can actually add root TK TK like that title I'm gonna call it just might up root geometry 300 by 400. I don't want this to be resizable so I'm just going to do something like with false and height pause and of course I need to create an instance of my app so my app instance and I'm going to do something like my up root like that and then we need to call the main Loop to actually see something on the screen okay so if we run that you can see a little application all right perfect so now I'm going to copy and paste three methods that are needed to run the GIF because we are actually going to use a gif as the loading screen all right and I have it here as you can see loading okay right so I'm just going to copy and paste them and I've actually explained them in another video so go and watch that to learn more and also to actually see the code of its Method All right so okay so here I have my methods okay as I said to see the code go and watch the other video I'll leave the link in the description box down below and in the cards up above so that you can actually understand how that works right so let's now create a method that will load all the initial widgets okay so basically the first thing the user sees when they open the application by the way if you want to support the channel there are different ways to do that you can make a one-up donation become a member of my patreon or even use the affiliate links below to get amazing things like professional courses to up your game you'll find everything in the description down below and thank you so so much for this report so that create of course I'm keeping everything really really simple in this video so now I'm going to create a button that if pressed will start a task that takes some time okay so let's actually create a function here so let's button command and I'm just going to do something like time to sleep five like that and then of course we need to create a button right so here you've got the command and then we need to create the button so button button and then we're going to do something like self Mainframe text start with 10. height to and command button command all right and of course we need to place it inside the frame so column zero row zero of course so as you can see here I haven't used an instance variable but only a local variable because I don't need to use these variables in other methods if you need them of course you need to use instance variables all right so now we can call the method and we can actually do that down below so we can go down here and we can call it here so my app instance we can call create initial widgets like that but I usually do this in the init method so actually I don't do this here but I do this here like that right in the init method so this is called as soon as the application starts and of course here instead of this we need to use cell like this so now if we actually run the application we see this little start button and if you click on that everything freezes for five seconds and then it starts working again right so now we want to actually create a second page that will be shown after the task has ended and once we've done it we can actually add the loading screen as well all right so let's close this all right so down here we can actually create a new method show results something like that which will actually load the second page so first of all we want to delete everything from the window and just keep the Mainframe okay and we can do this by looping through all the children of the Mainframe and in this case we just have the bottom but you might have more widgets right so for child in so Mainframe info children child destroy like this all right then once we've removed all the children we can actually create a label with the results okay I'm keeping this really really simple because the purpose of the video is not to create a cool graphic user interface but it is to actually create the loading screen to actually show you how to create that so once we've removed everything from the application we can then as I said create a label so results label it's going to be TK label cell let's go up a little bit all right so self main frame BG white background border zero highlight thickness zero in text result which is here all right and then of course as usual we need to place it using grid zero row zero of course now if you want this to be called after the task let's call it task has ended then we need to actually call this function here we need to call it in here okay so button command and then after five seconds we call Self show results here we can place like results all right this is just to show you okay so let's actually try to run this and see what we've got everything freezes all right and then after five seconds results okay so now instead of seeing everything blocked everything Frozen while the task is doing what it needs to do okay loading the application or whatever we want to show the loading GIF but of course if python is performing the task in the background TK inter cannot refresh the screen and therefore they give can't run and be shown so what we need to do is run the task on a different thread and play the GIF on this main thread alright so I'm gonna create a new method called loading so let's actually do this down here I'm gonna call this method loading so then we destroy everything so we need to delete everything from the window frame children and then we need to create the label for the gift to run on Okay so loading label it's going to be TK people sell Mainframe background white border zero highlight thickness zero okay and then same thing down here loading label grid column zero and row zero okay perfect so basically what I want to do is I want to have the first screen with a button and then the loading screen with the GIF and then after the task has ended so basically after five seconds in this case then I want to see the results okay so I want to be able to actually show something to the user while I'm doing something else another thread so now I need to get my frames so itself I'm gonna call get frames okay and this GIF actually has a white background as I said in another video gives with transparent background don't work as expected so the GIF should have the same background as your frame basically in this case I have a white background and the GIF has a white background okay and then I'm gonna call so play label frames and this should take care of the GIF but now we need to set up the thread for the task so let's go up here button command all right so here instead of running the touch directly in this function we can run it in another function and use this just to start the new thread that will run the task so I'm just going to create a new function down here task cell and then here I'm going to paste this all right I've actually created the new method for the task in this case and up here we are going to use this command the button command which is the function that is called when you click the button to start the thread that will run this all right so how can we do this by the way I've actually made a video on how to use multi-threading and stuff like that so if you're interested I'll leave the link in the description box down below so here we can do something like foreign threading thread Target and then cell task like this and then we are going to start it like that and at the same time we're also going to call loading okay so basically here when we click the button right we start a new thread and inside the thread this is running okay so this function is running inside the thread inside a different thread the main thread is actually going to run self loading which will show the loading screen so let's actually try to see what we get by the way if you're enjoying the video do me a favor and like it and also subscribe to the channel as well because I'm gonna post a lot of videos like this one and you don't want to miss them so let's go down here and let's see all right so let's actually click Start as you can see it's working and after five seconds results but down here we see this error here so everything is working but you see this error here right and it keeps scrolling down down down down as you can see here it keeps creating errors and errors and errors so let's actually stop it right by the way if you want to support the channel there are different ways to do that you can make a one-up donation become a member of my patreon or even use the affiliate links below to get amazing things like professional courses to up your game you'll find everything in the description down below and thank you so so much for the support so basically when we want to show the results we destroy the label in which we are displaying the GIF so if you watch the other video where I explain you how to actually play the GIF you should know that to play the GIF we are actually scheduling events in the future so what happens is we destroy the label but then we still have events in the future that are used to change the image of the label but since the label is not there anymore then we get the error because basically you're trying to change the image of something that doesn't exist anymore so in this case we need to edit the next frame method so we're going to actually change the code in here so as you can see even if you have the code that works as expected in most situations for example in this case we have the code to play the GIF that can be used for every program but sometimes you might need to change it slightly but I don't think it's a problem because we're programmers so we actually need to be able to do that okay so let's see how we can change it so basically when we try to change the image we need to actually handle the exceptions so that when we actually get the error because we don't have the label anymore we can actually handle it so down here instead of having just this code we can do something like try and then we try to change the image of the label then except TK dot TCL error okay which is the one that we actually get and here I'm actually going to print something so you can see what I mean so print I'm going to do something like TC arrow and then we can actually return okay so basically let's say that we destroyed the label and we still have six events scheduled to change the last six frames give them for six times python will just return because we are handling the TCL era and we don't get any error basically so let's actually try to run it and see what we get Okay so five seconds okay as you can see you get this it keeps running so you've got a lot of TCL errors so why do they keep running so let's actually stop that all right so as you can see there are a lot right so basically when we destroy the label a cycle of the gift is still running and going back to the example I made earlier let's say that we still have six frames for example the frames of that cycle finish but then a new cycle starts up here as you can see it starts a new cycle so basically the code keeps creating events even if the label is not there anymore this is not a problem because the user wouldn't even notice it because you are handling the exceptions so basically without this print TCL error you wouldn't see anything on the screen but it doesn't make sense to keep scheduling events if you're not actually doing anything right so to actually fix this we can do something like this so up here we can do something like try label config and then except TK TCL around and I'm just going to print just to show you so last TCL error okay and then return so basically if restart is true which means that it's time for a new cycle to start if the label is not there anymore then we call to label.config is going to throw an error a TCL error and we're just going to return and the code down here wouldn't run so you don't shadow new events and everything stops basically all right so let's actually see if that works as expected so let's run it start all right five seconds then the errors so in this case you still had one two three four five six frames and then the cycle ended and you get this because you try to restart here you try to actually call label.config the label is not better anymore and then you print this and you return and you have this application of course here you would have something else of course you can use this whole concept to create loading screens in various scenarios this is just an example that I think is quite useful now on the screen there is another video about TK in time pythons to go and watch it also don't forget to check out all the links in the description box down below to take your programming skills to the next level like the video and subscribe to the channel for more videos like this and I'll see you in the next one bye

Channel: Fabio Musanni - Programming Channel

Views: 5,618

Keywords: python, python3, programming, coding, learn python, python tutorial, python for beginners, how to run gif files in python, how to play gif images in python tkinter, how to display gifs in python, loading screen in tkinter, splash screen tkinter, gif as loading screen in tkinter python, how to create splash screen animation in tkinter, loading screen in python tkinter gui, gui loading screen in python, tkinter python loading screen multithreading

Id: A9mxZGV_zmI

Length: 18min 27sec (1107 seconds)

Published: Wed Oct 04 2023