UNIDAD I.- Elementos de Interfaces Gráficas

Tópicos Selectos de Programación
UNIDAD I.- Elementos de Interfaces Gráficas
___________________________________________________________________
LECCIÓN 1.2.- Librerías de Interfaz Gráfica
___________________________________________________________________
1.2.1.- Librerías gráficas de Java
En java existen varios paquetes para manejo de la interfaz gráfica:
–
AWT (Abstract Window Toolkit): Paquete básico para el diseño de interfaces gráficas de
Java.
–
Swing: A partir de la versión 1.2, para crear interfaces gráficas profesionales con
independencia de plataforma.
–
Java2D: Para manejar objetos gráficos (lineas, elipses, curvas) como objetos y aplicar
transformaciones sobre estos (rotación, escalado).
–
Java3D: Para manipular vistas tridimensionales de objetos gráficos.
Elementos gráficos
Toda interfaz gráfica tiene:
–
Componentes: Objetos que representan un elemento gráfico (botón, cuadro de texto)
–
Contenedores: Objetos que contienen componentes (Ventanas, Cuadros de Dialogo)
–
Administradores de diseño: Objetos que controlan la forma en que se ordenan y
acomodan los componentes dentro de un contenedor.
–
Contexto gráfico: Área de un componente gráfico donde se puden dibujar primitivas
gráficas (lineas, curvas) y colocar imágenes.
Rafael Rivera López
1
Tópicos Selectos de Programación
1.2.2.- Componentes gráficos
Un componente es un objeto que tiene una representación gráfica que puede ser presentada
en una pantalla y puede interactuar con el usuario. La clase abstracta Component contiene
los métodos comúnes para todos los componentes gráficos.
Tabla 2.1.- Métodos más utilizados en un componente gráfico
Método
Descripción
setSize(int largo,int ancho)
Define el tamaño del componete
setLocation(int x, int y)
Define la ubicación del componente
setBounds(int x, int y, int largo, int ancho) Define la ubicación y tamaño del componente
setBackground(Color color)
Define el color de fondo del componente
Rafael Rivera López
2
Tópicos Selectos de Programación
Tabla 2.1.- Métodos más utilizados en un componente gráfico
Método
Descripción
paint(Graphics g)
Permite dibujar primitivas gráficas dentro del componente
1.2.3.- Contenedores gráficos
Un contenedor es un componente gráfico que tiene la capacidad de almacenar otros
componentes gráficos.
Tabla 2.2.- Métodos más utilizados en un contenedor gráfico.
Método
Descripción
add(Component x)
Adiciona un componente al contenedor
remove(Component x)
Remueve un compoenente del contenedor
setLayout(LayoutManager x) Define cual es el administrador de diseño de contenedor
Frame: Un frame es una ventana con un título, un ícono asociado, un tipo de cursor asociado
y una barra de menú (opcional).
Rafael Rivera López
3
Tópicos Selectos de Programación
Se pueden crear ventanas de dos formas:
–
Creando un objeto dentro de la clase aplicación
–
Creando una clase instanciable que herede de Frame.
–
Creando un objeto de la clase Frame
import java.awt.*;
public class Ventana{
public static void main(String[] args){
Frame f = new Frame("Primera Ventana");
f.setSize(300,300);
f.setLocation(200,100);
f.setBackground(Color.cyan);
f.setVisible(true);
}
}
Rafael Rivera López
4
Tópicos Selectos de Programación
Creando un clase instanciable que herede de Frame
package nuevaventana;
import java.awt.*;
//Clase Instanciable
public class MiVentana extends Frame{
public MiVentana(){
super("Mi Ventana");
setSize(300,300);
setLocation(200,100);
setBackground(Color.cyan);
addComponentes();
}
public MiVentana(Color color){
this();
setBackground(color);
}
}
public void addComponentes(){
Button b = new Button("Aceptar");
add(b);
}
package nuevaventana;
public class Main {
public static void main(String[] args) {
MiVentana v = new MiVentana();
v.setVisible(true);
MiVentana y = new MiVentana(java.awt.Color.BLUE);
y.setVisible(true);
// Se crea un objeto anónimo
new MiVentana(java.awt.Color.yellow).setVisible(true);
}
}
Rafael Rivera López
5
Tópicos Selectos de Programación
1.2.4.- Administradores de diseño
–
Un administrador de diseño (layout) es un objeto que se encarga de controlar la ubicación
y apariencia de los componentes dentro de un contenedor.
–
Se activa con el método setLayout(LayoutManager x)
–
Si no se indica, se tiene ya uno predefinido:
–
–
Para objetos que derivan de Window (Frame, Dialog) es BorderLayout()
–
Para objetos que derivan de Panel (Panel, Applet) es FlowLayout
Adicionando un componente al contenedor: Se utiliza un método definido por el usuario
denominado addComponentes()
–
Si no se indica el administrador de diseño, Frame usan BorderLayout y el componente se
coloca en toda la ventana, porque no se indico su ubicación
package layouts;
import java.awt.*;
public class MiVentana extends Frame{
public MiVentana(){
super("Ventana con un botón");
setSize(200,200);
setLocation(5,300);
setBackground(Color.WHITE);
addComponentes();
setVisible(true);
}
}
public void addComponentes(){
add(new Button("Botón"));
}
Rafael Rivera López
6
Tópicos Selectos de Programación
Tabla 2.3.- Administradores de diseño para contenedores en Java
Layout
Descripción
BorderLayout
Divide el contexto gráfico en cinco áreas. Se debe indicar en que área se adiciona
el componente. Se utiliza una constante o un String:
Norte: BorderLayout.NORTH ó “North”
Sur: BorderLayout.SOUTH ó “South”
Centro: BorderLayout.CENTER ó “Center”
Este: BorderLayout.EAST ó “East”
Oeste: BorderLayout.WEST ó “West”
FlowLayout
Coloca a los componentes al centro del contenedor, en la parte superior y ajusta
el tamaño del componente al mínimo.
GridLayout
Divide el contexto gráfico en una malla de n líneas y m columnas
CardLayout
Coloca a los componentes en una pila donde solo está visible un componente.
GridBagLayout
Divide al contexto gráfico en secciones cuyo tamaño es definido por el usuario.
Ventana con FlowLayout:
package layouts;
import java.awt.*;
public class MiVentana1 extends Frame{
public MiVentana1(){
super("Ventana con FlowLayout");
setSize(300,300);
setLocation(10,10);
setBackground(Color.cyan);
addComponentes();
setVisible(true);
}
public void addComponentes(){
setLayout(new FlowLayout());
add(new Button("Ok"));
add(new Button("Cancel"));
}
}
Rafael Rivera López
7
Tópicos Selectos de Programación
Ventana con dos o mas contenedores:
Un contenedor es un componentes, por lo que puede estar contenido en otro contenedro
import java.awt.*;
public class MiVentana2 extends Frame{
public MiVentana2(){
super("Ventana con dos contenedores");
setSize(300,300);
setLocation(340,100);
setBackground(Color.orange);
addComponentes();
setVisible(true);
}
public void addComponentes(){
// Un Frame tiene BorderLayout
add(new Label("Captura un Texto"),"North");
add(new TextArea(200,200),"Center");
// Un panel es un contenedor con FlowLayout
Panel p = new Panel();
add(p,"South");
p.add(new Button("Aceptar"));
p.add(new Button("Cancelar"));
}
}
Ventana con GridLayout:
package layouts;
import java.awt.*;
public class MiVentana3 extends Frame{
public MiVentana3(){
super("Primera Calculadora");
setSize(200,250);
setLocation(450,300);
setBackground(Color.WHITE);
addComponentes();
setVisible(true);
}
Rafael Rivera López
8
Tópicos Selectos de Programación
public void addComponentes(){
Panel p1 = new Panel();
Panel p2 = new Panel();
add(new TextField(),"North");
add(p1,"Center");
add(p2,"East");
add(new Button("="),"South");
// Se define una malla para el panel p1
p1.setLayout(new GridLayout(3,3));
for(int i=1;i<=9;i++)
p1.add(new Button(""+i));
// Se define otra malla para el panel p2
p2.setLayout(new GridLayout(2,1));
p2.add(new Button("+"));
p2.add(new Button("-"));
}
}
Ventana con CardLayout:
package layouts;
import java.awt.*;
public class MiVentana4 extends Frame{
public MiVentana4(){
super("Ventana con CardLayout");
setSize(200,250);
setLocation(450,300);
setBackground(Color.WHITE);
addComponentes();
setVisible(true);
}
public void addComponentes(){
CardLayout c = new CardLayout();
setLayout(c);
add(new Button("Boton inicial"),"1");
add(new TextArea(40,80),"2");
add(new Label("Etiqueta"),"3");
c.show(this,"1");
Rafael Rivera López
9
Tópicos Selectos de Programación
}
setVisible(true);
for(int i=0;i<8;i++){
try{
Thread.sleep(1000);
}
catch(InterruptedException e){
System.err.println("error!"+e);
}
c.next(this);
}
}
Se necesita una referencia para el administrador de diseño:
CardLayout c = new CardLayout();
setLayout(c);
Se adiciona indicando una etiqueta:
add(new Button("Boton inicial"),"1");
add(new TextArea(40,80),"2");
add(new Label("Etiqueta"),"3");
Se indica con show cual es el primer componente a presentar
c.show(this,"1");
Se indica con next que se cambie el componente:
c.next(this);
Sin Layout:
Utilizando setLayout(null) se indica que no se va a utilizar un administrador de diseño
package layouts;
import java.awt.*;
public class MiVentana5 extends Frame{
public MiVentana5(){
super("Ventana sin Layout");
setSize(200,250);
setLocation(100,100);
Rafael Rivera López
10
Tópicos Selectos de Programación
setBackground(Color.YELLOW);
addComponentes();
setVisible(true);
}
}
public void addComponentes(){
setLayout(null);
Button b1 = new Button("Aceptar");
Button b2 = new Button("Cancelar");
b1.setBackground(Color.GREEN);
b1.setLocation(50,40);
b1.setSize(100,40);
b2.setBounds(100,200,40,40);
add(b1);
add(b2);
}
Rafael Rivera López
11