PYTHON-KIVY: Bottoni e interazioni con il codice

Vediamo come far interagire la parte grafica dell’UI con la logica dello script Python. Nell’esempio creiamo un interfaccia grafica con un campo di testo ed un bottone il quale quando verra’ premuto e rilasciato, modificherà il testo.

Prima della pressione sul bottone
Dopo la pressione

Vediamo il file main.py

from kivy.app import App
from kivy.uix.boxlayout import BoxLayout
from kivy.properties import ObjectProperty

class finestraPrincipale(BoxLayout):
    bottone = ObjectProperty(None)
    testo = ObjectProperty(None)
    def saluta(self):
        self.testo.text = "Ciao Daniel!"
        
class MainApp(App):
    def build(self):
        #Classe prinmcipale che si occupa di restituire e aggiornare la UI 
        return finestraPrincipale()
    # end def
    

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

ed il file main.kv

<finestraPrincipale>
    bottone: bottone
    testo: testo

    BoxLayout:
        orientation: "vertical"
        Label:
            id: testo
            text: "CIAO MONDO"
        Button:
            id: bottone
            text: "SALUTA"
            on_release: 
                root.saluta()

Capiamo il funzionamento partendo dal file main.kv. Possiamo subito notare che ogni elemento con il quale vogliamo interagire e’ provvisto di un id:

Questo id deve essere dichiarato all’inizio della sessione <‘classe’> nel file .kv in modo da fare da ‘ponte’ tra il file.kv e il file .py, questo e’ una sorta di riferimento per la comunicazione tra i due file.

Sotto la dichiarazione del Button, vediamo l’evento on_release, che richiamerà il metodo saluta() della classe finestraPrincipale che eseguirà l’azione specificata nel codice del file .py

Nel file main.py ritroveremo i riferimenti testo e bottone, che saranno due variabili a cui assoceremo l’oggetto ObjectProperty della libreria kivy.properties importato in precedenza.

Queste due variabili/oggetti, ci serviranno per interagire con i due widget della UI, infatti alla pressione e rilascio del Button, la scritta “CIAO MONDO” verrà modificata, dal metodo saluta() della classe finestraPrincipale() , in “Ciao Daniel!”

PYTHON-KIVY: file .kv per la costruzione della UI

il file che descrive la struttura dell’interfaccia utente.

Il file .kv e’ un file di testo dove risiedono tutte le istruzioni per la costruzione dell’ interfaccia grafica. Si preferisce usare un file esterno su applicazioni mediamente complesse in quanto questo ci dà la possibilità di separare la parte logica del programma da quella grafica, rendendo tutto molto più leggibile.

Per usare questo metodo ci sono alcune regole da seguire:

  • Il nome del file .kv deve essere tutto in minuscolo
  • il nome deve coincidere con lo stesso nome della classe principale del programma
  • se la classe principale contiene la scritta “App” ad esempio MainApp() il file kv dovrà escludere App, quindi dovrà essere chiamato “main.kv”
  • il file .kv dovra’ essere creato nella stessa directory del file .py

vediamo un semplicissimo esempio “Hello World ! “

file PYTHON main.py:

from kivy.app import App
from kivy.uix.boxlayout import BoxLayout

class finestraPrincipale(BoxLayout):
    pass

class MainApp(App):
    def build(self):
        #Classe prinmcipale che si occupa di restituire e aggiornare la UI 
        return finestraPrincipale()
    # end def
    

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

file KV main.kv

<finestraPrincipale>
    BoxLayout:
        orientation: "vertical"
        Label:
            text: "CIAO MONDO"

Risultato

Cosi some e’ strutturato il programma ora l’applicazione python girerà in un loop infinito in quanto, il metodo .run() della classe MainApp() ereditato da App (dichiarato nella sua costruzione MainApp(App)) genera appunto il loop infinito. Questo loop infinito e’ necessario per il continuo refresh della GUI del programma scritto nel file main.py