Departamento de Ciencias de la Computación

Programación II

Exposición:
Interfaz gráfica de Usuario

Integrantes:
Edgar Meneses
Steven Palacios
Paulette Parra

NRC:
4187

Profesora:
Ing. Margarita Zambrano

Fecha de entrega:
13/02/2017

Sangolquí-Ecuador
 INTERFAZ GRÁFICA DE USUARIO
Introducción
En la programación una de las dificultades no solo se compone del desarrollo de un
código funcional, sino, es la interacción entre las personas y la computadora, es decir
cuando una persona desea realizar un proceso en un computador requiere de una
pantalla que le explique qué debe realizar y que le facilite entender este proceso, para
ello en la actualidad se dispone de una interfaz gráfica que se compone de elementos
gráficos, elementos compuestos por objetos gráficos inscritos sin una superficie de
contacto en la que se pueden a su vez agregar elementos con sonido entre otras cosas, la
cual facilitará que el ser humano interactúa con la máquina y pueda usar la aplicación de
una manera mejor encaminada y más dinámica para él con la pantalla mostrada.

Objetivos

 Dar a conocer una visión general y las características de las Interfaces Graficas
en Java.
 Comprender el funcionamiento de las API de Java para la creación de Interfaces
Graficas de Usuario (GUI).
 Implementar todos los elementos del AWT y del SWING para la creación de
interfaces de fácil manejo para juntarlas con los códigos de programas
previamente estudiados.
 Realizar un ejemplo concreto de la utilización de las interfaces gráficas para la
retroalimentación de los conocimientos a impartir en la clase.

Visión general de AWT

El interfaz de usuario es el aspecto más importante de cualquier aplicación. Una
aplicación sin un interfaz fácil, impide que los usuarios saquen el máximo rendimiento
del programa. Java proporciona los elementos básicos para construir interfaces de
usuario a través del AWT, y opciones para mejorarlas mediante Swing, que sí permite la
creación de interfaces de usuario de gran impacto.
La Abstract Window Toolkit (AWT, en español Kit de Herramientas de Ventana
Abstracta) es un kit de herramientas de gráficos, interfaz de usuario, y sistema de
ventanas independiente de la plataforma original de Java.
Al nivel más bajo, el sistema operativo transmite información desde el ratón y el teclado
como dispositivos de entrada al programa. El AWT fue diseñado pensando en que el
programador no tuviese que preocuparse de detalles como controlar el movimiento del
ratón o leer el teclado, ni tampoco atender a detalles como la escritura en pantalla. El
AWT constituye una librería de clases orientada a objeto para cubrir estos recursos y
servicios de bajo nivel.
AWT es enorme, se compone de 12 paquetes. Afortunadamente, sólo 2 paquetes -
java.awty java.awt.event se utilizan comúnmente.
El java.awtpaquete contiene los núcleos clases gráficas AWT.
El java.awt.eventpaquete es compatible con la gestión de eventos.
AWT proporciona una plataforma independiente del dispositivo de interfaz para
desarrollar programas de diseño gráfico que se ejecuta en todas las plataformas, como
Windows, Mac y Linux.

Las Funciones AWT incluyen:

java.awt.Graphics
Proporciona métodos para dibujar figuras, fonts, imágenes, etc.
Representa el contexto gráfico de un componente o imagen.
java.awt.Component
Proporciona componentes de alto nivel para construir los interfaces de usuario.
Estructura del AWT (Abstract Window Toolkit)
La estructura de la versión actual del AWT se puede resumir en los puntos que se
exponen a continuación:
Los Contenedores contienen Componentes, que son los controles básicos
No se usan posiciones fijas de los Componentes, sino que están situados a través de una
disposición controlada (layouts)
El común denominador de más bajo nivel se acerca al teclado, ratón y manejo de
eventos
Alto nivel de abstracción respecto al entorno de ventanas en que se ejecute la aplicación
(no hay áreas cliente, ni llamadas a X, ni hWnds, etc.)
La arquitectura de la aplicación es dependiente del entorno de ventanas, en vez de tener
un tamaño fijo
Es bastante dependiente de la máquina en que se ejecuta la aplicación (no puede asumir
que un diálogo tendrá el mismo tamaño en cada máquina)
Carece de un formato de recursos. No se puede separar el código de lo que es
propiamente interface. No hay ningún diseñador de interfaces (todavía)
Clases:
Button
Label
Checkbox
Choice
List
TextField
TextArea
Scrollbar
Canvas
Menu
MenuBar
PopupMenu
Contenedores:
Panel
Frame
Dialog
ScrollPane

Creación de interfaces gráficas de usuario con SWING

Por su actualidad y ser adecuado en su manejo, se utiliza el Swing en la modernidad
para el diseño y creación de una Interfaz Gráfica en JAVA, como todo componente de
Java el Swing tiene los elementos de las clases.
Las clases cuyo nombre inician con J forman parte del Swing. Todas las demás están
incluidas en AWT (Abstract Window Toolkit).

Component: es una clase abstracta que representa cualquier componente con

representación gráfica.

Container: es un componente que puede contener a otros componentes gráficos. (Ejm:

JPanel).

JFrame: permite representar ventanas, si bien también se pueden utilizar clases como
JApplet o JDialog, los frames como JFrame son contenedores, por lo que incluyen un
“panel de contenido” (content pane) al cual se le pueden añadir componentes gráficos
(etiquetas, botones, cajas de texto, etc.) y otros contenedores (como paneles JPanel).

Las interfaces gráficas de usuario se construyen con componentes, cada uno de los
cuales está preparado para responder a distintos tipos de eventos. Algunos de lso
componente incluidos en Swing son:
JLabel
JButton
JCheckBox
JComboBox
JList
JToolBar
JTable
Menús: JMenuBar, JMenu, JMenuItem
Ventanas de diálogo: JOptionPane
Ventanas estándar: JFileChooser, JColorChooser

Jerarquía de clases de java SWING

La Clase JComponent, desciende directamente de contenedores en la clase rais de la

mayoría de componentes Swing de interfaz de usuario. En la figura se muestra la
jerarquía a partir de la clase OBJECT hasta llegar a los componentes de Java Swing.
Componentes de SWING
Las componentes de Swing utilizan la infraestructura de AWT, incluyendo el modelo de
eventos AWT, el cual rige cómo una componente reacciona a eventos tales como,
eventos de teclado, mouse, etc... Es por esto, que la mayoría de los programas Swing
necesitan importar dos paquetes AWT: java.awt.* y java.awt.event.*.
AWT Swing
Applet JApplet
Frame JFrame
Window JWindow
Dialog JDialog
Component JComponent
Panel JPanel
Button JButton
Canvas Panel
Checkbox JCheckBox o
JRadioButton
Choice JComboBox
Label JLabel
List JList
TextArea JTextArea
TextField JTextField
Menu JMenu
MenuItem JMenuItem

Como conclusión, podríamos decir que si queremos que nuestra aplicación corra en
cualquier entorno, independientemente de la antigüedad del mismo, deberíamos usar
AWT; ahora bien, si lo que queremos es una herramienta potente, flexible, usar tablas y
otros componentes complejos; y completamente adaptable a nuestras necesidades, desde
luego nuestra decisión está clara, usaremos la tecnología Swing. (swing-facil.blogspot,
s.f.)

JPanel
Los JPanel en Java son objetos contenedores, la finalidad de estos objetos es la
agrupación de otros objetos tales como botones, campos de texto, etiquetas, selectores,
etc; una gran ventaja de Usar JPanel en Java es que podemos manejar la agrupación de
una mejor forma, supongamos que tenemos una serie de botones en un panel, y
deseamos desactivarlos todos a las vez, en lugar de hacerlo individualmente con los
botones, podemos desactivar el panel y con esto los botones.
Es la versión Swing de la clase Panel de AWT y utiliza el mismo diseño por defecto,
FlowLayout.
El concepto de Layout puede traducirse como “disposición” o “plan” y tiene un uso
extendido en el ámbito de la tecnología.
El FlowLayout, es aquel layout que ubica a todos los componentes en forma horizontal,
en el orden q le digamos.
Primero tenemos que crear el contenedor (JFrame, JPanel, etc), y luego atravez del
metodo “setLayout()” asignarle el layout correspondiente.
JFrame frame = new JFrame();
frame.setLayout(new FlowLayout());

Una vez, asiganado el layout al contenedor, tendremos que agregar los componentes,
plenamente ya declarados y creados.
JButton boton = new JButton("Aceptar");
frame.add(boton);
Hecho esto, el contenedor mismo, los ubicara en el centro(por defecto). Si queremos
que empieze de derecha a izquierda o izquierda a derecha o en el centro, se lo decimos.
frame.setLayout(new floLayout(FlowLayout.CENTER));
frame.setLayout(new floLayout(FlowLayout.RIGHT));
frame.setLayout(new floLayout(FlowLayout.LEFT));

public class JPanel

extiende JComponent
implementa accesible

Creación de un nuevo JPanel

El JPanel clase reside en el paquete javax.swing y es una subclase de
la javax.swing.JComponent clase.
Normalmente creamos nuevas JPanel objeto tan simple como sigue:
JPanel newPanel = new JPanel();
Eso crea un nuevo JPanel con doble activado por defecto.
A menudo, creamos una clase que se extiende desde JPanel de la siguiente manera:
public class UserDetail extends JPanel {
// code to add components to the panel
}
Si queremos especificar la estrategia de doble búfer de forma explícita, utilice el
constructor JPanel (isDoubleBuffered booleano) :
 JPanel newPanel = new JPanel(true); // enable double buffering
JPanel newPanel = new JPanel(false); // disable double buffering
También podemos especificar un controlador de distribución al crear el panel:
JPanel newPanel = new JPanel(new GridBagLayout());
JPanel newPanel = new JPanel(new BorderLayout());
De manera predeterminada, el panel tiene un controlador de distribución de flujo.
Otro constructor nos permite especificar tanto la estrategia de almacenamiento en búfer
doble y un controlador de distribución:
// use grid bag layout and no double buffering:
JPanel newPanel = new JPanel(new GridBagLayout(), false);

Frame

Un Frame es una ventana de nivel superior con un título y un borde. El tamaño de la

trama incluye cualquier zona designada para la frontera. Las dimensiones de la zona
fronteriza se pueden obtener usando el método getInsets.
Un Frame, implementado como una instancia de la JFrameclass, es una ventana que
tiene decoraciones tales como un borde, un título, y es compatible con componentes de
botón que se cierran o iconificar la ventana. Las aplicaciones con una interfaz gráfica de
usuario incluyen generalmente al menos una trama. Applets veces utilizan tramas,
también.

JInternalFrame

Figura 3. JInternalFrame. Fuente: Internet.

Un JInternalFrame es una ventana que va dentro de un panel y no puede salirse de él, y
para el uso de JInternalFrame se tiene que crear un JDesktopPane, que es la manera mas
adecuada de generar JInternalFrame’s.
Es importante darle tamaño al JInternalFrame, ya que si no, no lo veremos porque tiene
por defecto de tamaño 0,0 y no es redimensionable, ni se puede cerrar ni tiene botones
de maximizar y minimizar.

JWindow
JWindow no tiene la barra de título, botones de gestión de ventanas, u otros adornos
asociados con un JFrame. Piense en ello como una ventana sin borde.
Es la versión de Swing de la ventana y es desciendente directa de esa clase, al igual que
Windows, usa BorderLayout por defecto.

Figura 4. Diferencia entre Frame y JWindow. Fuente: Internet.

JDialog
Es la clase principal para la creación de una ventana de diálogo. Puede utilizar esta clase
para crear un diálogo personalizado, o invocar los muchos métodos de la clase en
JOptionPane y crear una variedad de diálogos estándar.
El JDialog contiene una JRootPane como su único hijo. El contentPane debe ser el
padre de los hijos del JDialog. Para su conveniencia add y sus variantes, remove y
setLayout han sido invalidada remitir a la contentPane que sea necesario.

JLabel
Objeto de control JLabel
Un objeto de control Jlabel permite dibujar en el formulario una etiqueta, entendiéndose
como etiqueta una expresión estática que se quiere colocar. También es usado para
mostrar los resultados de un proceso.
Propiedades más usadas:
Text: Contiene el valor que se visualizará en el formulario.
Font: Permite establecer el tipo de letra de la expresión a mostrar en el formulario.
Border: Para establecer el tipo de borde de la etiqueta.
Enabled: Para habilitar o inhabilitar el uso del objeto de control.

JTextField
Permite la edición de una sola línea de texto. Las nuevas características incluyen la
capacidad de justificar el texto a la izquierda, derecha o centro y para establecer la
fuente del texto.

JPsswordField

JPasswordFieldes un componente ligero que permite la edición de una sola línea de

texto donde la vista indica algo que se ha escrito, pero no muestra los caracteres
originales.
JPasswordFieldse pretende que sea compatible con la fuente java.awt.TextField
utilizada con echoCharset. Se proporciona por separado para que sea más fácil cambiar
de forma segura la interfaz de usuario para el JTextField sin afectar a las entradas de
contraseñas.
JTextArea

JTextArea es un componente básico del Swing de Java y su función principal es la de

capturar texto ingresado desde teclado por el usuario. Sin embargo, entre sus métodos
está el de asignarle texto para mostrarlo además.

JButton

Componente donde el usuario hace clic para realizar una acción especificada en el
código.
Conclusiones
La interfaz gráfica de usuario va a permitir que exista una interacción entre el ser
humano y la máquina para efectuar las diversas funciones que se necesitan realizar.
Existen líneas de código con llamados para implementar estas partes del Frame pero el
trabajo se acorta si creamos un New JFrame Form… y en la sección Design procedemos
a agregar los botones, textos, etc.
Como en cualquier componente, existe una jerarquía de clases en el Swing la cual
debemos respetar para la correcta funcionalidad de los programas que construyamos.

Fuentes de consulta:
Recuperado el 11 de febrero de 2017 de:
https://es.wikipedia.org/wiki/Java_Foundation_Classes
http://docstore.mik.ua/orelly/java-ent/jfc/ch01_01.htm
https://www.dit.upm.es/~santiago/docencia/grado/tprg/apuntes3/pdf/Introduccion%20a
%20AWT.pdf
https://www.cis.upenn.edu/~bcpierce/courses/629/jdkdocs/guide/awt/designspec/lightw
eights.html
http://www.math.uni-hamburg.de/doc/java/tutorial/post1.0/preview/jfc.html
http://elvex.ugr.es/decsai/java/pdf/D1-swing.pdf
http://www3.ntu.edu.sg/home/ehchua/programming/java/j4a_gui.html
https://www.fdi.ucm.es/profesor/jpavon/poo/Tema6resumido.pdf
http://dis.um.es/~bmoros/Tutorial/parte13/cap13-1.html#Cap13_1_1