0

When I use the RoundedRectangle in Kivy, the rounded corners are jaggy (not smooth).

Is it possible to create a smooth rounded button (with transparent corners)?

Here is my test code:

import os
os.environ['KIVY_GL_BACKEND'] = 'angle_sdl2'
from kivy.app import App
from kivy.lang import Builder
from kivy.uix.anchorlayout import AnchorLayout

class MyLayout(AnchorLayout):
    pass

Builder.load_string('''
<RoundedButton@Button>:
    size_hint: (None, None)
    size: (200, 50)
    background_color: 0,0,0,0  # alpha=0
    canvas.before:
        Color:
            rgba: (.4,.4,.4,1) if self.state=='normal' else (0,.7,.7,1)  # visual feedback of press
        RoundedRectangle:
            pos: self.pos
            size: self.size
            radius: [self.size[1]//2]

<MyLayout>
    anchor_x: 'center'
    anchor_y: 'center'
    RoundedButton:
        text: 'Rounded Button'
''')

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

TestApp().run()

Note: because the configuration os.environ['KIVY_GL_BACKEND'] = 'angle_sdl2' you might need Windows OS with DirectX to reproduce this code exactly. See Kivy issue #6276.

hc_dev
  • 8,389
  • 1
  • 26
  • 38
BinaryMonkey
  • 331
  • 1
  • 13
  • Are you building the app for android? It gets a way smoother when it is compiled and installed on your android phone than it looks when you start your application for example on windows. You can try your code in the kivy launcher application to get a first impression. – MisterNox May 06 '20 at 06:47
  • On Linux, after commenting out `os.environ['KIVY_GL_BACKEND'] = ...`, the button appears perfectly round on the left and right; see [screenshot](https://i.stack.imgur.com/h1JGA.png). – bitinerant May 06 '20 at 08:36
  • 1
    I can also recommend KivyMD. They have a nice [variety of beautiful buttons](https://kivymd.readthedocs.io/en/latest/components/button/index.html). [MDFillRoundFlatButton](https://kivymd.readthedocs.io/en/latest/components/button/index.html#mdfillroundflatbutton) might be what you want. – bitinerant May 06 '20 at 08:38
  • @bitinerant, unfortunately your screenshot does not show soft rounded edges. We can see a staircase pattern on the border, like old graphics from the 90's. – BinaryMonkey May 06 '20 at 20:33
  • @MisterNox, no, I'm on Wondows 10. – BinaryMonkey May 06 '20 at 20:33
  • @bitinerant, thanks for the KivyMD suggestion. It does not solve this problem, but offers really interresting widgets – BinaryMonkey May 06 '20 at 20:34
  • Not reproducible on Linux. I got: `x11 - Exception: CGL: ANGLE backend can be used only on Windows`. Seems [for `angle_sdl2` you need to have _DirectX 11_](https://stackoverflow.com/questions/54806913/kivy-error-critical-app-unable-to-get-a-window-abort) – hc_dev Aug 22 '21 at 07:39

0 Answers0