2013-09-25 181 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!"))