Making a project in Kivy using .kv file

Question

I am trying to make an app for my android phone for which I am using kivy. In the .kv file I am making a round cornered square using canvas and I want to display some text on it, for which I am using label. The output terminal doesn't throw any error but for some reason the Label is not showing up.

I am adding code of my .py and .kv file below.

My .py file (named : test.py):

import kivy
from kivy.app import App
from kivy.uix.relativelayout import RelativeLayout
from kivy.uix.button import Button
from kivy.uix.label import Label
from kivy.config import Config


kivy.require('1.11.1')
Config.set('graphics', 'resizable', True)


class ImageCompressor(App):

    def build(self):

        # --------------------------------- Main Window -------------------------------------- #

        r1 = RelativeLayout()
        # a = Label(text = "Sample text")
        # r1.add_widget(a)
        return r1

        # ------------------------------- Main Window ends ----------------------------------- #


if __name__ == "__main__":
    app = ImageCompressor()
    app.run()  

My .kv file (named : ImageCompressor.kv) :

<Bubble>

    canvas:
        Color:
            rgb:0,1,1
        RoundedRectangle:
            pos:self.pos
            size:self.size
            radius:10,10,10,10

</Bubble>


<RelativeLayout>

    Bubble:
        size_hint:None,None
        size:200,200
        pos:200,50

        Label:        
            text:'Lower Bubble' 

    Bubble:
        size_hint:None,None
        size:200,200
        pos:200,350    

        Label:
            text:'Upper Bubble'   

</RelativeLayout>

For some reason those two labels with text 'Upper Bubble' and 'Lower Label' doesn't show up. I am adding image of the output also.

Answer 1

You have to use canvas.before to draw background before other widgets.

<Bubble>

    canvas.before:
        Color:
            rgb:0,1,1
        RoundedRectangle:
            pos:self.pos
            size:self.size
            radius:10,10,10,10

</Bubble>

---

BTW: on Linux I had to use lower case name imagecompressor.kv to load it automatically