Interfaz de usuario. Diseño y Programación Avanzada de Aplicaciones. Curso

Transcripción

1 Interfaz de usuario Diseño y Programación Avanzada de Aplicaciones Curso

2 Índice

3 Introducción Interfaces gráficos Permiten interaccionar con el programa visualmente. Permiten dar a los programas diferentes formas, tanto de percepción como de interacción con ellos. Se construyen a partir de accesorios de ventana. Son objetos accesibles vía teclado o ratón

4 Introducción Button Label Menu Bar TextBox Scrollbar

5 Introducción Label Un área en la que se pueden desplegar iconos o texto no editable. Textbox Un área en que el usuario puede introducir datos por teclado. El área también puede mostrar información. Button Un área que activa un evento cuando se pulsa sobre él. (Hacer clic).

6 Introducción Checkbox Un control que puede estar seleccionado o no. Combobox Una lista de valores de los que el usuario puede hacer una selección Listbox Una lista de valores de los que el usuario puede hacer una selección. Pueden seleccionarse múltiples elementos.

7 Introducción Panel Un contenedor en el que pueden ponerse varios componentes. Scrollbar Permite acceder al usuario A un rango de valores que normalmente no puede caber en su contenedor.

8 Formularios Windows Tipos Cajas de diálogo Ventanas Ventanas MDI

9 Formularios Windows Componente Clase que implementa el interface. Adolece de partes visuales Control Componente con la parte gráfica.(botón, etiqueta ) Son visibles Eventos Generados por el movimientos del ratón o teclado. Existen unos manejadores del evento escritos por el programador.

10 Formularios Windows

11 Formularios Windows. Propiedades comunes AcceptButton Que botón se activa cuando su pulsa la tecla Enter CancelButton Que botón se activa cuando su pulsa la tecla Escape AutoScroll Si los scrollbars deben aparecer cuando se llena más de una pantalla FormBorderStyle Borde del formulario (por ejemplo, ninguno, sencillo, 3D)

12 Formularios Windows. Propiedades comunes (II) Font Fuente de texto utilizada en el formulario, así como la fuente predefinida de los controles que se han agregado. Text Texto que aparece en la barra del título del formulario.

13 Formularios Windows. Métodos comunes Close Cierra el formulario y libera todos los recursos. Un formulario cerrado no se puede reabrir. Hide Oculta el formulario (no libera recursos). Show Muestra un formulario oculto

14 Formularios Windows. Eventos comunes Load Este evento ocurre cuando se muestra un formulario.

15 Formularios Windows. Componentes Zona del formulario Definición propiedades y eventos

16 Ejemplos Título del formulario Botones y Caja de texto a tamaño 8,5

17 Ejemplos Botones y Caja de texto a tamaño 12

18 Modelo basado en eventos Las GUI son manejadas a través de eventos Los manejadores de eventos son métodos que procesan los eventos y realizan las tareas asociadas a los mismos.

19 Manejo de eventos Eventos que soporta el control seleccionado Evento seleccionado Icono de eventos Manejador del evento seleccionado Descripción del evento

20 Eventos private void button1_click(object sender, System.EventArgs e) { MessageBox.Show( "Has pulsado Aceptar" ); } Solo introducimos el código del evento

21 Propiedades de diseño y control Derivan de la clase Control Propiedad Text Indica el texto que aparece en el control Método Focus Transfiere el foco a un control Permite llegar a ser un control activo

22 Propiedades de diseño y control (II) Propiedad TabIndex Indica el orden en el que se les da el foco a los controles Se fija automáticamente por Visual Studio.NET Propiedad Enable Indica si un control es accesible

23 Propiedades de diseño y control (III) Control de visibilidad Esconde el control al usuario o utiliza el método Hide. 2 Textbox, con valor de enable a true y false

24 Propiedades de diseño y control (IV) private void button1_click(object sender, System.EventArgs e) { textbox2.enabled = true ; } Activamos en control textbox2

25 Propiedades de diseño y control (V) Propiedades de anclaje Fija los controles de forma relativa a una posición Siempre se refiere al contenedor padre

26 Propiedades de diseño y control (V) Dimensionar estructura Permite especificar unos rangos máximo y mínimo de valores Se basan en las propiedades MinimumSize MaximumSize Las dos propiedades permiten fijar los valores de altura y anchura

27 Propiedades de diseño y control. Propiedades comunes BackColor Background color del control. BackgroundImage Background image del control Enabled Indica si el control esta activo, o sea si el usuario puede interaccionar con él. Un control no activo pued estar visible, aunque de forma que se indique que no está activo. Focused Indica si un control tiene el foco (Es el control actualmente usado) Font Font utilizado para visualizar el texto del control.

28 Propiedades de diseño y control. Propiedades comunes (II) ForeColor Este es el color utilizado para mostrar el control de la propiedad del texto. TabIndex Orden de tabulación del control. Cuando la tecla Tab se pulsa el foco se mueve a controles en orden fijado por este valor. Este orden puede ser fijado por el programador. TabStop Si vale cierto el usuario puede utilizar la tecla Tab para seleccionar el control Text Texto asociado con el control. La localización y apariencia depende del control.

29 Propiedades de diseño y control. Propiedades comunes (III) TextAlign Alineación del texto en el control. Tiene tres posiciones horizontales(left, center or right) y tres verticales (top, middle or bottom). Visible Si el control es visible

30 Propiedades de diseño y control. Métodos comunes Focus Transfiere el foco al control Hide Oculta el control (Pone Visible a false) Show Muestra el control (Pone Visible a true).

31 Propiedades de diseño y control (IV) private void button2_click(object sender, System.EventArgs e) { textbox2.hide(); } Ocultamos textbox2

32 Propiedades de diseño y control (IV) private void button3_click(object sender, System.EventArgs e) { textbox2.show(); } Activamos el control textbox2

33 Tamaños Size Tamaño del control (Altura y anchura) MinimumSize y MaximumSize (para formularios Windows) Indican los valores mínimos y máximos del formulario

34 Etiquetas, Cajas de Texto y Botones Labels Texto de sólo lectura Textbox Area de entrada de texto. Permite entradas tipo Password Button Control para ejecutar una acción específica Botones Checkboxes o radio Derivan de la clase ButtonBase

35 Propiedades de Label Font Fuente utilizada por el texto de la etiqueta Text Texto que aparece en la etiqueta TextAlign Alineación del texto. Tiene tres posiciones horizontales (left, center or right) y tres verticales (top, middle or bottom).

36 Propiedades de TextBox AcceptsReturn Si es true, pulsando la tecla Enter crea una nueva línea si la textbox permite múltiples líneas. Si es falso accede a la acción por defecto. Multiline Si es true permite varias líneas. Por defecto es false. PasswordChar Permite entrada tipo passwsord. ReadOnly Campo de solo lectura ScrollBars Indica si aparce la barra de scroll (Solo para cajas de múltiples líneas). Text Texto que se muestra en la caja de texto.

37 Eventos de TextBox TextChanged Se activa cuando cambian los valores en la Textbox. Es el evento por defecto en modo diseño.

38 Propiedades y Eventos de Button Propiedad Text Texto que se muestra en el botón. Evento Click Acción a realizar cuando se pulsa el botón.

39 GroupBoxes y Panels Ordena los componentes en GUI GroupBoxes pueden visaulizar una captura Propiedad Text determina esta captura. Panels pueden tener scrollbar

40 Propiedades de los GroupBoxes Text Texto que se visualiza en la parte superior del GroupBox Controls Controles que contiene el GroupBox

41 Propiedades de los Panel AutoScroll Si aparece el scrollbar.(por defecto false) BorderStyle Borde del panel (default Ninguno, otras opciones Fixed3D y FixedSingle). Controls Controles que contiene el Panel.

42 Checkboxes y RadioButtons Botones de estado On/off o true/false Derivan de la clase ButtonBase CheckBox No tienen restricción sobre el uso RadioButton Solo uno puede ser true Mutuamente exclusivos

43 Propiedades de los Checkboxes Checked Si el botón CheckBox ha sido checked. CheckState Whether the Checkbox is checked (contains a black checkmark) or unchecked (blank). An enumeration with values Checked, Unchecked or Indeterminate. Text Texto que se visualiza a la derecha del CheckBox (etiqueta).

44 Eventos de los Checkboxes CheckedChanged Ocurre cuando se modifica. Evento por defecto. CheckStateChanged Ocurre cuando cambia la propiedad CheckState cambia.

45 Propiedades de los RadioButtons Checked Si el RadioButton está pulsado. Text Texto que se visualiza a la derecha del RadioButton (etiqueta).

46 Eventos de los RadioButtons Click Ocurre cuando se pulsa el click CheckedChanged Ocurre cuando el RadioButton es checked o unchecked. Evento por defecto. La diferencia entre ambos es, el segundo se activa cuando se pulsa cualquiera de los RadioButtons asociados, el primero solo cuando se pulsa sobre el RadioButton del evento

47 Eventos del ratón Class MouseEventArgs Contiene las coordenadas del puntero del ratón El ratón se pulsa Número de clicks Giro de la rueda del ratón Evento del paso del ratón

48 Eventos del ratón (II) MouseEnter Se alcanza si el ratón entra en el área de control. MouseLeave Se alcanza si el ratón deja el área de control. MouseDown Se alcanza si el ratón es pulsado cuando el cursor está en el área de control MouseHover Se alcanza si el ronda sobre el área de control MouseMove Se alcanza si el ratón se mueve mientras está en el area de control MouseUp Se alcanza mientra e ratón es liberado cuando está en el área de control.

49 Propiedades de los eventos del ratón (III) Button Que botón del ratón se ha pulsado (left, right, middle or none). Clicks X Y El número de veces que el botón del ratón ha sido pulsado. La coordenada X del evento. La coordenada y del evento

50 Manejo de eventos del teclado KeyDown Se alcanza cuando la tecla es inicialmente pulsada. KeyUp Se alacanza cuando la tecla es liberadaraised when key is released. KeyPress Ocurre cuando la tecla es pulsada, ocurre repetidas veces mientras esta siendo pulsada según un ratio definido por el sistema operativo.

51 Propiedades de los eventos del teclado KeyChar Alt Devuelve el caracter ASCII de la tecla pulsada. Indica si la tecla Alt fue pulsada. Control Indica si la tecla Control fue pulsada. Shift Indica si la tecla Shift fue pulsada. Handled Indica si el evento ha sido

52 Propiedades de los eventos del teclado (II) KeyData Devuelve el código de la tecla pulsada. KeyValue Devuelve el código de la tecla como un entero.