Añadir ícono a la bandeja del sistema

Veamos cómo añadir un ícono para nuestras aplicaciones en la bandeja del sistema, y cómo agregar un menú a este ícono.

Como siempre, en los tutoriales trabajamos con Geany y Glade 3.

Hagamos un sencillo programa que consista sólo de un ícono en la bandeja del sistema, que muestre un mensaje si recibe un click izquierdo, y despliegue un menú si recibe uno derecho.

Crear el ícono
Abrimos Glade y agregamos un "Ícono de Estado" (nombre que le da GTK+ al ícono que va en la bandeja):

Le damos nombre y una imagen, yo le puse "iconobandeja" y usé esta imagen. La imagen la seleccionamos en la propiedad "Pixbuf":

Ahora le damos manipuladores a las señales "activate" y "popup_menu":

Guardamos el archivo y abrimos nuestro IDE (Geany). Para este tutorial guardé el archivo como "interfaz.xml".

Importamos los módulos necesarios, creamos la clase y el constructor, y corremos el programa:

import pygtk
import gtk

class icono:
   def __init__(self):
      builder = gtk.Builder()
      builder.add_from_file("interfaz.xml")
      self.iconobandeja = builder.get_object("iconobandeja")

      builder.connect_signals(self)

icono()
gtk.main()


Click izquierdo en el ícono
El programa anterior no hace en realidad nada más que mostrar el ícono en la bandeja. Programemos ahora el manipulador de la señal "activate", que se ejecuta cuando el ícono recibe un click izquierdo.

Hagamos que se muestre una ventana con un mensaje. Para hacer más interesante esto (y no estar creando la ventana en Glade), hagamos la ventana en Gtk+ puro (es importante conocer al menos lo básico).

Agregamos el siguiente método a nuestra clase:

   def on_iconobandeja_activate(self, widget, data=None):
      ventana = gtk.Window()
      etiqueta = gtk.Label()
      etiqueta.set_label("Ventana hecha con Gtk+ puro!")
      ventana.add(etiqueta)
      ventana.show_all()


Lo que hacemos es, explicando línea por línea: creamos una ventana, creamos una etiqueta, establecemos el texto de la etiqueta, la agregamos a la ventana, y por último la mostramos.

Click derecho en el ícono
Programemos ahora el manipulador de la señal "popup_menu", que se ejecuta con un click derecho del ratón, para mostrar un menú.

Abrimos Glade y creamos el menú ("Menu Emergente"). Le ponemos un nombre, en mi caso simplemente le puse "menu".

Luego, a la derecha, en donde dice Widgets damos click derecho al menu que creamos y seleccionamos la opción "Edit...". Vamos a la pestaña Jerarquía y hacemos click en "Añadir" para agregar un elemento.

Vamos a crear un solo elemento para este programa, que permita salir del mismo. Le ponemos nombre y etiqueta ("salir", por ejemplo) y cerramos la ventana de edición del menú.

Le damos el manipulador "on_salir_activate" a la señal activate del elemento que acabamos de crear para nuestro menú.




Guardamos el archivo y vamos al IDE a escribir el código.

Agregamos el menu al constructor:
      self.menu = builder.get_object("menu")
      self.salir = builder.get_object("salir")


Creamos el método del manipulador de la señal popup_menu, para desplegar el menú cuando se reciba un click derecho:
   def on_iconobandeja_popup_menu(self, widget, button, activate_time):
      self.menu.popup(None, None, None, button, activate_time)


Por último programamos el elemento que agregamos a nuestro menú:
   def on_salir_activate(self, widget, data=None):
      gtk.main_quit()


El resultado debería de ser el siguiente:

Con un click derecho debe de aparecer un menú con un elemento que diga "Salir", y al hacer click en éste el programa debe terminar.

Descargar programa ejemplo

6 comentarios: (+add yours?)

chuche dijo...

Gracias por este tutorial, despues lo practicare :D

angelbotto dijo...

buenisimo :)

inukaze dijo...

Gracias :D

David Avila dijo...

Me ha gustado mucho tu blog, y claro me ha ayudado...

pregunta:
¿cómo puedo hacer que en vez de abrir una ventana (en este caso la que dice "ventana hecha en...") me abra un ejecutable como podría ser firefox, y en el caso del desplegable con el botón derecho me salga una lista de otros programas?.

atento a tu respuesta. gracias.

David Avila dijo...

hola nuevamente, he solucionado mi problema, el de arriba, solo debía poner import os y os.system en la acción, gracias, te comentare luego lo que estoy haciendo.
saludos.

ito123456789 dijo...

Hola David! Acabo de leer ambos mensajes, ayer no estuve por acá, tenía un examen y no pude contestar a tiempo.. y si, sería interesante saber qué estás haciendo...

Gracias por la preferencia!

Publicar un comentario