CreandounWidgetconVala(Gtk3.

0)
Autor : Mariano R. Gaudix E-mail : marianocordobario3@gmail.com Vala es un lenguaje de programacin creado con el objetivo de acercar las caractersticas de los lenguajes modernos a C, sin requisitos adicionales de tiempo de ejecucin y con pocos costos, centrado en los objetos de la biblioteca GObject. Eso es lo que dice la Wikipedia. Para comenzar en GNU/LINUX sudo apt-get install valac libgtk-3-dev Y con eso sera suficiente. Ahora a programar .

EjemploN1:
Nombre del widget o programa : Botones .

////////////////////////////////////////////////////////////////////////////////////////

/* valac --pkg gtk+-3.0 botones.vala */

using Gtk;

private Gtk.Button button;

Gtk.Button create_button () { Gtk.Button button3; button3 = new Button.with_label ("Ocultar"); button3.clicked.connect (on); return button3; } public void on () { button.hide (); }

Gtk.Window create_window () { Gtk.Button lbox; lbox = create_button (); Gtk.Window window; Gtk.VBox vbox; Gtk.Button button2; window = new Gtk.Window (); window.title = "Botones"; window.resize (600, 400); vbox = new Gtk.VBox (false, 1);

button = new Button.with_label ("Button"); vbox.pack_start (button, false, false, 0); button2 = new Button.with_label ("Mostrar"); vbox.pack_start (button2, false, false, 0); vbox.pack_start (lbox, false, false, 0); window.add (vbox);

button2.clicked.connect (on2); return window; } public void on2 () { button.show (); } void main (string[] args) { Gtk.Window window; Gtk.init (ref args); window = create_window (); window.show_all (); Gtk.main (); }

El ejemplo consiste en crear tres botones . El boton con nombre mostrar para mostrar el botn llamado button . Un tercer botn llamado ocultar ,para ocultar al botn llamado button.

En Vala (Gtk 3.0) existen diferentes formas para crear un widget yo tratare de explicar las mas usadas normalmente . Empezamos a explicar la creacin del widgets o programa llamado Botones /*************************************************/ Primera sentencia using Gtk; colocamos la librera que vamos a necesitar en este caso Gtk . Como todos saben Gtk es un conjunto de libreras en las cuales se basa o se construye GNOME 3.0 .

/*************************************************/ private Gtk.Button button; Declaramos el widgets que utilizaremos en una funcin .Por ejemplo para mostrar u ocultar ,o desactivar , o cualquier otra funcin . Este widgets estar disponible para realizar cualquier funcin con el . No necesitara ser declarado en alguna funcin dentro del widgets .

/*************************************************/ Gtk.Button create_button () { Gtk.Button button3; button3 = new Button.with_label ("Ocultar"); button3.clicked.connect (on); return button3; }

Creamos un widget o una funcin por fuera del Main . Es conveniente ya que nos sera til a la hora de crear un programa mucho mas complejo por ejemplo una interfaz de navegador web . Un programa mas complejo se construye a partir de programacin modular . Construimos un programa en varios archivos que forman el programa y luego compilamos los archivos ,mas adelante dar un ejemplo de programacin modular . Gtk.Button button3;

Declaramos un widget button o botn llamado button3.

button3 = new Button.with_label ("Ocultar"); Creamos el widget button y le damos el nombre de "Ocultar" . nombre que se puede ver en el botn creado .

button3.clicked.connect (on);

Creamos una seal conectada al widget button3 . Al hacer click sobre el botn llamaremos la funcin on . A la funcion on la explicaremos mas adelante ,funcin con la cual hacemos desaparecer al widget button.

return button3; Finalizamos la retro-llamada del widget button3 as terminamos el lazo de invocacin del widget. Por ejemplo si hubiramos creado una caja colocaramos .

Gtk.VBox button3; return button3; En este caso el nombre button3 es el de una caja vertical.

/*************************************************/ public void on () { button.hide(); } Declaramos la funcin on conectada a button3 . Muestro la conexin del widget .

button3.clicked.connect (on);

public void on ()

Al hacer click en button3 llamaremos a la funcin on

button.show (); Con esta sentencia escondemos al widget button . Al widget button lo habamos declarado al principio del widget ( private Gtk.Button button; ) . A dicho widget lo estamos usando en esta una funcin . Por eso lo declaramos al principio de nuestro programa de la forma que explique .

/************************************************************/

Gtk.Window create_window () { Gtk.Button lbox; lbox = create_button (); Gtk.Window window; Gtk.VBox vbox; Gtk.Button button2; window = new Gtk.Window (); window.title = "Botones"; window.resize (600, 400); vbox = new Gtk.VBox (false, 1); button = new Button.with_label ("Button"); vbox.pack_start (button, false, false, 0); button2 = new Button.with_label ("Mostrar"); vbox.pack_start (button2, false, false, 0); vbox.pack_start (lbox, false, false, 0); window.add (vbox);

button2.clicked.connect (on2); return window; }

Gtk.Window create_window ()

Creamos un widget o una funcin .En este caso sera nuestra funcin principal que se mostrara en una ventana cuando lo ejecutamos al programa

Gtk.Button lbox; lbox = create_button ();

Con esta declaracin llamaremos al widget creado por fuera de la funcin Principal o del Main. Primero declaramos un widget button o botn . Gtk.Button lbox; luego a dicho widgets le asignamos el widget escrito por fuera de la funcin principal lbox = create_button ();

Muestro la conexin del widget escrito por fuera de la funcin principal .

Gtk.Button lbox;

lbox

Gtk.Button create_button ()

o de otra manera .

Gtk.Button lbox;

lbox lbox = create_button ();

Gtk.Button create_button ()

Gtk.Window window; Declaramos un widget window o ventana . que sera la ventana principal que se mostrara en el widget .le damos el nombre de window .

Gtk.VBox vbox;

Declaramos un widget vbox o caja vertical . Este widget nos sirve para contener a otros widget aunque no se lo puede ver . le damos el nombre de vbox .

Gtk.Button button2;

Declaramos un widget button .le damos el nombre de button2 .

window = new Gtk.Window (); Creamos el widget window window.title = "Botones";

Con esta sentencia establecemos el titulo del widget ventana o window en nuestro caso : "Botones" . window.resize (600, 400); Con esta sentencia establecemos el tamao del widget ventana o window en nuestro caso . El tamao sera de 600 x 400 .

vbox = new Gtk.VBox (false, 1);

Creamos el widget vbox .

button = new Button.with_label ("Button"); Creamos el widget button. Este widget lo habamos declarado al principio como:

private Gtk.Button button;

analizamos la siguiente sentencias.

vbox.pack_start (button, false, false, 0);

Introducimos el widget button dentro del widget vbox que lo contendr .

button2 = new Button.with_label ("Mostrar");

Creamos el widget button2

vbox.pack_start (button2, false, false, 0);

Inducimos el widget button2 dentro del widget vbox que lo contendr .

false=x =tamao natural del widget button . false=y=tamao natural del widget button . 0 = distancia con respecto a vbox que lo contiene .

Si colocamos true en x y en y el widget button se expande ocupando el espacio vacio vbox . Pueden comprobarlo si desean .

vbox.pack_start (lbox, false, false, 0);

Introducimos el widget lbox dentro del widget vbox que lo contendr .

window.add (vbox);

Introducimos el widget vbox dentro del widget window que lo contendr .

button2.clicked.connect (on2);

Creamos una seal conectada al widget button2 . Al hacer click sobre el botn llamaremos la funcin on 2 . A la funcion on2 la explicaremos mas adelante ,funcin con la cual hacemos desaparecer al widget button2.

return window;

Finalizamos la retro-llamada del widget window

as terminamos el lazo de invocacin del

widget window .

/************************************************************/ public void on2 () { button.show (); }

Declaramos la funcin on2 conectada a button2 . Muestro la conexin del widget .

button2.clicked.connect (on);

public void on2 ()

Al hacer click en button2 llamaremos a la funcon on2

button.show ();

Con esta sentencia mostramos al widget button 2. Al widget button lo habitamos declarado al principio del widget ( private Gtk.Button button; ) . A dicho widget lo estamos usando en una funcin .

/************************************************************/

void main (string[] args) { Gtk.Window window; Gtk.init (ref args);

window.show_all (); Gtk.main (); }

void main (string[] args) Creamos el Main Gtk.Window window;

window = create_window (); Con esta declaracin llamaremos al widget Principal o del Main . Primero declaramos un widget ventana o window . funcin Principal o que estar dentro

Gtk.Window window; luego a hace widgets le asignamos el widget de la funcion principal window = create_window ();

Muestro la conexin del widget de la funcin principal . Gtk.Window window; window Gtk.Window create_window ()

o de otra manera . Gtk.Window window; window = create_window (); Gtk.Window create_window ()

window.show_all ();

Con esta declaracin o sentencia mostramos todo el contenido del widget ventana o window . Gtk.main (); Declaramos la retro-llama del Main , as finalizamos con nuestro programa.

Procedemos a compilar nuestro Widget

Para ello abrimos el GEDIT o lo instalamos al programa llamado GEDIT. Copiamos o escribimos el Ejemplo 1 en el GEDIT.

Guardamos nuestro archivo en una carpeta de nuestro escritorio .

Por ejemplo lo guardamos en la carpeta llamada botones. Lo guardamos como botones.vala

Aqu ya podemos ver el programa ya guardado llamado botones.vala

Luego abrimos la carpeta botones con el terminal . Elegimos la opcin . Abrir en un terminal .

Luego compilamos utilizando el el compilador valac y la librera Gtk 3.0 = pkg gtk+-3.0 . Colocamos o pegamos en el terminal la sentencia :

valac --pkg gtk+-3.0 botones.vala

luego apretamos ENTER en nuestro teclado y listo nuestro ejecutable escrito en vala (gtk) estar lista dentro de la carpeta donde colocamos el codigo de nuestro programa .El el ejemplo que aqu se muestra el ejecutable estar dentro de la carpeta botones .

Aqu podemos apreciar nuestro programa ejecutable . Para ejecutarlo solo hay que hacer un doble click sobre el auto-ejecutable y nuestro widget se mostrara .