Programación Orientada a Objetos. Componentes Gráficos

Transcripción

1 Programación Orientada a Objetos Componentes Gráficos César Julio Bustacara Medina Facultad de Ingeniería Pontificia Universidad Javeriana 03/05/2016 1

2 Ejemplo Práctico Programa que permite incrementar un número cada vez que se pulse un botón Inicialmente el cuadro de texto contiene un 0 2

3 Constructoras JFrame() JFrame(String titulo) getcontentpane() getjmenubar() setcontentpane(container contentpane) setdefaultcloseoperation(int operation) setjmenubar(jmenubar menu) setlayout(layoutmanager layout) settitle(string title) setenabled(bool b) 3

4 Ejemplo Práctico 4

5 public class VentanaPrincipal extends JFrame { private JPanel contentpane; private JTextField textfield; private MyActionListener micontrolador; public JTextField gettextfield() { return textfield; } public void settextfield(jtextfield textfield) { this.textfield = textfield; } /** * Launch the application. */ public static void main(string[] args) { EventQueue.invokeLater(new Runnable() { public void run() { try { VentanaPrincipal frame = new VentanaPrincipal(); frame.setvisible(true); } catch (Exception e) { e.printstacktrace(); } } }); } 5

6 /** * Create the frame. */ public VentanaPrincipal() { // crear el controlador micontrolador = new MyActionListener(this); settitle("ejemplo01-gui"); setdefaultcloseoperation(jframe.exit_on_close); setbounds(100, 100, 450, 300); contentpane = new JPanel(); contentpane.setborder(new EmptyBorder(5, 5, 5, 5)); setcontentpane(contentpane); contentpane.setlayout(null); textfield = new JTextField(); textfield.settext("0"); textfield.setbounds(85, 11, 153, 20); contentpane.add(textfield); textfield.setcolumns(10); JButton btnincrementarvalor = new JButton("Incrementar Valor"); btnincrementarvalor.addactionlistener(micontrolador); btnincrementarvalor.setbounds(85, 58, 153, 23); contentpane.add(btnincrementarvalor); } } 6

7 public class MyActionListener implements ActionListener { private VentanaPrincipal ventana; public MyActionListener(VentanaPrincipal ventana){ this.ventana = ventana; public void actionperformed(actionevent e) { // TODO Auto-generated method stub String valor = (ventana.gettextfield()).gettext(); int valfinal = Integer.parseInt(valor); valfinal++; (ventana.gettextfield()).settext(string.valueof(valfinal)); } } 7

8 Ejercicio: Suma y Resta Crear un programa que permita sumar o restar dos números Añadir dos cajas de texto, una para cada número Añadir dos botones, uno para sumar y otro para restar Añadir una etiqueta para mostrar el resultado Cada botón tendrá su propio Listener para escuchar el click 8

9 Ejercicio: Suma y Resta 9

10 Ejercicio 2: : Suma y Resta (2) Extender el ejercicio anterior para que tanto el botón de sumar como el de restar compartan el mismo Listener Para ello, en el método actionperformed se debe comprobar qué botón generó el evento. De acuerdo al botón que fue pulsado, realizar una operación u otra. 10

11 Posicionamiento de los componentes: Layouts Los Layouts permiten distribuir los controles de distintas maneras en un contenedor Cada contenedor puede tener su Layout: Por ejemplo, una ventana puede tener un Layout, contener dos JPanels dispuestos según ese Layout y, luego, cada JPanel podría tener su propio Layout. 11

12 Tipos de Layout 12

13 BorderLayout Los paneles de contenido de los JFrame, por defecto, están inicializados con este tipo de Layout Permite colocar componentes (simples o contenedores) en cinco posiciones: Arriba, Abajo, Izquierda, Derecha y Centro Las posiciones se indican al añadir el componente al contenedor (mediante el método add Arriba: PAGE_START o NORTH Abajo: PAGE_END o SOUTH Izquierda: LINE_START o WEST Derecha: LINE_END o EAST Centro: CENTER 13

14 BorderLayout Funciones importantes del API: BorderLayout(int horizontalgap, int verticalgap) sethgap (int) setvgap (int) // Se crea el layout con gap de 5 píxeles en ambos lados BorderLayout layout = new BorderLayout( 5, 5 ); // Se asocia el layout al Frame actual setlayout( layout ); // Se adiciona el botón al Frame, en la posición Norte JButton button = new JButton( NORTH ); add( button, BorderLayout.NORTH ); 14

15 Ejercicio Crear la interfaz que se observa abajo. Se debe usar BorderLayout para colocar los botones. Al pulsar un botón, ese botón debe ocultarse. El resto de botones ocuparán el espacio disponible automáticamente. Si había otro botón oculto, debe volver a mostrarse (sólo debe haber un botón oculto cada vez) Consejo: usar un array de JButtons y el mismo Listener para todos 15

16 LayoutManager : manejador de disposición y apariencia Define el tamaño y posición de un componente dentro de un contenedor. JFrame, JPanel, JApplet, JDialog lo tienen por defecto (BorderLayout) pero se puede asociar otro. Ejemplos:

17 Componente etiqueta: JLabel

18 JLabel: Etiquetas Se utilizan para mostrar instrucciones de texto ó información que explica el propósito de un componente en una forma. Cada JLabel tiene un nombre que lo identifica de manera única dentro del contenedor

19 Otros métodos del JLabel tooltiptext(): especifica un descriptivo del componente gráfico gettext() : retorna el valor del Jlabel settext(string texto): asigna el valor al JLabel.

20 Componentes cajas de edición: JTextComponent

21 clase JTextComponent Le permite al usuario entrar texto en un componente, cuando dicho componente tiene el foco, esto es, tiene el cursor ubicado sobre él. Algunos JTextComponent (subclases) JTextField JPasswordField JFormattedTextField

22 Clase JTextField Métodos: String gettext(); void settext(string texto);

23 Componentes botones

24 Botón Componente sobre el cual el usuario hace click para ejecutar una acción específica Los botones pueden ser: Botón de comando Caja de chequeo Botón de radio Botón de alternado

25 Botón de Comando Genera un evento cuando el usuario hace click sobre él Se crea usando la clase JButton El método settext() permite cambiar el texto que se ve en el botón

26 26

27 Jerarquías de eventos Cada vez que se produce un evento dicho evento se representa como una instancia de una clase descendiente de AWTEvent. Object EventObject AWTEvent ActionEvent (1) AdjustmentEvent (1) ComponentEvent ItemEvent (1) TextEvent (1) ContainerEvent FocusEvent InputEvent PaintEvent WindowEvent KeyEvent MouseEvent

28 Fuentes de eventos La fuente (source) de un evento es el objeto que lo detecta y lo comunica al objeto receptor (listener). Ejemplos de fuentes y eventos generados Fuente Pulsación sobre un botón Pulsa <Return> sobre un campo de texto Pulsar sobre una opción de menú Cerrar la ventana principal de la aplicación Evento generado ActionEvent WindowEvent Pulsar con el ratón sobre un componente MouseEvent Mover el ratón sobre un componente MouseEvent Un componente se hace visible ComponentEvent

29 Eventos generados por componentes AWT Componente Evento Significado Button ActionEvent Pulsar el ratón sobre un botón Checkbox ItemEvent Seleccionar o deseleccionar un item CheckboxMenuItem Choice ItemEvent ItemEvent Component FocusEvent Obtener o perder el foco ComponentEvent KeyEvent MouseEvent Mover, cambiar tamaño, mostrar u ocultar un componente Pulsar o soltar un tecla Pulsar o soltar un botón del ratón, entrar o salir de un componente, mover o arrastrar el ratón (tenga en cuenta que el evento tiene 2 interfaces oyentes MouseListener y MouseMotionListener) Container ContainerEvent Añadir o eliminar un componente de un contenedor List ActionEvent Hacer doble click sobre un item de la lista ItemEvent Seleccionar o deseleccionar un item de la lista MenuItem ActionEvent Seleccionar un item de un menú Scrollbar AdjustmentEvent Cambiar el valor de la barra de desplazamiento TextComponent TextEvent Cambiar el contenido (texto). TextField ActionEvent Pulsar intro al editar un texto Window WindowEvent Acciones sobre una ventana: abrir, cerrar, iconizar (minimizar), restablecer, cerrar.

30 Eventos generados por componentes Swing Los eventos generados por los componentes Swing son de dos tipos: Una primera clase que engloba los oyentes que todos los componentes Swing pueden soportar: Component Listener: Oyentes para el cambio en el tamaño, posición o visibilidad de un componente. Focus Listener: Oyentes para manejar la perdida o ganancia de foco del teclado. Key Listener: Oyentes para detectar pulsaciones de teclado; los eventos de teclado son activados únicamente por el componente que tiene el foco del teclado. Mouse Listener: Oyentes para clicks del ratón, pulsar un botón del ratón, soltar un botón del ratón, entrar en el área de dibujo del componente, salir de la misma. Mouse-motion Listener: Cambiar la posición del cursor del ratón sobre un componente. Mouse-wheel Listener: Movimiento de la rueda del ratón sobre un componente. Hierarchy Listener: Oyentes para los cambios en la jerarquía de un componente. Hierarchy Bounds Listener: Oyentes para el cambio de posición y de tamaño. Una segunda clase que engloba oyentes específicos para cada tipo de componente.

31 Oyentes específicos Componentes Swing con sus oyentes específicos Componente button check box color chooser combo box dialog editor pane file chooser formatted text field frame internal frame list menu menu item action caret change document, undoable edit Oyente item list selection window other hyperlink internal frame list data menu menu key menu drag mouse

32 Oyentes específicos (2) Componente password field popup menu progress bar radio button slider spinner tabbed pane table text area text field text pane toggle button tree action caret change document, undoable edit Oyente item list selection window other Popup menu table model table column table model, cell editor hyperlink tree expansion tree will expand tree model tree selection

33 Interfaces receptoras Evento Interfaz Listener Métodos de la Interfaz ActionEvent ActionListener actionperformed AdjustmentEvent AdjustmentListener adjustmentvaluechanged ComponentEvent ComponentListener componenthidden, componentmoved, componentresized, componentshown ContainerEvent ContainerListener componentadded,componentremoved FocusEvent FocusListener focusgained, focuslost ItemEvent ItemListener itemstatechanged KeyEvent KeyListener keypressed,keyreleased,keytyped MouseEvent MouseListener mousepressed,mousereleased, mouseentered, mouseexited. MouseMotionListener mousedragged, mousemove TextEvent TextListener textvaluechanged WindowEvent WindowListener windowactivated, windowclosed, windowclosing,windowdeactivated, windowdeiconified, windowiconified, windowopened.

34 Adaptadores Los adaptadores (adapters class) simplifican la programación de las clases receptoras ya que no es necesario implementar todos los métodos de las interfaces listeners. Existe una clase adaptadora (xxxadapter) por cada interface (xxxlistener) que contenga más de un método: MouseAdapter, WindowAdapter, KeyAdapter, MouseMotionAdapter, FocusAdapter, ContainerAdapter y ComponentAdapter, etc. Las clases adaptadoras implementan (mediante código vacío) todos los métodos de la correspondiente interfaz. Las adaptadoras se extienden y se incluyen los métodos de la interfaz que sean de interés.

35 Programación del receptor: alternativas Se pueden utilizar tres estrategias: 1. Crear el receptor como clase interna, donde una clase interna es una clase definida dentro de otra, pudiendo acceder a todos los métodos y atributos de la clase que la contiene. 2. Crear el receptor como una clase independiente. 3. La propia ventana implemente el receptor.

36 Listener usando Adapters Ejemplo de clase para el cierre de la aplicación validando public class MyCloseWindow extends WindowAdapter() { public void windowclosing(windowevent e) { int resp; resp=javax.swing.joptionpane.showconfirmdialog (null, Esta seguro de salir de la aplicación?", "Aviso", javax.swing.joptionpane.ok_cancel_option); if (resp==joptionpane.ok_option) System.exit(0); } } }); } 36