2013-09-25 141 views

回答

20

这是一个棘手的问题。据我所知,Widgets总是矩形。但是,我们可以使用background_normalbackground_down属性分别更改背景并为正常状态和向下状态放置几幅图像。您还需要了解border属性。

使用这两个图像normal.pngdown.png,您可以开始添加圆形边框。

enter image description hereenter image description here

下面是一段代码,这是非常简单的(我试着解释下面的border属性):

from kivy.app import App 
from kivy.uix.floatlayout import FloatLayout 
from kivy.uix.button import Button 
from kivy.lang import Builder 

Builder.load_string(""" 
<Base>: 
    Button: 
     background_normal: 'normal.png' 
     background_down: 'down.png' 
     border: 30,30,30,30 
""") 


class Base(FloatLayout): 
    pass 

class ButtonsApp(App): 
    def build(self): 
     return Base() 

if __name__ == "__main__": 
    ButtonsApp().run() 

我明白这个问题的方法(和我可能是错了)是这样的。 border: 30,30,30,30中的值表示顶部,右侧,底部和左侧将有多少像素用于背景按钮的边框。其余的部分将被填满中间部分。我不确定。顺便说一句,如果你想看到一些很酷的东西,例如见border: 150,150,150,150。原因是我们正在拾取比实际图像更大的边框。

警告:小工具仍然是矩形。这意味着即使您点击圆角,按钮仍然会收到该事件。我想这是一个公平的价格。如果你想做更好的事情,也许我可以帮助你,但我们需要用一些数学来冲突。文档中Pong Game tutorial的技巧之一就是实际上球是方形的。我发布了一个相关的问题here,但您需要使用Canvas

+2

定制碰撞有在https://github.com/kivy/kivy/blob/master/examples/widgets一个例子/customcollide.py。按钮使用边框图像显示其具有边框属性的图像。此边框图像在功能上与CSS BorderImage非常相似。你可能会从这里得到一个好主意http://css-tricks.com/understanding-border-image/ –

1

如果您只是为了看起来好看,而且对边角没有挑剔,虽然是圆的,仍然是接触点,您可以简单地做,如在本示例程序中所示(这具有大的半径对于本示例):

from kivy.uix.button import Button 
from kivy.lang import Builder 
from kivy.base import runTouchApp 

kv=""" 
<[email protected]>: 
    background_color: 0,0,0,0 # the last zero is the critical on, make invisible 
    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: [50,] 
""" 
class RoundedButton(Button): 
    pass 

Builder.load_string(kv) 

runTouchApp(RoundedButton(text="Hit Me!"))