taller 1 7

22
Ing. Heber Gómez Hurtado Ing. Heber Gómez Hurtado 1 TALLER DE PROGRAMACION I TALLER DE PROGRAMACION I Tema: Swing Tema: Swing

Upload: eduardo-rosas-garcia

Post on 23-Jun-2015

5.573 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Taller 1 7

Ing. Heber Gómez HurtadoIng. Heber Gómez Hurtado 11

TALLER DE PROGRAMACION ITALLER DE PROGRAMACION I

Tema: SwingTema: Swing

Page 2: Taller 1 7

Ing. Heber Gómez HurtadoIng. Heber Gómez Hurtado 22

Swing (1 de 2)Swing (1 de 2) Swing es el nombre del proyecto JFC(Java Swing es el nombre del proyecto JFC(Java

Foundation Classes) que desarrollo nuevos Foundation Classes) que desarrollo nuevos componentes java para mejorar la presentación componentes java para mejorar la presentación de las G.U.I., disponible desde de las G.U.I., disponible desde JDK 1.1.5)JDK 1.1.5) • Componentes SwingComponentes Swing• Java2D APIJava2D API• Drag & dropDrag & drop

Swing es una versión mejorada del AWT y tiene Swing es una versión mejorada del AWT y tiene características nuevas como:características nuevas como:• Se puede mostrar imágenes en JLabels y Jbuttons.Se puede mostrar imágenes en JLabels y Jbuttons.• Se puede añadir y modificar facilmente los Bordes.Se puede añadir y modificar facilmente los Bordes.• Las componentes no tienen por qué ser rectangulares Las componentes no tienen por qué ser rectangulares

(p.e. circulares)(p.e. circulares)• Cambiar look & feelCambiar look & feel

Page 3: Taller 1 7

Ing. Heber Gómez HurtadoIng. Heber Gómez Hurtado 33

Swing (2 de 2)Swing (2 de 2) Para usar las componentes Swing debemos importar el Para usar las componentes Swing debemos importar el

paquete paquete javax.swing.*javax.swing.* Los componentes en Swing fueron renombrados. Por Los componentes en Swing fueron renombrados. Por

ejemplo: AWT-> Button y SWING->JButton.ejemplo: AWT-> Button y SWING->JButton. Nuevas componentes: JTable, JTree, ventanas MDINuevas componentes: JTable, JTree, ventanas MDI El JFrame es un contenedor principal donde se colocan El JFrame es un contenedor principal donde se colocan

otros componentes Swing. Otros contenedores son: otros componentes Swing. Otros contenedores son: JApplet y Jdialog.JApplet y Jdialog.

El JPanel es un contenedor intermedio, el cual simplifica el El JPanel es un contenedor intermedio, el cual simplifica el posicionamiento de los objetos.posicionamiento de los objetos.

Otros contenedores intermedios son los paneles Otros contenedores intermedios son los paneles desplazables (JScrollPane) y los paneles con pestañas desplazables (JScrollPane) y los paneles con pestañas (JTabbedPane), los cuales influyen en el desarrollo del GUI (JTabbedPane), los cuales influyen en el desarrollo del GUI de un programa. de un programa.

Page 4: Taller 1 7

Ing. Heber Gómez HurtadoIng. Heber Gómez Hurtado 44

Componentes SwingComponentes Swing ContenedoresContenedores

• Contienen otros componentes (o contenedores)Contienen otros componentes (o contenedores) Estos componentes se tienen que añadir al contenedor y Estos componentes se tienen que añadir al contenedor y

para ciertas operaciones se pueden tratar como un todopara ciertas operaciones se pueden tratar como un todo Mediante un gestor de diseño controlan la disposición Mediante un gestor de diseño controlan la disposición

((layoutlayout) de estoscomponentes en la pantalla) de estoscomponentes en la pantalla Ejemplo: JPanel, JFrame, JAppletEjemplo: JPanel, JFrame, JApplet

Lienzo (clase Lienzo (clase CanvasCanvas))• Superficie simple de dibujoSuperficie simple de dibujo

Componentes de interfaz de usuarioComponentes de interfaz de usuario• botones, listas, menús, casillas de verificación, campos botones, listas, menús, casillas de verificación, campos

de texto, etc.de texto, etc. Componentes de construcción de ventanasComponentes de construcción de ventanas

• ventanas, marcos, barras de menús, cuadros de diálogoventanas, marcos, barras de menús, cuadros de diálogo

Page 5: Taller 1 7

Ing. Heber Gómez HurtadoIng. Heber Gómez Hurtado 55

Jerarquía de Componentes SwingJerarquía de Componentes Swing

JComponent

AbstractButton

JComboBox

JLabel

JList

JPanel, etc

JTextComponent

JButton

JMenuItem

JToggleButton

JCheckBox

JRadioButton

JEditorPane

JTextArea

JTextField JPasswrodField

JTextPane

Page 6: Taller 1 7

Ing. Heber Gómez HurtadoIng. Heber Gómez Hurtado 66

Contenedores de alto nivelContenedores de alto nivel javax.swing.JFramejavax.swing.JFrame

• Habitualmente la clase Habitualmente la clase JFrame JFrame se se emplea para crear la ventana emplea para crear la ventana principal de una aplicación en principal de una aplicación en SwingSwing

javax.swing.JDialogjavax.swing.JDialog• Genera ventanas secundarias de Genera ventanas secundarias de

interacción con el usuariointeracción con el usuario Cuadros de diálogo configurables y Cuadros de diálogo configurables y

modificablesmodificables

• Son modales: el usuario no puede Son modales: el usuario no puede interactuar con otra ventana hasta interactuar con otra ventana hasta que no cierre la actualque no cierre la actual

Page 7: Taller 1 7

Ing. Heber Gómez HurtadoIng. Heber Gómez Hurtado 77

JFrameJFrame

La clase JFrame proporciona una ventana La clase JFrame proporciona una ventana principal de aplicación con su funcionalidad principal de aplicación con su funcionalidad normal (p.e. borde, título, menús) y un panel de normal (p.e. borde, título, menús) y un panel de contenido.contenido.

Los contenidos se añaden en el panel de Los contenidos se añaden en el panel de contenidos (content pane) accesible a través del contenidos (content pane) accesible a través del método getContentPane (por defecto, un objeto método getContentPane (por defecto, un objeto de tipo Jpane, aunque puede cambiarse con de tipo Jpane, aunque puede cambiarse con setContentPane).setContentPane).

La barra de menú puede fijarse con setJMenuBar.La barra de menú puede fijarse con setJMenuBar.

Page 8: Taller 1 7

Ing. Heber Gómez HurtadoIng. Heber Gómez Hurtado 88

JDialogJDialog La clase La clase JDialog JDialog es la clase raíz de las ventanases la clase raíz de las ventanas secundarias que implementan cuadros de diálogo secundarias que implementan cuadros de diálogo

en Swing.en Swing.• Dependen de una ventana principal (normalmente Dependen de una ventana principal (normalmente

JFrameJFrame) y si la ventana principal se cierra, se iconiza o ) y si la ventana principal se cierra, se iconiza o se desiconiza las ventanas secundarias realizan la se desiconiza las ventanas secundarias realizan la misma operación de forma automática.misma operación de forma automática.

Las ventanas modales bloquean la interacción del Las ventanas modales bloquean la interacción del usuario con otras ventanas.usuario con otras ventanas.• Se utilizan sólo cuando hay que garantizar que el Se utilizan sólo cuando hay que garantizar que el

usuario recibe un mensaje o proporciona una usuario recibe un mensaje o proporciona una información que es necesaria.información que es necesaria.

Page 9: Taller 1 7

Ing. Heber Gómez HurtadoIng. Heber Gómez Hurtado 99

Cuadros de diálogo estándar: Cuadros de diálogo estándar: JOptionPane(1 de 4)JOptionPane(1 de 4)

Tipos de cuadros de dialogo más habitualesTipos de cuadros de dialogo más habituales• Message para informar al usuario sobre algún Message para informar al usuario sobre algún

hecho relevantehecho relevante• Confirm para realizar una pregunta al usuario Confirm para realizar una pregunta al usuario

con las posibilidades básicas de respuesta de con las posibilidades básicas de respuesta de si, no o cancelar.si, no o cancelar.

• Input para solicitar una entrada del usuarioInput para solicitar una entrada del usuario• Option permite crear una ventana Option permite crear una ventana

personalizada de cualquiera de los tipos personalizada de cualquiera de los tipos anterioresanteriores

Todos los cuadros de diálogo que implementa Todos los cuadros de diálogo que implementa JOptionPane son modalesJOptionPane son modales

Page 10: Taller 1 7

Ing. Heber Gómez HurtadoIng. Heber Gómez Hurtado 1010

Cuadros de diálogo estándar: Cuadros de diálogo estándar: JOptionPane(2 de 4)JOptionPane(2 de 4)

JOptionPane.JOptionPane.showMessageDialog showMessageDialog (null, "Aviso", (null, "Aviso", "Alerta",JOptionPane.ERROR_MESSAGE);"Alerta",JOptionPane.ERROR_MESSAGE);

JOptionPane.showConfirmDialog (null, "Elige uno", "Seleccionar JOptionPane.showConfirmDialog (null, "Elige uno", "Seleccionar Uno",JOptionPane.YES_NO_OPTION);Uno",JOptionPane.YES_NO_OPTION);

Page 11: Taller 1 7

Ing. Heber Gómez HurtadoIng. Heber Gómez Hurtado 1111

Cuadros de diálogo estándar: Cuadros de diálogo estándar: JOptionPane(3 de 4)JOptionPane(3 de 4)

String valor = JOptionPane.showInputDialog ("Por Favor Ingrese un String valor = JOptionPane.showInputDialog ("Por Favor Ingrese un valor");valor");

Object[] opciones = { "Aceptar", "Cancelar" };Object[] opciones = { "Aceptar", "Cancelar" };

JOptionPane.showOptionDialog (null, "Click en Aceptar", JOptionPane.showOptionDialog (null, "Click en Aceptar", "Advertencia",JOptionPane.DEFAULT_OPTION,"Advertencia",JOptionPane.DEFAULT_OPTION,

JOptionPane.WARNING_MESSAGE,null, opciones,opciones[0]);JOptionPane.WARNING_MESSAGE,null, opciones,opciones[0]);

Page 12: Taller 1 7

Ing. Heber Gómez HurtadoIng. Heber Gómez Hurtado 1212

Cuadros de diálogo estándar: Cuadros de diálogo estándar: JOptionPane(4 de 4)JOptionPane(4 de 4)

Object[] valores = { "Primero", "Segundo", "Tercero" };Object[] valores = { "Primero", "Segundo", "Tercero" };

Object selectedValue = JOptionPane.showInputDialog(null, Object selectedValue = JOptionPane.showInputDialog(null, "Seleccionar uno", "Entrada", JOptionPane.INFORMATION_MESSAGE, "Seleccionar uno", "Entrada", JOptionPane.INFORMATION_MESSAGE, null, valores, valores[0]);null, valores, valores[0]);

Page 13: Taller 1 7

Ing. Heber Gómez HurtadoIng. Heber Gómez Hurtado 1313

Contenedores intermediosContenedores intermedios JPanelJPanel

• Agrupa a otros componentesAgrupa a otros componentes• No tiene presentación gráfica pero se le No tiene presentación gráfica pero se le

pueden añadir bordes o cambiar el color pueden añadir bordes o cambiar el color de fondode fondo

JScrollPaneJScrollPane• Incluye barras de desplazamientoIncluye barras de desplazamiento

Page 14: Taller 1 7

Ing. Heber Gómez HurtadoIng. Heber Gómez Hurtado 1414

JTabbedPaneJTabbedPane El panel con solapas un contenedor que El panel con solapas un contenedor que

gestiona varios componentes (o grupos de gestiona varios componentes (o grupos de componentes aunque habitualmente son componentes aunque habitualmente son paneles) como una pila de fichaspaneles) como una pila de fichas• Sólo uno de los componentes es visible en Sólo uno de los componentes es visible en

cada momentocada momento• El usuario puede decidir cual de los El usuario puede decidir cual de los

componentes se visualiza seleccionando la componentes se visualiza seleccionando la solapa o lengüeta correspondiente a dicho solapa o lengüeta correspondiente a dicho componente.componente.

Page 15: Taller 1 7

Ing. Heber Gómez HurtadoIng. Heber Gómez Hurtado 1515

JToolBarJToolBar Implementa una barra de herramientas, formada Implementa una barra de herramientas, formada

normalmente por botones o controles que normalmente por botones o controles que incluyen iconos, y que aparecen organizados incluyen iconos, y que aparecen organizados como una fila o una columna dependiendo de la como una fila o una columna dependiendo de la zona de la pantalla donde se coloquezona de la pantalla donde se coloque• Una barra de herramientas que puede cambiarse de Una barra de herramientas que puede cambiarse de

situación por los diferentes bordes de su contenedor, e, situación por los diferentes bordes de su contenedor, e, incluso, llevarse fuera (este comportamiento puede incluso, llevarse fuera (este comportamiento puede variarse: método setFloatable).variarse: método setFloatable).

• Las herramientas suelen ser (aunque no Las herramientas suelen ser (aunque no necesariamente) botones.necesariamente) botones.

• Útil para proporcionar controles que dan acceso rápido a Útil para proporcionar controles que dan acceso rápido a acciones, normalmente disponibles a través de menú.acciones, normalmente disponibles a través de menú.

• Mediante el método addSeparator es posible añadir Mediante el método addSeparator es posible añadir separadores.separadores.

• JToolBar es, en realidad, una especialización de Box.JToolBar es, en realidad, una especialización de Box.

Page 16: Taller 1 7

Ing. Heber Gómez HurtadoIng. Heber Gómez Hurtado 1616

Iconos, Etiquetas y Botones (1 de 2)Iconos, Etiquetas y Botones (1 de 2) IconosIconos

• Elementos gráficos que se pueden añadir a los Elementos gráficos que se pueden añadir a los componentescomponentes

EtiquetasEtiquetas• Elementos para mostrar informaciónElementos para mostrar información• Una etiqueta puede incluir un iconoUna etiqueta puede incluir un icono• El texto puede estar escrito con formato HTML. En este El texto puede estar escrito con formato HTML. En este

caso el texto debe empezar por “<html>”caso el texto debe empezar por “<html>”• Es posible cambiar dinámicamente el texto de la etiqueta Es posible cambiar dinámicamente el texto de la etiqueta

con setText.con setText. BotonesBotones

• Los botones, junto con los menús, son los controles más Los botones, junto con los menús, son los controles más típicostípicos

• Existen diferentes tipos (todos ellos especializan a Existen diferentes tipos (todos ellos especializan a AbstractButton).AbstractButton).

• JButton: Botón aislado. Puede pulsarse, pero su estado no JButton: Botón aislado. Puede pulsarse, pero su estado no cambia.cambia.

Page 17: Taller 1 7

Ing. Heber Gómez HurtadoIng. Heber Gómez Hurtado 1717

Iconos, Etiquetas y Botones (2 de 2)Iconos, Etiquetas y Botones (2 de 2) BotonesBotones

• JToggleButton : Botón seleccionable. Cuando se pulsa el JToggleButton : Botón seleccionable. Cuando se pulsa el botón, su estado pasa a seleccionado, hasta que se botón, su estado pasa a seleccionado, hasta que se pulsa de nuevo (entonces se deselecciona). isSelected pulsa de nuevo (entonces se deselecciona). isSelected permite chequear su estado.permite chequear su estado.

• JCheckBox : Especialización de JToggleButton que JCheckBox : Especialización de JToggleButton que implementa una casilla de verificación. Botón con estado implementa una casilla de verificación. Botón con estado interno, que cambia de apariencia de forma adecuada interno, que cambia de apariencia de forma adecuada según si está o no está seleccionado.según si está o no está seleccionado.

• JRadioButton: Especialización de JToggleButton que tiene JRadioButton: Especialización de JToggleButton que tiene sentido dentro de un mismo grupo de botones sentido dentro de un mismo grupo de botones (ButtonGroup) que controla que solamente uno de ellos (ButtonGroup) que controla que solamente uno de ellos está seleccionado (importante: ButtonGroup es está seleccionado (importante: ButtonGroup es únicamente un controlador, no un componente).únicamente un controlador, no un componente).

Page 18: Taller 1 7

Ing. Heber Gómez HurtadoIng. Heber Gómez Hurtado 1818

MenúsMenús

La creación de una barra de menús básica supone:La creación de una barra de menús básica supone:• Crear un objeto de tipo JMenuBar.Crear un objeto de tipo JMenuBar.• Para cada entrada, crear un objeto de tipo JMenu.Para cada entrada, crear un objeto de tipo JMenu.• Incluir objetos de tipo JMenuItem en el menú. Esto puede Incluir objetos de tipo JMenuItem en el menú. Esto puede

incluir menús anidados.incluir menús anidados.• Asociar a los items acciones apropiadas (notifican eventos Asociar a los items acciones apropiadas (notifican eventos

semánticos de tipo ActionEvent, ya que, en realidad, semánticos de tipo ActionEvent, ya que, en realidad, especializan a AbstractButton).especializan a AbstractButton).

Con setJMenuBar es posible añadir una barra de menús a Con setJMenuBar es posible añadir una barra de menús a una ventana (JFrame).una ventana (JFrame).

El diseño de una barra de menús debe ser consistente El diseño de una barra de menús debe ser consistente (poner opciones semánticamente relacionadas juntas). (poner opciones semánticamente relacionadas juntas). También pueden usarse separadoresTambién pueden usarse separadores

Page 19: Taller 1 7

Ing. Heber Gómez HurtadoIng. Heber Gómez Hurtado 1919

JTextField - JTextAreaJTextField - JTextArea

JTextFiledJTextFiled• Permite incluir un control para introducir una línea de texto.Permite incluir un control para introducir una línea de texto.• JPasswordField es análogo a JTextField, salvo que no se JPasswordField es análogo a JTextField, salvo que no se

visualiza lo que se escribe.visualiza lo que se escribe.• Con setEditable es posible establecer si puede escribirse o no Con setEditable es posible establecer si puede escribirse o no

en el campo de texto.en el campo de texto.• Notifica un ActionEvent cuando el usuario indica que la línea Notifica un ActionEvent cuando el usuario indica que la línea

de texto está completa (normalmente pulsando retorno de de texto está completa (normalmente pulsando retorno de carro).carro).

• Mediante el método getText es posible consultar el texto Mediante el método getText es posible consultar el texto escrito (con setText puede fijarse desde el programa dicho escrito (con setText puede fijarse desde el programa dicho texto).texto).

JTextAreaJTextArea• Una forma simple de editar/visualizar varias líneas de texto.Una forma simple de editar/visualizar varias líneas de texto.• Con append es posible añadir texto. También existe getText y Con append es posible añadir texto. También existe getText y

setText (JTextField y JTextArea heredan ambos de setText (JTextField y JTextArea heredan ambos de JTextComponent)JTextComponent)..

Page 20: Taller 1 7

Ing. Heber Gómez HurtadoIng. Heber Gómez Hurtado 2020

Jlist - JComboBoxJlist - JComboBox

JListJList• La clase La clase JList JList implementa una lista de elementos que se implementa una lista de elementos que se

presenta en forma de columna.presenta en forma de columna.• En esta lista el usuario puede realizar la selección de En esta lista el usuario puede realizar la selección de

uno (comportamiento por defecto) o varios de sus uno (comportamiento por defecto) o varios de sus elementos.elementos.

• El contenido de una lista viene dado por su modelo de El contenido de una lista viene dado por su modelo de datos que debe implementar la interfaz Java datos que debe implementar la interfaz Java ListModel ListModel

DefaultListModel DefaultListModel clase que da una implementación por clase que da una implementación por defecto del modelo de datos de listadefecto del modelo de datos de lista

JComboBoxJComboBox• Esta clase implementa un cuadro combinado Esta clase implementa un cuadro combinado

desplegable, en el que se agrupan las funcionalidades desplegable, en el que se agrupan las funcionalidades de una lista y un campo de texto.de una lista y un campo de texto.

Page 21: Taller 1 7

Ing. Heber Gómez HurtadoIng. Heber Gómez Hurtado 2121

Administrador de diseño (Administrador de diseño (layout managerlayout manager)) Cómo se colocan los componentes (usando el método Cómo se colocan los componentes (usando el método addadd) )

depende de la composición (depende de la composición (layoutlayout)) Tipos de diseños o composicionesTipos de diseños o composiciones

• FlowLayoutFlowLayout Los componentes se ponen de izquierda a derecha hasta llenar la Los componentes se ponen de izquierda a derecha hasta llenar la

línea, y se pasa a la siguiente. Cada línea se centralínea, y se pasa a la siguiente. Cada línea se centra• Por defecto, en paneles y appletsPor defecto, en paneles y applets

• BorderLayoutBorderLayout Se ponen los componentes en un lateral o en el centroSe ponen los componentes en un lateral o en el centro se indica con una dirección:“East”, “West”, “North”, “South”, se indica con una dirección:“East”, “West”, “North”, “South”,

“Center”“Center”• Por defecto, en marcosPor defecto, en marcos

• GridLayoutGridLayout Se colocan los componentes en una rejilla rectangular (filas x cols)Se colocan los componentes en una rejilla rectangular (filas x cols) Se añaden en orden izquierda-derecha y arriba-abajoSe añaden en orden izquierda-derecha y arriba-abajo

Para poner un layout se utiliza el método Para poner un layout se utiliza el método setLayout(): setLayout(): GridLayout nuevolayout = new GridLayout(3,2);GridLayout nuevolayout = new GridLayout(3,2);

setLayout(nuevolayout);setLayout(nuevolayout);

Page 22: Taller 1 7

Ing. Heber Gómez HurtadoIng. Heber Gómez Hurtado 2222

Otros administradoresOtros administradores GridBagLayoutGridBagLayout

• Similar al GridLayout pero mas versátilSimilar al GridLayout pero mas versátil• Presenta los componentes en una rejilla, pero:Presenta los componentes en una rejilla, pero:

Un componente puede ocupar más de una fila y más de Un componente puede ocupar más de una fila y más de una columnauna columna

Las filas y las columnas pueden tener tamaños diferentesLas filas y las columnas pueden tener tamaños diferentes No se tiene que rellenar en un orden predeterminadoNo se tiene que rellenar en un orden predeterminado

• Utiliza Utiliza GridBagConstraints GridBagConstraints para especificar como deben para especificar como deben colocarse, distribuirse, alinearse, etc., los componentescolocarse, distribuirse, alinearse, etc., los componentes

BoxLayoutBoxLayout• Organiza los componentes en una única fila o columnaOrganiza los componentes en una única fila o columna

Por defecto el espacio libre se deja al finalPor defecto el espacio libre se deja al final• Los elementos pueden tener distinto tamaño y Los elementos pueden tener distinto tamaño y

alineaciónalineación