Kivy Part 32 – Kivy ids

Today we’ll learn how to reference widgets using ids. We’ll make use of the two test files again.

But before we delve into the topic, here’s some info for you.

*****

Book Info

I just published my Kivy book, GUI Programming with Python and Kivy. It’s pretty long (over 800 pages) and comprehensive. And, which also counts, easy to read. The book contains lots of illustrations.

This book covers all the basics that you need to know to start programming GUI applications with Python and Kivy. Throughout the book we are building a GUI application from scratch, a fully functional game using all kinds of tools that Kivy has to offer. It’s our Slugrace project, but covered in a much more in-depth manner.

Each part of the book starts with a theoretical introduction of a topic or idea that we then implement in the project. I assume you have no prior knowledge of the Kivy library, but you should have at least some basic knowledge of the Python programming language, including the object-oriented programming paradigm as this is what we will be using a lot in this book.

The book covers all the basic elements of Kivy that you have to know, like widgets, layouts, Kivy ids and properties, graphics, screens, animation, sound. Finally we’ll deploy the app to Windows. It is pretty comprehensive and after you finish it, I’m sure you’ll be able to create your own awesome GUI apps of any kind, not just games.

I hope you will have at least as much fun reading the book as I had writing it.

As far as this Kivy series is concerned, the following parts will contain the most important elements covered in the book. However, some elements will be presented in a simplified way here on my blog or omitted completely.

____________

If you are interested, you can purchase the book in four versions. Here are the links:

1) ebook – pdf version on my website – in full color

Here you can see the description of the book, sample graphics from the book and the full table of contents.

2) ebook – Kindle version on Amazon – in full color

3) paperback version on Amazon – in black and white

4) paperback version on Amazon – in full color

*****

And Now Let’s Move On…

Here’s the code we’re going to use:

# File name: test.py

import kivy
from kivy.app import App
from kivy.uix.boxlayout import BoxLayout

class TestLayout(BoxLayout):
    pass

class TestApp(App):
    def build(self):
        return TestLayout()

if __name__ == '__main__':
    TestApp().run()

And here’s the kv file:

# File name: test.kv

<TestLayout>:    
    Button:
    Label:
    Button:

As you can see, the code is very simple. We didn’t set the text property on any of the widgets. We will do it using ids, both in kv and in Python.

If you run the app, you will see the following:

Now let’s add some ids. We only have to add them to the widgets that we want to reference. We can use any string for an id, but to make them stand out in our code, I will start their names with an underscore. This is by no means necessary, but this convention is pretty often used.

So, here’s the code with the ids. You can also see how these widgets are referenced by other widgets:

# File name: test.kv

<TestLayout>:     
    Button:
        id: _button1
        # This button should display the text from the label.
        # _label is the id of the label.
        text: _label.text

        # When the button is pressed, the set_text method
        # defined in the TestLayout class should be called.
        on_press: root.set_text()

    Label:
        id: _label
        text: 'hey'

    Button:
        # This button should display the string representation
        # of the size property on the first button. We
        # are referencing the button by its id.
        text: str(_button1.size)

If you now run the program, you will see the text properties set:

Kivy ids in Python Code

If you want to reference the ids in Python code, you can use the ids property. Let’s demonstrate it on the example of the set_text method defined in the TestLayout class. This method is called when the first button is pressed. Suppose we want the method the set the text property on the label to ‘CHANGED’. First, we have to reference the label in Python code. Have a look:

# File name: test.py

...

class TestLayout(BoxLayout):
    def set_text(self):
        self.ids._label.text = 'CHANGED'

...

The ids are accessible inside the rule where they were added. In our case, they are accessible inside TestLayout, which is the parent of the button. So, from the ids inside the TestLayout we selected _label that references the label and set its text property to a new value.

And now watch what happens when we run the app and press the first button:

The text changed not only on the label, but also on the first button. Why is that? Well, if you look at the text property on the first button, you will see that it is set to the value of the text property on the label:

# File name: test.kv

<TestLayout>:     
    Button:
        id: _button1
        text: _label.text
        on_press: root.set_text()

    Label:
        id: _label
        text: 'hey'

    Button:
        text: str(_button1.size)

Properties react to all changes, so if there is a change in the text property on the label, the change will be visible also on the button.

We will be using ids extensively in our project. But first of all, we’ll be using them to reference widgets by means of custom properties. Kivy properties are very powerful and we’ll be using them a lot. In the next part we’ll be talking about the basics of properties and we’ll see how to use them to reference widgets.