beginner - Progettiamo e realizziamo la nostra prima interfaccia Stampa
Scritto da Giovanni Ruta - Sekhem   
Giovanni Ruta - Sekhem

Si lo so: i programmi senza interfaccia sono molto più veloci e consumano meno risorse!

Purtroppo mi sono reso conto che, nonostante tutte le spiegazioni date, il 90% degli utenti vuole vedere qualcosa di colorato... Ed allora ho iniziato a studiare le WxWidget, da affiancare a C++ o a Python che ci permettono di creare applicazioni compatibili con tutti i sistemi.

 

Esporrò quello che, secondo il mio modo di lavorare, può essere un buon metodo di progettazione e sviluppo dell'interfaccia. Gli strumenti di cui ci serviremo sono:

 

  • Pencil: Applicazione standalone o estensione per Firefox che permette di progettare interfacce grafice;
  • wxGlade: programma per la realizzazione di interfacce grafiche che genera automaticamente i lcodice C++ o Python
  • wxPython: binding delle librerie wxwidget per python

Io ho preferito utilizzare la versione di Pencil standalone, perchè il mio firefox è già troppo carico... Questo programma tramite una semplice interfaccia ci permette di progettare la nostra grafica:

Cosa farà questa prima applicazione? Faremo un programmino che prende in input un indirizzo e restituisce le coordinate. Quindi ho immaginato la mia interfaccia come segue:

Dopo aver realizzato l'interfaccia che più ci piace (facciamolo con calma, perchè è meglio avere una idea chiara su come deve essere il risultato perchè sarà difficile dopo fare grosse modifiche), apriamo wxGlade e realizziamo la vera interfaccia:

Queste operazioni sono poco piacevoli, ma vi assicuro che ne vale la pena: ricordatevi di associare gli eventi ai pulsanti, date le giuste label, posizionate correttamente gli elementi (non scrivo come fare perchè le varie documentazioni sono molto esplicative).

Quando abbiamo impostato tutti i parametri, definiamo il file di output su cui salvare il codice e selezioniamo il tast "Generate Code". Eseguendo il file generato, vedremo che il programma funziona senza problemi. Non rimane quindi che modificare il comportamento degli elementi. Io ho previsto solo due funzioni "OnLocalize" e "OnCancel": il primo restituirà le coordinate dell'indirizzo immesso, il secondo cancellerà il contenuto degli elementi. Apriamo il file sorgente e cerchiamo la definizione delle due funzioni (wxGlade fa tutto per noi, genera gli eventi e li collega ai pulsanti corretti) e modifichiamo il contenuto come segue:

def OnLocalize(self, event): # wxGlade: MyFrame.

URL2 = "http://maps.googleapis.com/maps/api/geocode/json?address=%s&sensor=false" % self.text_ctrl_1.GetValue().replace(" ", "+")

googleResponse = urllib.urlopen(URL2)

jsonResponse = json.loads(googleResponse.read())

pprint.pprint(jsonResponse)

#data_address = json.dumps([s['formatted_address'] for s in jsonResponse['results']], indent=3)

data_lat = json.dumps([s['geometry']['location']['lat'] for s in jsonResponse['results']], indent=3)

data_lon = json.dumps([s['geometry']['location']['lng'] for s in jsonResponse['results']], indent=3)

self.label_1.SetLabel("Ti trovi alle coordinate:\n latitudine => %s\n longitudine => %s" % (data_lat,data_lon))

event.Skip()

def OnCancel(self, event): # wxGlade: MyFrame.

self.text_ctrl_1.SetValue("")

self.label_1.SetLabel("")

event.Skip()

Ricordiamoci di caricare le giuste librerie: import urllib import json import pprint Non vi rimane che salvare ed eseguire il programma:

Se eseguite il programma da un terminale, vedrete anche l'intero array JSON con tutte le informazioni che potete elaborare, per l'esempio mi è sembrato sufficiente usare solo le coordinate. Magari tutto questo non rende giustizia ai vari strumenti presentati, ma voglio invitarvi a fare una modifica all'interfaccia... aggiungete un pulsante ad esempio! Rigenerate il codice usando lo stesso file del progetto precedente, cosa notate? Ebbene si: wxGlade ha modificato solo le classi dell'interfaccia, lasciando inalterato il codice aggiunto da noi! Spero di essere stato esaustivo: Buon divertimento!


 

Recent Articles by Giovanni Ruta - Sekhem :