Le bouton dans kivy commence par un ButtonBehavior qui est combiné avec un Label ajoutant des propriétés comme background_normal/down... pour gérer les textures sur le canevas.
Sachant cela, vous pouvez simplement combiner ButtonBehavior avec tout autre widget de votre choix. Par exemple.
from kivy.base import runTouchApp
from kivy.lang import Builder
kv = '''
<[email protected]+AsyncImage>
FloatLayout:
# we don't specify anything here so float layout takes the entire size of the window.
ButImage:
id: but
# take 50% size of the FloatLayout
size_hint: .5, .5
# Make Button change it's opacity when pressed for visual indication
opacity: 1 if self.state == 'normal' else .5
source: 'http://www.victoriamorrow.com/sitebuildercontent/sitebuilderpictures/enter_button.gif'
# Introduce Label incase you want text on top of the image
Label:
center: but.center
# change text acc to but state
text: "Normal" if but.state == 'normal' else 'down'
'''
if __name__ == '__main__':
runTouchApp(Builder.load_string(kv))
Ici, nous venons de définir le ButtonBehavior à combiner avec un AsyncImage qui télécharge l'image du Web pour votre arrière-plan.
tu devrais voir quelque chose comme ça 
Effet d'animation en arrière-plan
Ce serait aussi simple que de changer la source en gif animé ou en liste d'images dans un .zip.
from kivy.base import runTouchApp
from kivy.lang import Builder
kv = '''
<[email protected]+AsyncImage>
FloatLayout:
ButImage:
id: but
size_hint: .5, .5
opacity: 1 if self.state == 'normal' else .5
allow_stretch: True
keep_ratio: False
source: 'http://media1.policymic.com/site/article-items/2095/1_gif.gif'
Label:
center: but.center
text: "Normal" if but.state == 'normal' else 'down'
'''
if __name__ == '__main__':
runTouchApp(Builder.load_string(kv))
Regardez l'exemple d'images de séquence Cela a été fait avant l'introduction de ButtonBehaviors donc il a même un exemple d'une classe AnimatedButton utilisant l'ancienne méthode qui n'est plus nécessaire.
Effet d'ombre :
Il existe également de nombreuses façons de le faire.
Vous pouvez soit ajouter une ombre à un widget/mise en page et faire en sorte que le bouton au-dessus de ce widget/mise en page occupe moins d'espace que l'ombre afin de tenir compte du toucher sur les ombres.
Ou créez votre propre classe CustomButtonBehavior dérivée de ButtonBehavior qui remplace collidepoint méthode pour ne renvoyer True que pour les collisions personnalisées. Il existe un exemple d'utilisation d'une collision personnalisée pour les widgets. Vous pouvez même définir le keep_data de l'image propriété sur True et vérifiez ultérieurement les données de pixel pour alpha afin de déterminer si vous souhaitez renvoyer true pour la collision.
Bords arrondis etc.
Utilisez simplement une image avec des bords arrondis. Kivy prend en charge l'utilisation de l'instruction BorderImage qui équivaut à CSS borderimage en termes de fonctionnalité. Le bouton de Kivy l'utilise par défaut. Essayez et expérimentez avec l'attribut border de BorderImage.
