How can I add text on my round rectangle and/or change the background on kivy?

Question

main:

from kivymd.app import MDApp

class DeliveryToday(MDApp):
    def build(self):
        return

DeliveryToday().run()

kv

MDScreen :
    canvas.before:
        Color:
            rgba: (.4,.4,.4,1)
        RoundedRectangle:
            size : self.width/2, self.height/3
            pos : self.center_x - self.width/4 , self.center_y - self.height/6                         
            radius: [(40, 40), (40, 40), (40, 40), (40, 40)]

I am a beginner at kivy and just started making this round rectangle. I wish to add text ON the round rectangle saying "Welcome" but am a bit confused on where and how I should add it as obviously it won't work on the canvas, or will it? (I am a tkinter person and it works on the canvas there so its a bit weird).

Also I wish to change the background of the rectangle from to blue (it is currently white) and tried a couple things there like background_color and stuff but that doesn't seem to work either.

Any advice on how I could do either of this would be appreciated. Thank you!

Maybe this one answers your question: https://stackoverflow.com/a/33496459/5430833 — Marek Piotrowski, Aug 14 '20 at 22:33
I had seen this already and didn't really get it because of the kv file I have — khushi, Aug 14 '20 at 22:38
I believe you could attach to MDScreen 'render' method somehow... — Marek Piotrowski, Aug 14 '20 at 22:48

score 1 · Answer 1 · answered Aug 14 '20 at 23:46

I changed your main layout for more understandable for everyone. Also added to black background to your screen for show you how to make it and for everyone eye's health :) (I know you didn't ask it but may be needed for others) As you want you can easily change your Rectangle's or Ellipse's color easily.Just change rgba for that. [R]ed,[G]reen,[B]lue,[A]lpha. So lets make blue's and alpha's value to 1 (Its change between 0-1). And for this example, if you add any label to your screen , your text appears on middle of screen. Because Label's default text_size: self.size and, default halign:'center' (horizontal align) and valign:'center'(vertical align). Check below for see all these as code:

from kivymd.app import MDApp
from kivy.lang import Builder
kv = Builder.load_string('''
BoxLayout:
    canvas.before:
        Color:
            rgba: 0,0,0,1
        Rectangle:
            size: self.size
            pos: self.pos
    canvas:
        Color:
            rgba: (0,0,1,1)
        RoundedRectangle:
            size : self.width/2, self.height/3
            pos : self.center_x - self.width/4 , self.center_y - self.height/6                         
            radius: [(40, 40), (40, 40), (40, 40), (40, 40)]
    Label:
        text: 'Welcome'
''')

class DeliveryToday(MDApp):
    def build(self):
        return kv

DeliveryToday().run()

Wow this worked so well! Out of curiosity, am I able to add other widgets here too like a button? — khushi, Aug 15 '20 at 13:59

score 1 · Accepted Answer · answered Aug 15 '20 at 23:56

For your comment question: [am I able to add other widgets here too like a button?]

Check this code below. I set button's background_color's alpha value=.5 for you to see how it works. You need to change it's alpha to 0 and it gonna work like as button. You can design your own buttons like this way.But first, you should start to learn KivyMD for more button (&other things) styles.

from kivymd.app import MDApp
from kivy.lang import Builder
kv = Builder.load_string('''
FloatLayout:
    id: layout
    canvas.before:
        Color:
            rgba: 0,0,0,1
        Rectangle:
            size: self.size
            pos: self.pos
    canvas:
        Color:
            rgba: (0,0,1,1)
        RoundedRectangle:
            size : self.width/2, self.height/3
            pos : self.center_x - self.width/4 , self.center_y - self.height/6                         
            radius: [(40, 40), (40, 40), (40, 40), (40, 40)]
    Button:
        size_hint:None,None
        size : layout.width/2, layout.height/3
        pos : layout.center_x - layout.width/4 , layout.center_y - layout.height/6    
        background_color: 1,0,0,.5
        text: 'Welcome'
        on_release: print('Clicked Button')
''')
class DeliveryToday(MDApp):
    def build(self):
        return kv
DeliveryToday().run()

I changed boxlayout to floatlayout.Because boxlayout doesn't let me give its widgets freely positions.Other thing, changed Label to Button.Lastly i gave floatlayout an id and used it for get its position and size. You can also do this in different ways.This is one of that ways.

How can I add text on my round rectangle and/or change the background on kivy?

2 Answers2