TEMA 1: Introducción a los sistemas de interacción persona-ordenador

1. CONCEPTOS

• Interfaz: Conexión entre dos aparatos o sistemas independientes. Conexión entre usuario y
computadora, un dispositivo periférico o un enlace de comunicaciones.

• Interfaz de usuario: Intermediario entre Usuario (diseñador pensando en el usuario) y el

Ordenador (diseñar conociendo la arquitectura y las herramientas).

2. PROBLEMÁTICA DE LA IPO

• Se debe presentar la información (forma comprensible y sólo la necesaria), los modos de

manipulación y gestión, y sistemas de ayuda y gestión de errores.

3. EVOLUCIÓN HISTÓRICA

• Papel perforado (40-50): Comunicación a nivel de bits.

• Teletipo (50-60): Caracteres.

• Consola de texto (60-80): Líneas de carácteres y primeros menús.

• Sketchpad (1963): Interfaz con pantalla mediante lápiz óptico. Elemento básico es la línea.

• Engelbart (1970): Primer ratón.

4. EVOLUCIÓN HISTÓRICA - Interfaces de escritorio

Xerox Alto (1973): Primer ordenador con GUI Windows NT 3.5 (1994)
(Graphical User Interface).
o Ratón con 3 botones
o Interfaz gráfica
o Display

Xerox Star (1981): Primer ordenador comercial. MACOS 7.5 (1995)

o Primeros comandos simples
o Iconos de escritorio
o Manipulación directa

Lisa (1983): De Apple. Windows 95 (1995)

o Barras de menús y
desplegables
o Usuario manipula
documentos,no programas.

Macintosh (1984): De Apple. MACOS 8.0 (1997)

o Doble click,arrastrar
ventanas,mover iconos…
 X Windows System (1984): Windows NT 4.0 (1996)
De el MIT
o Color

Windows 1.01 (1985): Primera versión. Windows 98

o No solapamiento de
ventanas con título.
o Área inferior para
iconos

Apple Macintosh II (1987): Windows 2000

o Color.

Windows 2.3 (1987): Windows XP

o Solapamiento de
ventanas.
o Ajuste de tamaño de
ventanas.

Windows 3.0 (1990): Windows Vista

o Program Manager y
window manager para
gestionar ficheros y
programas.

Windows 3.1 (1992) Windows 7

5. EVOLUCIÓN HISTÓRICA - Interfaces web

• Memex (1945): Dispositivo analógico para almacenamiento de grandes cantidades de

información que establece enlaces entre ellos.

• Años (60-80): Surgen diferentes proyectos e ideas de sistemas hipermedia.

• World-Wide Web (1990): Primero era un entorno de texto e imágenes pero evolucionó hasta
integrar video, sonido y animaciones.

6. EVOLUCIÓN HISTÓRICA

• Aparte de los interfaces de escritorio y web han surgido otras formas de interaccionar, como los
sistemas de realidad virtual y realidad aumentada.
TEMA 2: Arquitectura de los sistemas interactivos.
• Sistema interactivo: Es un modelo de comunicaciones que permite la manipulación directa sobre
las interfaces. Se basa en ventanas y eventos (usuario-sistema).

1. SISTEMA DE VENTANAS

• Sistema de ventanas: Permite el uso simultáneo de la pantalla por diferentes aplicaciones.

o Servidor gráfico:Proporciona recursos a las aplicaciones para que

creen sus ventanas interactivas.
o Gestor de ventanas:Permite ubicar las ventanas, desplazarlas…

• Ventana: Área rectangular que puede contener otras ventanas, formando una jerarquía. Permite
dividir el espacio en áreas que pueden recibir eventos.

2. ARQUITECTURA DE LOS SISTEMAS INTERACTIVOS

• Esquema cliente-servidor: El cliente envía peticiones de acceso a los recursos al servidor, éste
las recibe y los gestiona. Los mensajes entre estos son transmitidos por el protocolo de
comunicaciones.

• Programa servidor en un sistema interactivo: Aplicaciones interactivas tienen la necesidad de

gestionar los recursos del ordenador (envían peticiones al servidor). El servidor gestiona los eventos
con una cola general de eventos del sistema.

• Sistema X-Windows: Proporciona una arquitectura cliente-servidor para gestionar gráficos y

aplicaciones gráficas 2D sobre estaciones UNIX.

Además dispone de bibliotecas:

o Xlib: Para desarrollo de gráficos 2D.

o Xview, Xmotif: Para desarrollo de interfaces de ventanas de alto

nivel.

También puede tener:

o Display:Conjunto de recursos gráficos (cursores, mapas de

colores…)

o Servidor X: Proceso que gestiona las órdenes, eventos y peticiones

recibidas para el display local.

• Sistema Windows de Microsoft: Actúa como servidor de recursos para aplicaciones locales. El
proceso de conexión y desconexión del servidor oculto al usuario. La función principal WinMain realiza
estas tareas.
3. EL GESTOR DE VENTANAS

• Servidor gráfico: se encarga de proporcionar los recursos para pintar las ventanas

(componentes).

• Gestor de ventanas: se encarga de la funcionalidad de las ventanas.

• Recoge las acciones hechas por el usuario como maximizar o minimizar la ventana,

aumentar su tamaño…

• Envía un mensaje a la aplicación con el tipo de acción realizada.

• Añade los componentes y las subventanas a la principal (botón de cerrar, maximizar y

minimizar, borde con color, barra de menú y de desplazamiento…).

• Cambia el aspecto de los elementos cuando se redimensiona la ventana.

• Recibe la información sobre las características que tiene la ventana para pintarla.

4. PROGRAMACIÓN ORIENTADA A EVENTOS

• Servidor: Sabe qué ventana está activa en cada momento y recoge las acciones realizadas por el
usuario en cada ventana.

• Tipos de eventos (ENTRADA vs SISTEMA):

Los eventos de entrada son los realizados por el usuario y se distinguen dos:

o Ratón: Movimiento del ratón, clics, dobles clics…

o Teclado: Cada vez que se pulsa o se suelta una tecla. Distingue

las teclas con un código único.

NOTA: El shift, ctrl, alt… se suele enviar como un flag a estos eventos.

Los eventos del sistema se encargan de trabajar con la ventana en cuestión.

o Crear o cerrar ventanas, maximizar o minimizar, redibujar…

• Procesamiento de eventos:

o Bucle de lectura de la cola de eventos:

 o Tablas de eventos. Tablas de eventos:

o Funciones de callback:

o Listeners:

• Oyente del evento (listener):

Es el objeto al que se envía los cambios que ha realizado el evento. (realiza las modificaciones)

Son clases que contienen métodos que indican qué se debe hacer cuando se produce un evento de un
determinado tipo. Detallan qué es lo que se debe hacer cuando se realiza el evento, sin necesidad de
saber cuando se va a realizar (controlador).

• Modelo de delegación de eventos: Es un objeto que trata los eventos que se producen en otro
objeto.
• Despachador de eventos: Se encarga de recoger eventos de la cola y notificar a los oyentes
interesados que se han recibido.

• Registro de oyentes: Para saber quien es el que ha realizado el evento, se debe añadir un registro
en el que se guarde cada componente con los eventos que puede realizar. Sirve para detectar quién
ha producido el evento.

• Esquema de una aplicación interactiva:

→ Se abre la aplicación y conecta al servidor

→ Se reserva memoria

→ Se envían los eventos y las características de la ventana

→ Se muestra la ventana con sus componentes

→ Se lee cada evento que se realiza

→ Se liberan los recursos y se cierra la conexión

→ Finaliza la aplicación
TEMA 3: Conceptos para la programación de interfaces de usuario.
1. CONCEPTOS DE PROGRAMACIÓN ORIENTADA A OBJETOS

• Clase: Es una categoría de objetos con características comunes. class Vehículo{}

• Objeto: Es una instancia de una clase.

o Declarar un objeto ⇨ Circulo mi_circulo;

o Crear un objeto ⇨ mi_circulo = new Circulo();

o Usar métodos ⇨ mi_circulo.dibujar();

• Herencia: class VehículoConMotor extends Vehículo{}

o Una clase hija hereda todo lo que contiene su clase padre.

o La búsqueda de los métodos se hace de forma ascendente(Primero se

ejecutan los métodos de las subclases y por último, los de la
superclase. Si no lo encuentra da error)

o La información contenida en una subclase puede anular información de

una superclase.

o Los elementos privados de una clase sólo son accesibles para los
métodos de esa clase.

-Los elementos private de Vehículo no son directamente

accesibles por los métodos de VehículoConMotor, aunque los hereda y,
por tanto, los posee. Se debe realizar mediante los métodos públicos
previstos para ello incluso desde las clases derivadas
(VehículoConMotor).

• Private: El elemento es únicamente visible desde dentro de la propia clase.

• Protected: Acceso privado pero con permiso de acceso para las clases derivadas.

• Public: El elemento es visible desde cualquier clase.

• Static: Atributo de la clase que comparte todos los objetos de una misma clase.

• Final: Sirve para definir constantes.

public final static int TERROR=0,CIENCIA_FICCION=1,

ACCION=2,SUSPENSE=3,COMEDIA=4;

• Array: Tienes que determinar el tamaño. Para borrar una película en una cierta posición, sería
necesario desplazar a la izquierda todas las películas situadas a la derecha de la borrada.

o EJEMPLO 1:

private static final String[] generos ={"Terror", "Ciencia ficcion ", "Accion"};

o EJEMPLO 2:

private Pelicula[] peliculas;

private static final int MAX=100;

 peliculas = new Pelicula[MAX];

o Añadir elemento:

private int posicionActual=0;

public boolean add(Pelicula p){

if (posicionActual<MAX) {

peliculas [posicionActual]=p;

posicionActual++;

return true;

} else{return false ;}

o Mostrar:

public String toString(){

String resultado="";

for ( int i=0;i<posicionActual;i++)

resultado=resultado+peliculas[i ]. toString()+"\n";

return resultado;

• HashShet: No permite elementos repetidos.

private HashSet <Pelicula> peliculas;

peliculas = new HashSet<Pelicula>();

o Añadir elemento:

public boolean add(Pelicula p){

return peliculas.add(p);

o Mostrar:

public String toString(){

String resultado="";

for(Pelicula p:peliculas)

resultado= resultado+ p.toString()+"\n";

return resultado;
 }

• JOptionPane:

• Polimorfismo: Es la capacidad de adoptar formas distintas. En la POO se entiende como la

capacidad que tiene una jerarquía de clases, relacionadas por la herencia, para responder ante un
mismo mensaje de forma diferente.

• CLASE ABSTRACTA VS. INTERFAZ:

Ambas son clases en las que no se suelen definir objetos y que agrupan métodos abstractos (no
definidos) que otras clases que las hereden podrán interpretar. Es decir, son métodos generales que
otras clases especifican su funcionamiento.

La diferencia está en que una clase abstracta puede tener tanto métodos definidos como métodos
abstractos. En cambio, para que sea una interfaz, debe tener todos los métodos abstractos.

*La clase que hereda de una interfaz deberá heredar todos sus métodos, teniendo que hacerlos
suyos y, en el caso de que no tenga que implementar alguno de ellos, dejarlo vacío.