4- Listas y cuadros de texto

  Curso: Introducción a Delphi y Lazarus

Ya sabemos lo básico sobre cómo escribir textos estáticos empleando etiquetas (TLabel), como permitir que el usuario teclee datos, con las casillas de introducción de texto (TEdit), y como poner tareas en marcha pulsando un botón (TButton).

Ahora vamos a ver otros dos componentes que son muy frecuentes en la programación visual: las listas de textos, sean desplegables o no.

Lo haremos con un proyecto sencillo: en una línea de introducción de texto escribiremos una cierta palabra o frase. Al pulsar un botón, ese texto se añadirá a la lista ya existente. Además, existirá una segunda lista, que será desplegable. Cuando se escoja un elemento de esa lista, se añadirá también a la primera.

Vamos a comenzar por crear un nuevo proyecto (en principio, al entrar a Lazarus veremos nuestro proyecto anterior, por si queremos continuar con él). Lo hacemos desde el menú "Archivo", en la opción "Nuevo":

Y escogemos que queremos una nueva aplicación:

Ahora añadiremos un elemento de tipo "TListBox" y otro de tipo "TComboBox". El primero será la lista estática en la que iremos insertando textos. El segundo es una lista desplegable, que en este ejemplo usaremos para almacenar textos predefinidos.

Para que luego nos resulte más fácil ampliar o modificar el programa, vamos a dar nombres significativos a cada elemento. Por ejemplo, el "ListBox" que va a mostrar los resultados podría llamarse "lstResultados", en vez de ListBox1, y el "ComboBox" que contiene textos predefinidos debería ser algo como "cbPredefinidos", en lugar de ComboBox1.

Ahora rellenamos los valores prefijados de nuestro ComboBox. Los valores que almacena una lista se encuentran en un componente llamado "Items", que a su vez está formado por varias cadenas (Strings). Para hacerlo desde el inspector de objetos, hacemos doble clic en "Items" de nuestro "cbPredefinidos" y aparece una ventana en la que podemos escribir los textos que nos interese:

Si queremos añadir elementos desde el programa, usaríamos el método Add, como veremos enseguida.

Para completar la parte visual de nuestro programa, nos queda incluir una casilla de edición de texto para poder escribir mensaje "a medida" (que podríamos llamar "edAMedida"), un botón encargado de añadir lo que hayamos tecleado (podría ser "btAnadir", hay que recordar que los identificadores no deben contener caracteres que no sean parte del alfabeto inglés), y alguna etiqueta de texto:

Sólo queda decir a qué eventos (sucesos) debe responder nuestro programa:

Cuando se pulse el botón, habrá que añadir el texto de nuestro TEDit a nuestro TListBox. Para conseguirlo, hacemos doble clic en nuestro botón, con lo que aparece el hueco para rellenar el código fuente que corresponde a su suceso "OnClick". Podríamos hacer algo así:

procedure TForm1.btAnadirClick(Sender: TObject);
begin
  lstResultados.Items.add(edAMedida.Text);
end;  

(es decir, añadimos a los "Items" de "lstResultados" el texto que contiene la casilla de edición "edAMedida")

Si miramos el inspector de objetos, la pestaña de "Eventos" ahora debería ser algo parecido a:

Vemos que hay muchos eventos que todavía no hemos usado. Por ejemplo, podríamos comprobar cuando el ratón pasa por encima del botón (OnMouseEnter) o cuando sale (OnMouseLeave), cuando se pulsa una tecla (OnKeyPress) o cuando se deja de pulsar (OnKeyUp), cuando se llega al botón desde otro punto de la ventana (por ejemplo, al pulsar el tabulador, OnEnter) y otros tantos, que iremos empleando cuando nos resulten útiles.

Por su parte, para el ComboBox, queremos que se añada su texto al ListBox cuando el usuario elija una opción. Para lograrlo, seleccionamos nuestro "cbPredefinidos", vamos al inspector de objetos, en la pestaña de "Eventos", y hacemos doble clic en su evento "OnSelect":

El código que incluiremos en este caso es muy parecido al de antes:

procedure TForm1.cbPredefinidosSelect(Sender: TObject);
begin
  lstResultados.Items.add(cbPredefinidos.Text);
end;    

Y el resultado de nuestro programa en funcionamiento, después de escribir algún que otro texto y escoger también algún valor del ComboBox, debería ser algo como:

Actualizado el: 30-10-2006 10:51