[Gruppo FCM] FCM 31 - HOW-TO Programmare in Python - Parte 5

Dom 17 Gen 2010 12:29:34 GMT

HOW-TO Programmare in Python - Parte 5
Scritto da Greg Walters

Se siete come me, ODIERETE la prima parte di questa lezione. ODIO quando l'autore mi dice di leggere due volte ogni parola nel suo libro/capitolo/articolo, perché SO già che sarà una noia - anche quando so che è per il mio bene, e finirò col farlo comunque.

Consideratevi avvertiti. PER FAVORE leggete i successivi noiosi paragrafi con attenzione. Presto arriveremo alla parte divertente, ma abbiamo bisogno di preparare il terreno prima di iniziare a programmare.

INNANZITUTTO dovete installare Boa Constructor e wxPython. Usate Synaptic e selezionate sia wxPython che Boa Constructor. Una volta installati, dovreste trovare Boa in Applicazioni\Programmazione\Boa Contructor. Procedete ed avviatelo. Questo renderà le cose più semplici. Una volta avviato il programma, vedrete tre distinte finestre: una in alto e due in basso. Potrebbe essere necessario ridimensionarle e spostarle un pò, fino a sistemarle in questa maniera:

La finestra superiore è quella strumenti. Quella in basso a sinistra è l'ispezionatore, e quella in basso a destra è l'editor. Nella finestra strumenti, troverete varie linguette (Nuovo, Contenitore/Posizionamento, etc) che vi permetteranno di iniziare un nuovo progetto, aggiungere frame ad un progetto esistente, e aggiungere vari controlli all'applicazione. La finestra ispezionatore acquisterà importanza quando inizieremo ad aggiungere controlli. La finestra editor ci consente di modificare il nostro codice, salvare i progetti, e molto altro. Ritorniamo a quella strumenti, ed osserviamo ciascuna linguetta - partendo da quella "Nuovo". Anche se qui ci sono molte opzioni, ne tratteremo solo due. Sono il 5° e il 6° pulsante da sinistra: wx.App e wx.Frame. wx.App ci permette di creare un'applicazione completa partendo da due file auto-generati. Uno per il frame ed un altro per l'applicazione. Questo è il metodo che preferisco usare. wx.Frame è usato per aggiungere altri frame alla nostra applicazione e/o creare una applicazione standalone da un singolo file sorgente. Ne parleremo più tardi.

Osserviamo ora la linguetta Contenitore/Posizionamento. Ci sono parecchie cose. Quelle che userete maggiormente sono wx.panel (prima da sinistra) e i ridimensionatori (2,3,4,5 e 6 da destra). Sotto Controlli base, troverete etichette, box di testo, caselle, pulsanti radio, e altri. Sotto Bottoni, troverete vari tipi di pulsanti. Controlli lista comprende griglie per dati ed altre liste. In Utilità troveremo timer e oggetti per menu.

Ecco alcune cose da ricordare quando siamo pronti per la prima applicazione. Ci sono alcuni bug nelle versione Linux. Uno riguarda l'impossibilità di muovere ALCUNI controlli nel designer. Usate la combinazione <Ctrl>+Tasti Freccia per muoverli o aggiustarne la posizione. Un altro riguarda i tutorial allegati a Boa Constructor - posizionando un pannello è difficile seguirli. Osservate i piccoli riquadri (ve li spiegherò presto). Potete anche usare la linguetta Objs dell'Ispezionatore e in questo modo selezionarlo.

Ok, continuiamo. Nella linguetta 'Nuovo' della finestra strumenti, selezioniamo wx.App (5° bottone da sinistra). Verranno così create due nuove linguette nell'editor: una chiamata “*(App1)*”, l'altra “*(Frame1)*”. Che ci crediate o meno, la PRIMA cosa da fare è salvare i nostri due file, partendo da Frame1. Il pulsante per salvare è il 5° da sinistra nell'Editor. Si aprirà la finestra "Salva come" chiedendoci dove salvare e come chiamare il file. Create nella vostra home una cartella chiamata GuiTest, e salvate il file come “Frame1.py”. Osservate che la linguetta “*(Frame1)*” ora mostra “Frame1”. (I caratteri “*(“ ci informano che il file deve essere salvato.) Ora fate lo stesso con la linguetta App1.

Ora esaminiamo alcuni dei pulsanti della barra degli strumenti di Editor. Quelli per ora interessanti sono Salva (5° da sinistra) ed Esegui (freccia gialla, 7° da sinistra). Se vi trovate in una linguetta frame (Frame1 per esempio) ci saranno pulsanti extra che avrete bisogno di conoscere. Partiamo dal pulsante Designer:

È importante. Permette di disegnare la finestra della nostra GUI - che è quello che faremo. Quando ci cliccherete vi sarà mostrata una finestra vuota.

Si tratta di una tela bianca in cui inserire i controlli necessari (secondo logica). La prima cosa che vogliamo fare è posizionare un wx.panel. Quasi tutto quello che ho letto dice di non mettere controlli (ad eccezione  di wx.panel) direttamente su un frame. Quindi, cliccate sulla linguetta Contenitore/Posizionamento nella finestra Strumenti, quindi sul bottone wx.Panel. Quindi, passare al frame sul quale si sta lavorando e cliccare in un punto qualunque all'interno del frame. Saprete che ha funzionato se vedete qualcosa simile a questo:

Ricordate quando vi ho avvisato dei bug? Bene, questo è un altro. Non preoccupatevi. Vedete gli 8 piccoli quadratini neri? Sono i limiti del pannello. Se volete potete cliccare e trascinarne uno per ridimensionare il pannello, ma per il nostro progetto vogliamo che copra l'intero frame. A questo punto ridimensionate un poco solo il FRAME. Ora abbiamo un pannello su cui inserire altri controlli. Muovere il frame su cui si sta lavorando fino a che la barra strumenti dell'Editor non sia visibile. Sono comparsi due nuovi pulsanti: un "check" e una "X". La "X" annulla i cambiamenti apportati.

Il pulsante Check:

è chiamato pulsante "Invia". Serve per scrivere i cambiamenti sul file frame. Abbiamo ancora bisogno di salvarlo, ma questo includerà le novità nel file. Quindi, cliccate il pulsante Invia. C'è un altro Invia nell'Ispezionatore, ma ce ne occuperemo dopo. Ora salvate il vostro file.

Ritornate alla modalità Designer. Cliccare sulla linguetta Bottoni della finestra Strumenti e quindi cliccate il primo pulsante a sinistra, wx.Button. Quindi aggiungetelo al centro del frame. Avrete qualcosa di simile a questo:

Notate come vi siano intorno 8 piccoli quadrati neri come per il pannello. Sono maniglie per ridimensionare. Mostrano inoltre quale controllo è selezionato. Per posizionarlo con cura al centro del frame, tenete premuto il tasto Ctrl e usate i tasti freccia per muoverlo dove si vuole. Ora osservate l'Ispezionatore. Ci sono quattro linguette. Cliccare su 'Constr'. Da qui possiamo cambiare etichetta, nome, posizione, dimensione e stile. Per ora cambiamo il nome in 'btnShowDialog' e la proprietà Label in 'Cliccami'.

Ora, trascuriamo il resto della linguetta e passiamo a quella Objs. Questa mostra tutti i controlli usati e la loro relazione genitore/figlio. Come potete vedere, il pulsante è figlio di panel1, che è figlio di Frame1.

Premete Invia e salvate i cambiamenti. Ritornate ancora una volta al designer, e notate che (assumendo che sia ancora selezionata la linguetta Objs), Frame1 è ora selezionato. Questo va bene perché è quello che ci serve. Ritornare alla linguetta 'Constr', e cambiare il titolo da 'Frame1' a 'La nostra prima GUI'. Cliccate Invia e salavate ancora una volta. Ora eseguiamo la nostra applicazione. Cliccate il pulsante giallo Esegui nell'Editor.

Cliccate quanto volete sul pulsante, ma non accadrà nulla. Perché? Bene, non abbiamo detto al pulsante cosa fare. Per questo, dobbiamo impostare un evento che deve verificarsi quando l'utente clicca il nostro bottone. Cliccare sulla X nell'angolo in alto a sinistra per interrompere l'esecuzione del frame. Poi, ripassare al designer, selezionate il pulsante e andate nella linguetta 'Evts' dell'Ispezionatore. Cliccate su ButtonEvent e quindi doppio click su wx.EVT_BUTTON, e notate che nella finestra sotto otteniamo un pulsante evento chiamato 'OnBtnShowDialogButton'. Clic su Invia e salvate.

Prima di andare oltre, guardiamo cosa abbiamo ottenuto sotto forma di codice (pagina 11).

#Boa:Frame:Frame1
import wx
def create(parent):
    return Frame1(parent)
[wxID_FRAME1, wxID_FRAME1BTNSHOWDIALOG, wxID_FRAME1PANEL1,] = [wx.NewId() for _init_ctrls in range(3)]

class Frame1(wx.Frame):
    def _init_ctrls(self, prnt):
        # generated method, don't edit
        wx.Frame.__init__(self, id=wxID_FRAME1, name='', parent=prnt,
            pos=wx.Point(543, 330), size=wx.Size(458, 253),
            style=wx.DEFAULT_FRAME_STYLE, title=u'La nostra prima GUI')
        self.SetClientSize(wx.Size(458, 253))
        self.panel1 = wx.Panel(id=wxID_FRAME1PANEL1, name='panel1', parent=self,
            pos=wx.Point(0, 0), size=wx.Size(458, 253),
            style=wx.TAB_TRAVERSAL)
        self.btnShowDialog = wx.Button(id=wxID_FRAME1BTNSHOWDIALOG,
            label=u'Cliccami', name=u'btnShowDialog', parent=self.panel1,
            pos=wx.Point(185, 99), size=wx.Size(85, 32), style=0)
        self.btnShowDialog.Bind(wx.EVT_BUTTON, self.OnBtnShowDialogButton,
            id=wxID_FRAME1BTNSHOWDIALOG)

def __init__(self, parent):
    self._init_ctrls(parent)
def OnBtnShowDialogButton(self, event):
    event.Skip()

La prima riga è un commento che dice a Boa Constructor che si tratta di un file boa. È ignorato dal compilatore Python, ma non da Boa. La riga successiva importa wxPython. Ora saltiamo alla definizione della classe.

All'inizio, c'è il metodo __init_ctrls. Notate il commento proprio sotto la definizione. Non modificate il codice di questa sezione. Se lo fate, lo rimpiangerete. Ovunque SOTTO questa routine dovrebbe essere sicuro. In questa routine, troverete le definizioni di ciascun controllo del nostro frame.

Quindi, osservate la routine __init__. Qui potete inserire qualunque chiamata al codice di inizializzazione. Infine, la routine OnBtnShowDialogButton. Qui è dove metteremo il codice da eseguire quando l'utente clicca il pulsante. Osservate che ora qui c'è la riga event.Skip(). In parole semplici, dice di uscire dalla routine quando si richiama l'evento.

Ora, quello che andremo a fare è chiamare un finestra messaggio da far comparire con del testo. Si tratta di un'operazione comune per i programmatori per portare a conoscenza l'utente di qualcosa - un errore, o che un processo è terminato. In questo caso, chiameremo l'inclusa routine wx.MessageBox. La routine viene chiamata con due parametri. Il primo è il testo che desideriamo mostrare nel messaggio e il secondo è il titolo. Commentate la riga event.Skip() e inserite la seguente riga.

wx.MessageBox('Hai cliccato il pulsante', 'Info')

Salvate e cliccate il pulsante Esegui (freccia gialla). Dovreste vedere qualcosa simile a questo:

E quando cliccate il pulsante dovreste vedere qualcosa di simile a questo:

Beninteso, questo è il modo più semplice per chiamare un messagebox. È possibile usare ulteriori parametri.

Ecco un breve sommario su come cambiare il tipo di icona nel box messaggio (di più la prossima volta).

wxICON_QUESTION - Mostra un'icona di domanda

wxICON_EXCLAMATION - Mostra un'icona di avviso

wxICON_ERROR - Mostra un'icona di errore

wxICON_INFORMATION - Mostra un'icona di informazione

La maniera di usarle sarebbe

wx.MessageBox('Hai cliccato il pulsante, 'Info', wx.ICON_INFORMATION)

o qualunque icona si voglia usare in base alla situazione. Ci sono altre opzioni per i pulsanti di cui parleremo la prossima volta.

Così, fino ad allora, provate qualcuno degli altri controlli, disposizioni, e così via. Buon divertimento!

Greg Walter è il proprietario della RainyDay Solutions, LLC, una società di consulenza in Aurora, Colorado e programma dal 1972. Ama cucinare, fare escursioni, ascoltare musica e passare il tempo con la sua famiglia.

-- 
Giuseppe Calà
OpenPGP key: 0x749487B5
-------------- parte successiva --------------
Un allegato HTML è stato rimosso...
URL: <http://liste.ubuntu-it.org/pipermail/ubuntu-it-fcm/attachments/20100117/ab57df9f/attachment-0001.htm>
-------------- parte successiva --------------
Un allegato non testuale è stato rimosso....
Nome:        non disponibile
Tipo:        application/pgp-signature
Dimensione:  197 bytes
Descrizione: This is a digitally signed message part.
URL:         <http://liste.ubuntu-it.org/pipermail/ubuntu-it-fcm/attachments/20100117/ab57df9f/attachment-0001.pgp>