Creating Apps in Kivy

Chapter 5. Kivy Graphics

Kivy provides sophisticated graphics capabilities using OpenGL and SDL instructions. These can be useful if you’re creating an interactive game rather than an application with widgets.

In this chapter, you’ll learn the basics of the Kivy canvas and graphics primitives. You’ll be creating a set of icons (some animated!) to render on your current conditions screen. These aren’t going to be phenomenal works of art, unless you choose to modify them to be a lot nicer than mine.

If you’re keeping your work in version control, you might want to make a separate branch for this chapter. If not, copy the entire project to a separate directory so you have a backup.

This chapter is a huge amount of fun (at least, it was fun to write!), but you’ll be reverting a lot of these explorations at the end of it. It’ll be easier if you make a copy now.

A Conditions Widget

Start by adding an UnknownConditions widget to the KV file using a dynamic class, as shown in Example 5-1.

Example 5-1. A simple conditions widget

<UnknownConditions@BoxLayout>:
    conditions: ""
    canvas:
        Color:
            rgb: [0.2, 0.2, 0.2]
        Ellipse:
            pos: self.pos
            size: self.size
    Label:
        text: root.conditions

There are a few things to notice about this short snippet. The first is that there is a Label widget, just like you’ve seen in previous examples. I point this out because it is not immediately obvious that you can simultaneously have graphics instructions and child widgets. It is probably more common to do this with layouts ...