Les sources des exemples sont disponibles ici.
Le principe
Kivy ne travaille qu’avec une seule fenêtre. Dans celle-ci, on peut mettre un ou plusieurs composants « Screen ».
On peut ainsi en mettre plusieurs les uns après les uns pour remplir la fenêtre, à la manière des « Layout ».
Mais on peut surtout les mettre les uns à la place des autres. Pour celà, on utilise un ou plusieurs composants « ScreenManager ».
Ainsi, le contenu d’un « ScreenManager » est une succession de « Screen » dont les noms devront être définie par l’attribut « name » (à ne pas confondre avec « id »).
L’attribut « current » du « ScreenManager » indique le nom du composant « Screen » courant. Il suffit donc de changer sa valeur pour basculer d’un écran à l’autre.
Un exemple basique : on basculer entre deux écrans ( Exemple04 )
– Builder.py
On y définit deux classes « Screen1 » et « Screen2 », et la méthode « vers-ecran() » pour faire la bascule.
from kivymd.app import MDApp
from kivy.lang import Builder
from kivy.uix.screenmanager import Screen
class Screen1(Screen) :
pass
class Screen2(Screen) :
pass
class MonAppli(MDApp):
title = "Mon appli"
#icon = "Images/icon.png"
def build(self):
self.theme_cls.theme_style = "Light"
self.theme_cls.primary_palette = "Teal"
return Builder.load_file("design.kv")
def vers_ecran(self,ecran):
self.root.ids.screen_manager.current = ecran
if ecran=="ecran1":
self.root.ids.screen_manager.transition.direction = "right"
else :
self.root.ids.screen_manager.transition.direction = "left"
if __name__ == '__main__':
MonAppli().run()
– design.kv
On commence par définir les deux écrans, avant les placer dans le ScreenManager.
Ne pas oublier de placer le ScreenManager dans un Screen.
<Screen1> :
name : "ecran1"
MDBoxLayout :
orientation : "vertical"
padding : 20
spacing : 20
MDLabel :
text: "Écran 1"
halign : "center"
font_style : "H6"
md_bg_color : (1,1,0,0.5)
size_hint_y : 0.5
MDFloatLayout :
MDRaisedButton :
text : "Aller sur Écran 2"
pos_hint : {"center_x" : 0.5,"center_y" : 0.5}
on_release : app.vers_ecran("ecran2")
<Screen2> :
name : "ecran2"
MDBoxLayout :
orientation : "vertical"
padding : 20
spacing : 20
MDLabel :
text: "Écran 2"
halign : "center"
font_style : "H6"
md_bg_color : (0,1,1,0.5)
size_hint_y : 0.5
MDFloatLayout :
MDRaisedButton :
text : "Aller sur Écran 1"
pos_hint : {"center_x" : 0.5,"center_y" : 0.5}
on_release : app.vers_ecran("ecran1")
Screen :
ScreenManager:
id: screen_manager
Screen1 :
Screen2 :
Un exemple plus complet : utilisation de MDNavigationLayout et de MDNavigationDrawer
Cet exemple peut servir de base pour un vrai projet.
Les deux fichiers principaux sont encore builder.py et design.kv.