Rounded Buttons With Kivy – Python Kivy GUI Tutorial #22

In this video I’ll show you how to create rounded buttons with Kivy.

Rounded buttons are actually pretty easy to make with Kivy. We’ll just use the Canvas and create a roundedrectangle that we define with the color and radius that we want.

It’s pretty straight forward!

Python Code: round_buttons.py
GitHub Code: round_buttons.py

from kivy.app import App
from kivy.uix.widget import Widget
from kivy.lang import Builder
from kivy.core.window import Window

# Designate Our .kv design file 
Builder.load_file('round_buttons.kv')

class MyLayout(Widget):
	pass

class AwesomeApp(App):
	def build(self):
		Window.clearcolor = (1,1,1,1)
		return MyLayout()

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

Kivy Design Code: round_buttons.kv
GitHub Code: round_buttons.kv

<MyLayout>

	BoxLayout:
		orientation: "vertical"
		size: root.width, root.height

		padding: 50
		spacing: 20

		Button:
			text: "Hello World!"

		RoundedButton:
			text: "Goodbye World!"
			pos_hint: {'center_x': 0.5}
			size_hint: (1, .3)
			#background_color: (48/255,84/255,150/255,1)
			#background_normal: ''
			on_press: print("Goodbye!")


<RoundedButton@Button>
	background_color: (0,0,0,0)
	background_normal: ''
	canvas.before:
		Color:
			rgba: (48/255,84/255,150/255,1)
		RoundedRectangle:
			size: self.size
			pos: self.pos
			radius: [58]