Un tocco di grafica al povero pulsante

Quel povero pulsante che chiude la finestra con la sola descrizione non presenta una bella impressione, proviamo ad arricchirlo con un pizzico di grafica. Abbiamo anticipato in precedenza la presenza di alcuni segnali dei GtkButton oltre il classico clicked, proviamo ad usarli con un esempio non molto utile ma esplicativo.

Torniamo al progetto Glade come l’avevamo lasciato l’ultima volta, con un unico pulsante che chiude la finestra; un click sopra il pulsante per selezionarlo e dalla finestra delle proprietà generali modifichiamo la proprietà tipo da Etichetta a Stock.

In GTK per Stock si intende un’icona del tema GTK che si identifica con un nome specifico, sono indicate sulla pagina delle costanti Stock. L’aspetto grafico dell’icona dipende dal tema in uso mentre il valore indicato è quello da usare in Python per indicare l’icona con un valore Stock. Quando usate con i GtkButton invece il valore è una stringa, minuscola e col trattino. Ad esempio gtk.STOCK_OPEN diverrà la stringa gtk-open e gtk.STOCK_ADD diverrà gtk-add.

Su Glade è possibile indicare l’icona desiderata scegliendola da un menu alla voce Pulsante stock, in questo esempio abbiamo scelto proprio gtk-open. Spostiamoci quindi nella sezione Segnali e assegniamo le funzioni di callback a tutti i segnali visti in precedenza e indicati nella figura sotto.

Specificheremo il nome predefinito per ogni funzione, scegliendolo dalla lista o scrivendolo a mano, quindi salveremo il progetto Glade e andremo a modificare il codice Python per usare queste funzioni di callback.

import gtk
import gtk.glade
import pygtk
pygtk.require("2.0")

def on_window1_destroy(widget, data=None):
  gtk.main_quit()

def on_btnChiudi_clicked(widget, data=None):
  #window1.destroy()
  pass

def on_btnChiudi_enter(widget, data=None):
  widget.set_label('gtk-close')

def on_btnChiudi_leave(widget, data=None):
  widget.set_label('gtk-add')

def on_btnChiudi_pressed(widget, data=None):
  widget.set_label('gtk-execute')

def on_btnChiudi_released(widget, data=None):
  widget.set_label('gtk-help')

segnali = {
  'on_window1_destroy': on_window1_destroy,
  'on_btnChiudi_clicked': on_btnChiudi_clicked,
  'on_btnChiudi_enter': on_btnChiudi_enter,
  'on_btnChiudi_leave': on_btnChiudi_leave,
  'on_btnChiudi_pressed': on_btnChiudi_pressed,
  'on_btnChiudi_released': on_btnChiudi_released
}

gladeFile = gtk.glade.XML('hello.glade')
window1 = gladeFile.get_widget('window1')
gladeFile.signal_autoconnect(segnali)

if window1:
  window1.show()
  gtk.main()

La modifica principale riguarda le 4 nuove funzioni di callback, le prime due per i segnali enter e leave (per quando il puntatore del mouse passa sopra il pulsante o per quando esce dall’area del pulsante), e gli altri due pressed e released (per la pressione e il rilascio di un pulsante del mouse).

def on_btnChiudi_clicked(widget, data=None):
  #window1.destroy()
  pass

Per consentire l’uso dei segnali pressed e released abbiamo dovuto disabilitare il segnale clicked, in quando pressed+released corrispondono esattamente ad un click e ci sarebbe stato impossibile usarli tutti. Il commento davanti al destroy verrà tolto alla fine di questo esempio, mentre pass è stato apposto per inserire almeno un’istruzione all’interno della funzione ma non svolge alcuna azione.

def on_btnChiudi_enter(widget, data=None):
  widget.set_label('gtk-close')

Tutti e quattro i segnali funzionano in maniera analoga, come mostrato nelle due righe superiori. Quando scatta il segnale viene comunicato nel parametro widget il riferimento al componente cui si riferisce il segnale. Essendo questo enter il segnale del pulsante btnChiudi, quando la funzione sarà richiamata, all’interno di widget avremo il pulsante che ha generato il segnale, quindi btnChiudi.

Con widget.set_label(‘gtk-close’) assegneremo l’icona Stock gtk-close al pulsante btnChiudi. Lo stesso metodo set_label può essere usato per assegnare l’etichetta di testo al pulsante quando il tipo è Etichetta o l’icona quando il tipo è Stock.

Eseguendo il progetto vedremo quanto indicato:

  1. Il pulsante inizialmente presenterà l’icona Apri
  2. Spostando il cursorse del mouse sopra il pulsante questo assumerà l’icona Chiudi
  3. Spostando il cursorse fuori dalla superficie del mouse apparirà l’icona Aggiungi
  4. Tenendo premuto il pulsante del mouse sopra il pulsante sarà mostrata l’icona Esegui
  5. Lasciando il pulsante premuto verrà mostrata infine l’icona Aiuto

Tutti e quattro i segnali possono essere utili per cambiare il comportamento del pulsante in funzione dell’uso del mouse.

E’ possibile scaricare il progetto Python e l’interfaccia Glade.

About these ads

18 Responses to “Un tocco di grafica al povero pulsante”


  1. 1 Berserker79 ottobre 17, 2008 alle 6:01 pm

    hehehe… spero che continuerai a rifocillarci di articoli e che non ci abbandonerai sul più bello…. ciao.

  2. 2 Muflone ottobre 17, 2008 alle 7:26 pm

    ehhh dipende
    per il momento su linux non trovo nulla di interessante di cui occuparmi. di certo non farò la quarantamilionesima recensione per installare chrome su linux o su openoffice 3

    vedremo…

  3. 3 Berserker79 ottobre 19, 2008 alle 9:23 am

    un tuo parere sul nuovo openoffice 3 lo gradirei, magari non in questa sede, penavo che col il passaggio alla versione 3 ci sarebbero stati grandi cambiamenti, ma ancora non ho avuto tempo di provarlo per bene

  4. 4 grigio ottobre 26, 2008 alle 12:47 pm

    Ciao, ti consiglierei di usare Gtk::Builder invece di glade (che è/sarà deprecato)

  5. 5 Muflone ottobre 29, 2008 alle 6:37 pm

    non posso che darti ragione grigio ma vista l’attuale mancato supporto di Glade nel formato xml per il gtk-builder e la noia delle doverosa conversione glade/xml per il momento rimando questo passaggio

  6. 6 ck_linx dicembre 2, 2009 alle 11:42 pm

    Ciao!Quando aggiungo il bottone stock non vedo l’immagine! Mi fà fare la scelta nel menù.. si vede l’icona ma appena la scelgo nell’interfaccia compare solo l’etichetta! Il resto funziona perfettamente.
    Grazie

  7. 7 Muflone dicembre 3, 2009 alle 1:35 pm

    ciao
    utilizzi windows o linux?

  8. 8 ck_linx dicembre 3, 2009 alle 1:50 pm

    utilizzo ubuntu!

  9. 9 Muflone dicembre 5, 2009 alle 7:09 pm

    l’icona sparisce all’interno di glade oppure nel programma eseguito?

  10. 10 ck_linx dicembre 6, 2009 alle 12:57 pm

    Appena inserisco il pulsante di stock nn visualizza l’immagine. Però nella lista dei bottoni si vede.

  11. 11 Muflone dicembre 6, 2009 alle 1:07 pm

    non hai risposto alla domanda

  12. 12 ck_linx dicembre 6, 2009 alle 3:13 pm

    Scusami… interno di glade.

  13. 13 Muflone dicembre 6, 2009 alle 3:19 pm

    quello e` irrilevante
    pare accada con le ultime versioni di glade, non te ne preoccupare, ogni tanto lo fa
    poi nel programma si vedono

  14. 14 ck_linx dicembre 6, 2009 alle 3:24 pm

    Perfetto! Grazie 1000!

  15. 15 Aquila ottobre 7, 2010 alle 3:52 pm

    Ciao. Grazie per i tuoi consigli. A me capita la stessa cosa di ck_linx, in più dopo avere scelto il pulsante di stock, l’immagine non è visualizzata nè all’interno di glade nè nel programma. Come poso risolvere il problema?

  16. 16 Muflone ottobre 7, 2010 alle 5:39 pm

    avete le icone abilitate per i pulsanti?
    nei vari programmi si vedono le icone dei pulsanti?

  17. 17 Aquila ottobre 7, 2010 alle 8:54 pm

    Si, in altri programmi vedo perfettamente le icone dei pulsanti.

  18. 18 Giornale di Sistema dicembre 15, 2010 alle 8:42 pm

    Su Ubuntu 10.10 stesso problema dei commenti immediatamente precedenti: niente icone dei pulsanti, ne in Glade ne nel programma Python.


Rispondi

Inserisci i tuoi dati qui sotto o clicca su un'icona per effettuare l'accesso:

Logo WordPress.com

Stai commentando usando il tuo account WordPress.com. Chiudi sessione / Modifica )

Foto Twitter

Stai commentando usando il tuo account Twitter. Chiudi sessione / Modifica )

Foto di Facebook

Stai commentando usando il tuo account Facebook. Chiudi sessione / Modifica )

Google+ photo

Stai commentando usando il tuo account Google+. Chiudi sessione / Modifica )

Connessione a %s...




Indice degli argomenti


Iscriviti

Ricevi al tuo indirizzo email tutti i nuovi post del sito.

%d blogger cliccano Mi Piace per questo: