Expo.docx

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 Applet Frame Window Dialog Component Panel Button Canvas Checkbox Choice Label List TextArea TextField Menu MenuItem

Swing JApplet JFrame JWindow JDialog JComponent JPanel JButton Panel JCheckBox o JRadioButton JComboBox JLabel JList JTextArea JTextField JMenu 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); JPanel newPanel = new JPanel(false);

// enable double buffering // 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