Post on 23-Jun-2015
Ing. Heber Gómez HurtadoIng. Heber Gómez Hurtado 11
TALLER DE PROGRAMACION ITALLER DE PROGRAMACION I
Tema: SwingTema: Swing
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
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.
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
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
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
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.
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.
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
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);
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]);
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]);
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
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.
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.
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.
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).
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
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)..
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.
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);
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