Skip to content

Kivy Inspector, debug faster!

GitHub Repository

AI Transcript provided by KivyWhisper

Okay, hello and welcome to Kivy School. Today we're going to be going over the inspector module. Now, what is the inspector module?

So instead of telling you about it, I'm just going to show it. We go poetry shell right here to get into our virtual environment. Then we're going to change directory all the way to here to our inspector example. So cd .. Sorry, we need to go here first. And then Python inspector and then press tab for autocomplete. -m inspector.

Now, this is the old image painter example. And if you press control E, it's going to show you this little toolbar. There's a lot of options.

There's inspect, which basically tells you to what widget you're clicking on.

So what is the inspector module really? It's a way to look at your app and see what kind of widgets you're clicking. And there's other things too. Like if you click this widget right here, you can check the parent, right? Then if you click here, you can check all the attributes that you've set, right? Which is really cool and pretty good if you want to know where you're clicking on.

So why should you use the inspector module? One obvious problem is checking your mouse click and seeing which widgets take up how much of the screen. Now, let's exit this. Okay. So one thing is... one problem I had with image painter was I had to check the bounding box of this area because it's not completely obvious about where widgets are. Sometimes you have to put like a background to see them. But with the inspector, you can just press, okay, let me press control E and then you can check, okay, who am I inspecting?

Like, for example, what's this? This is a label object, right? Did you even know this label was here? Did you know a box layout was here? I wouldn't have even known that unless two things, you looked into the code or inspector showed you.

So where is this label button? One second. Not here. This touch tracer. This is the box layout. Okay. So in touch tracer, in the touch tracer widget, right, there's a canvas. There's an async image where you can load the image. This is the box layout right here. So let's go again. Box layout. There's an image right here, right? There's a label, which is touch tracer, right?

The only reason why the label doesn't show is because it's a white text on white background. But it should be in there because if you check here, let's check the text. It should be here. See text right here. Kivy 2.3.0 touch tracer, right? That's crazy. Inspector is really good. And it's, yeah, they say on the documentation, it's experimental, but for what it does, it's very, very good. It says right here, you know, this module is highly experimental, use it with care. But it does its main job, which is inspect your app. What's going on.

So actually, right, if you press control E, you have inspect, you can see it. You can see all the widgets, right? Like all the widgets, some that you wouldn't even see. So this is a good, really good example, right? I was able to reveal this box layout and this, this box layout and this label and this image, right? Very good to inspect your app because a lot of the times, if you're like just drawing on this canvas, you just wouldn't know. You just wouldn't know they existed, right? Very cool.

And then another thing is like, you can go control E and then check, okay, am I really clicking this button or am I clicking a box layout? Am I clicking this button or am I clicking a float layout, right? Tells you what you're clicking on and you can check the parent too, if the parent is correct. So this button, right, who's a parent of this? Oh, it's a box layout. Who's a parent of this? It's this main box. It's very good for you to really inspect your widget or your widget tree and how it, how it is displayed in Kivy.

So why should you use, okay, this, obvious problem is this. And it was a combination of this and Python debugging tools was how I figured out how to make it so that you don't draw on to the buttons up top. If you want to know more, you can check out the image painter video.

For example, this, okay. Now, how do you use inspector module? There's two ways to use the inspector module. There's two ways to run the inspector module.

The first way is Python main.py -m to specify you're running a Python module and then type the name inspector.

The second way is to import inspector. What you do is you import inspector right here and then you go down here and then you just attach it to a window and any sort of widget.

So here we're just going to attach it to the touch tracer app widget. So I can do Python inspector tech example right here and I can press control E or control E and the inspector will still show up. Right. Okay. And then control E and then control E again to remove. Let's cancel. Control E.

Is there anything cool here? Not really. Okay. And the other way, which I will turn off this inspector and I'll turn off the import Python inspector dash M inspector. Okay. And press control E. You'll still see it and then you can inspect.

Again, pretty cool. Something good that you can use for your own Kivy apps to inspect if things are going wrong to inspect like, you know, what is your button really touching? Right. And then you can also check all the cool details, the parents, the methods.

Article Error Reporting

Message @BadMetrics on the Kivy Discord.