You are on page 1of 73

Cursos de Verano 2002

UNIVERSIDAD DE OVIEDO

Cod. 1728.61
PLATAFORMA .NET Y
SERVICIOS WEB

Diseo de Interfaces y Mens

Ana Beln Martnez Prieto


belen@lsi.uniovi.es

Dpto. de Informtica
OOTLab - Laboratorio de Tecnologas de Orientacin a Objetos
http://www.ootlab.uniovi.es
Contenidos

Introduccin
Aplicaciones con Interfaces
Grficas de Usuario
Controles
Ejemplos

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Contenidos

Introduccin
Conceptos Bsicos
Window Control Form
La clase Control
La clase Form
Aplicaciones con Interfaces Grficas de Usuario
Controles
Ejemplos

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Conceptos Bsicos
Sistema Operativo Windows
No es orientado a objetos
Elemento fundamental: Ventana

Lenguaje Interfaz
C Windows Application Programming Interface
(API)
C++ Microsoft Foundation Class (MFC) Library
C# o C++ Windows Forms (parte del framework .NET)

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Conceptos Bsicos (II)

Framework .net
Coleccin de clases que proporciona la

funcionalidad necesaria para la construccin de
No da soporte multimedia
aplicaciones Web, Internet y Windows.
Windows Forms
Librera de clases que permite la creacin de
aplicaciones Windows tradicionales.
Es independiente de los lenguajes

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Window Control - Form
System .Object Implementa la funcionalidad
Gestiona la generacin y el que es requerida por las
bsica
display de las barras de
... clases que muestran
desplazamiento para permitir al al usuario (teclado,
informacin
usuario tener acceso aratn,
la mensajes de windows)
totalidad de la pantalla
Gestiona la funcionalidad
Control por un control para
requerida
actuar como un contenedor
de otros controles.
Button Base TextBoxBase
Es empleada para crear
.... ScrollableControl
cualquier clase de ventanas:
estndar, cuadros de dilogo,
MDI ContainerControl
Button RichTextBox

CheckBox Panel
TextBox
RadioButton Form UserControl

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
La clase Control

Implementa la funcionalidad bsica para las clases que


muestran informacin al usuario.
Mtodos y propiedades
Color, Position, Size, Controls, CanFocus, Parent, TabStop,...
Funcionalidad aadida
Docking y Anchoring
Gestin de controles hijos
No implementa el paint
Representa la clase base para las clases predefinidas
Es la clase base indirecta para los controles de usuario
(UserControl)

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
La clase Form
Diferentes tipos de ventanas:
Estndar
Dilogos
MDI
Atributos especiales
MaximizeBox y MinimizeBox
DesktopLocation
AcceptButton y CancelButton
ShowDialog()
Eventos
Load
Closed y Closing
Activated
Cursos de Verano 2002 Diseo de Interfaces y Mens
UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
La clase Form. Propiedades
Localizacin y Tamao
DesktopLocation.X<Location.X DesktopLocation.Y<Location.Y
Propiedad Tipo Descripcin
Location Point Relativa a la pantalla
Size Size Tamao completo de la form
Bounds Rectangle Igual a Rectangle (Location,Size)
Width Int Igual a Size.Width
Height Int Igual a Size.Height
Left Int Igual a Location.X
Top Int Igual a Location.Y
Right Int Igual a Location.X+Size.Width
Bottom Int Igual a Location.Y+Size.Height
DesktopLocation Point Igual a Location pero incluye barra tareas
DesktopBounds Rectangle Igual a Bounds pero incluye barra tareas

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
La clase Form. Propiedades (II)

rea Cliente de una Form excluye


Barra de Ttulo
Borde ClientSize
Men
Barra de desplazamiento
ClientSize (Size) proporciona la anchura y
altura en pixels del rea cliente

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
La clase Form. Propiedades (III)

StartPosition.
Asigna la posicin inicial de la ficha en tiempo de
ejecucin
CenterScreen, Manual, CenterParent,...
TopMost.
Indica si la ficha debera ser mostrada como la ficha ms
destacada de la aplicacin
TopLevel.
Indica si la form es considerada como una ventana de
alto nivel (MDI).

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Contenidos
Introduccin
Aplicaciones con Interfaces Grficas de Usuario
Creacin de Ventanas
Construccin de la aplicacin
Requerimientos
Incorporacin de controles a la Ventana
Dilogos
Controles
Ejemplos

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Creacin de Ventanas
Form frm = new Form();
frm.Text = Caption;
frm.Show();
Form
Crear una instancia
Llamar el mtodo
Show (no modal)
ShowDialog (modal)
Usar propiedades y mtodos

Form frm = new Form();


frm.Text = Caption;
frm.FormBorderStyle = FormBorderStyle.FixedDialog;
frm.MinimizeBox = false;
frm.MaximizeBox = false;
frm.ShowDialog();
Cursos de Verano 2002 Diseo de Interfaces y Mens
UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Aplicaciones basadas en IGU

Emplea SYSTEM.WINDOWS.FORMS.DLL
La funcin Main() es el punto de entrada
El mtodo Run de la clase Application abre la form
principal.
Clase Form
public staticdefinida por el usuario para la ventana
void Main()
{
principal
Form frm = new Form();
Redefine
frm .Text = OnPaint
Caption;
frm .FormBorderStyle
Redefine = para
otros eventos FormBorderStyle
el manejo de.FixedDialog
la entrada ;
Frm.MinimizeBox = false;
frm.MaximizeBox = false;
Application.Run(frm);
}
Cursos de Verano 2002 Diseo de Interfaces y Mens
UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Requerimientos de Usuario

Para compilar
Compilador C#
Para ejecutar
Runtime .NET (CLR, Common Language Runtime)

Herramientas

Microsoft .NET Framework SDK


Microsoft Visual C# - C++
Microsoft Visual Studio .NET - C#
-Visual Basic
Cursos de Verano 2002 Diseo de Interfaces y Mens
UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Incorporando controles a la Ventana
1.- Crear la instancia del control
2.- Asignar los atributos al control (Text,
BackColor,...)
3.- Asignar la localizacin y dimensiones del
control
4.- Aadir manejadores de eventos para el control
5.- Aadir el control a la coleccin de controles de
la form.
Private TextBox txt;
TextBox txt = new TextBox();
Txt.Text=Ejemplo;
frm.Controls.Add(txt);
Cursos de Verano 2002 Diseo de Interfaces y Mens
UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Dilogos
Un dilogo es una ventana con una gestin de
mensajes especial.
Un dilogo modal impide las entradas de teclado y
de ratn para todas las ventanas excepto la
ventana del dilogo.
En .NET se emplea el mtodo ShowDialog() para
abrir una form como un dilogo.
Form frm = new Form();
ShowDialog
frm () devuelve
.Text = Caption ; un valor DialogResult que
representa
frm el resultado
.FormBorderStyle .
= FormBorderStyle .FixedDialog;
frm.MinimizeBox = false;
frm.MaximizeBox = false;
frm.ShowDialog();
Cursos de Verano 2002 Diseo de Interfaces y Mens
UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Dilogos (II)
Valores de Retorno
DialogResult nicamente informa de que botn ha cerrado la
form, de forma que se deben leer los valores desde los controles.

DialogResult Descripcin

Abort Devuelve Abort


Cancel Devuelve Cancel
Ignore Devuelve Ignore
No Devuelve No
None No devuelve nada. Significa que an est ejecutndose
OK Devuelve OK
Retry Devuelve Retry
Yes Devuelve Yes

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Dilogos (III)

MessageBox
Este dilogo est encapsulado en OkCancel
la clase
MessageBox y es abierto por su mtodo Show().
YesNoCancel
YesNo...
DialogResult dr = MessagBox.Show(Introduzca valor:
,Ttulo
,MessageBoxButtons.OkCancel
,MessageBoxIcon.Hand)
if (dr==DialogResult.OK)
{
// lo que sea Hand
} Stop
Error
Question
Exclamation
Cursos de Verano 2002 Diseo de Interfaces y Mens
UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Contenidos
Introduccin
Aplicaciones con Interfaces Grficas de Usuario
Controles
Layout
Botones
Controles de Texto (Text Controls)
Controles de Lista (List Controls)
Mens
Barras de Estados y Herramientas
Dilogos Comunes
Otros Controles
Ejemplos
Cursos de Verano 2002 Diseo de Interfaces y Mens
UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Layout
Cambiar la posicin y dimensiones de los
controles en tiempo de ejecucin
Posibilidad: Calcular y mover
.NET: Anchoring y Docking
Anchor
Distancia fijada a los bordes
Dock
Conexin a un borde
Splitter

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Anchoring
Cuando un control es anclado (anchoring)
a una ficha (o a otro contenedor), si la form
es redimensionada, el control mantiene la
distancia entre el control y las posiciones
ancladas.
En definitiva, fija la distancia a los bordes
del contenedor
Propiedad: Anchor. AnchorStyleValues

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Docking
Consiste en acoplar un control con dos bordes
del contenedor, de forma que el control se
redimensiona cuando el contenedor es
redimensionado.

Propiedad: Dock AnchorStyleValues

Un caso especial es DockStyle.Fill. Acopla el


control con todos los bordes. El control llena el
rea cliente del contenedor.

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Splitter
Permite que el usuario redimensione
elementos acoplados (docked) en tiempo de
ejecucin.
Para usar un Splitter
- Acoplar un control contra el borde de un
contenedor
- Acoplar el Splitter contra el mismo borde

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Contenidos
Introduccin
Aplicaciones con Interfaces Grficas de Usuario
Controles
Layout
Botones
Controles de Texto (Text Controls)
Controles de Lista (List Controls)
Mens
Barras de Estados y Herramientas
Dilogos Comunes
Otros Controles
Ejemplos
Cursos de Verano 2002 Diseo de Interfaces y Mens
UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Botones

Button Base

Button

CheckBox

RadioButton

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Botones de comando

La clase Button representa un push button o


botn de comando (tradicional).
Funciones bsicas son implementadas en la
clase control.
Propiedad : DialogResult

Si se asigna esta propiedad a un valor distinto de


DialogResult.None, ShowDialog() devuelve este
valor si se hace click en el botn

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Botones de Chequeo
Soportan on/off para opciones que son no exclusivas
Se aconseja emplear mnemotcnicos en las etiquetas
Capitalizacin de sentencias cuando haya ms de una
palabra. Se aconseja una nica lnea de texto
Si hay un gran nmero de opciones o ste varia
conviene emplear un list box de seleccin mltiple
Emplear la apariencia mixta cuando los valores para
esa propiedad difieren
Posibles usos
Filtrar el contenido de una lista
Cursos de Verano 2002 Diseo de Interfaces y Mens
UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Botones de chequeo
Propiedad : Checked y Appearance
Para que tome un tercer valor (indeterminado):
ThreeState->True
CheckState (examinar el estado)
CheckState Descripcin

Checked CheckBox muestra una marca


Eventos:
Unchecked CheckBox est vacio

Indeterminate CheckBox
CheckedChanged, muestra
cambia eluna marcade
valor peroChecked
sombreada
CheckStatedChanged, cambia el valor de CheckState

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Botones de Opcin o de Radio
Representan una opcin simple dentro de un conjunto
limitado de opciones mutuamente exclusivas
Debe evitar usarse para desencadenar una accin.
2>= nmero opciones<=7
Se aconseja emplear mnemotcnicos en las etiquetas
asociadas a los botones
Capitalizacin de sentencias
Agrupamiento mediante un Group Box
Posibles usos:
Representar un conjunto de opciones para una
propiedad
Cursos de Verano 2002 Diseo de Interfaces y Mens
UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Botones de Radio
Slo admite valores on/off.

Propiedad: Checked.

No hay propiedad ThreeState.

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Etiquetas

Se utilizan para mostrar informacin de slo


lectura (texto o imgenes)
No pueden recibir el foco
Se emplean para proporcionar texto descriptivo
para otros controles. Incluir :
Propiedad: UseMnemonic

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
ToolTips
Ventana pequea que muestra informacin til cuando el
puntero del ratn est sobre un control concreto
Se debe definir un ToolTip para cada ventana (siempre que
existan controles distintos de ToolBar y StatusBar ya que
estos tienen sus propios tooltips).
Propiedades
AutomaticDelay
InitialDelay, tiempo hasta que aparece el tooltip
ReshowDelay
ToolTip tp = new ToolTip();
AutoPopDelay, tiempo que permanece
tp.SetToolTip(button1, Guardarmostrado
);
Tp.SetToolTip(button2,Salir);

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Contenidos
Introduccin
Aplicaciones con Interfaces Grficas de Usuario
Controles
Layout
Botones
Controles de Texto (Text Controls)
Controles de Lista (List Controls)
Mens
Barras de Estados y Herramientas
Dilogos Comunes
Otros Controles
Ejemplos
Cursos de Verano 2002 Diseo de Interfaces y Mens
UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Controles de Texto -Lines
-SelectionStart
-SelectionLength
-SelectedText
TextBoxBase -AcceptsTab
-Modified
-AppendText
-Clear
-ClearUndo
-Select
RichTextBox -SelectAll

TextBox

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
TextBoxBase
Permiten introducir, mostrar o editar un texto. Algunos de
estos text fields combinan campos de introduccin de texto
con otro tipo de controles

Deben emplearse etiquetas para clarificar el campo de


texto. Estas etiquetas seguirn la capitalizacin de
sentencias y permitirn el empleo de teclas de acceso

Cuando en el campo de texto se tenga que introducir un


conjunto restringido de valores hay que validar la entrada
del usuario inmediatamente, ignorando los caracteres
inapropiados o indicando que el valor es invlido
Cursos de Verano 2002 Diseo de Interfaces y Mens
UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
TextBox
Es un control rectangular donde el usuario introduce o edita
texto
Soporta una o varias lneas de texto
Multiline->True
Puede emplearse para mostrar texto de slo lectura que
no es editable pero si seleccionable.
ReadOnly->True
Se puede limitar el nmero de caracteres a introducir
MaxLength->45
Se puede soportar la auto-salida, pero con cuidado porque
puede sorprender al usuario
El formateo afecta a todo el documento
Cursos de Verano 2002 Diseo de Interfaces y Mens
UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
TextBox (II)

Ofrece algunas otras propiedades interesantes:

AcceptReturn. Indica si al presionar ENTER en un TextBox


multilnea se crea una nueva lnea o bien se activa el botn por
defecto de la form.

AcceptTabs. Indica si va a funcionar el TAB dentro del TextBox.

CharacterCasing. Si modifica los caracteres para ponerlos en


maysculas, minsculas,...

PasswordChar. Asigna el carcter usado para enmascarar una


password en un TextBox simple.

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
RichTextBox
Permite al usuario introducir y editar texto proporcionando
caractersticas ms avanzadas para dar formato al
documento que el TextBox.
SelectionFont, SelectionColor, SelectionAlignment, Selection
Indent
OnSelectionChange
El texto puede ser asignado directamente al control o
puede ser cargado desde un fichero de texto o RTF.
El formateo del texto puede aplicarse a un carcter o a un
prrafo.
Propiedades especficas:
AutoWordSelection. Indica si se permite la seleccin
automtica de palabras.
DetectUrls, indica si el RichTextBox formatear
automticamente una URL cuando se teclee dentro del control.
Cursos de Verano 2002 Diseo de Interfaces y Mens
UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Contenidos
Introduccin
Aplicaciones con Interfaces Grficas de Usuario
Controles
Layout
Botones
Controles de Texto (Text Controls)
Controles de Lista (List Controls)
Mens
Barras de Estados y Herramientas
Dilogos Comunes
Otros Controles
Ejemplos
Cursos de Verano 2002 Diseo de Interfaces y Mens
UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Listas
Es un control que muestra una lista de opciones para el
usuario y soporta la seleccin de un tem o varios de la
lista
Apropiado para mostrar un gran nmero de opciones
que varan en nmero y contenido
Si una opcin no est disponible hay que quitarla de la
lista
Ordenar adecuadamente las opciones de la lista

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Listas (II)
No llevan incorporadas sus propias etiquetas
Asociar una etiqueta
permite acceso por teclado al control
con capitalizacin de sentencias
que debe aparecer en estado no disponible si el
listbox est deshabilitado
Se clasifican atendiendo a cmo muestran la lista y a
cmo permiten la seleccin

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Listas Simples
ListBox

Combo Boxes

CheckedListBoxes

OwnerDrawMode

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
ListBox
textBox1.Text=(String)listBox1.Items[listBox1.SelectedIndex];

Representa una lista de Items


Permite seleccin
Simple. SelectedItem (-1 = no hay ninguno seleccionado)
Mltiple
MultiSimple, tems no consecutivos
MultiExtended, rango de tems
Tres colecciones:
Items
SelectedItems
SelectedIndices
Eventos
SelectIndexChanged
SelectValueChanged

3>= nmero de tems visibles<=8

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
ComboBox
ComboBox=ListBox+TextBox
Propiedades y funciones de ambos tipos
Eventos
OnTextChanged -> recorre tems o escribe en el campo de edicin
OnSelectIndexChanged -> recorre los tems
OnSelectionChangeCommitted -> cerrar la lista

DropDownStyle Editable Lista

Simple SI Visible
DropDown SI Plegada
DropDownList NO Plegada

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
CheckedListBoxes

Derivado de un ListBox

Cada tem de la lista es un


CheckBox.

CheckedListBox ofrece
mtodos y propiedades
para trabajar con estos
checkboxes.

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
OwnerDrawMode

Un ListBox puede presentar tambin otros tems


(no texto)
Para ello:
Asignar la propiedad DrawMode
OwnerDrawVariable (tems pueden tener diferentes alturas)
OwnerDrawFixed (tems la misma altura)
Redefinir los mtodos
OnMeasureItem, determina la atura de los tems
OnDrawItem, dibuja un tem.

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Listas Complejas

TreeView

ListView

ImageList

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
ListView
Un ListView puede mostrar datos de cuatro
formas:
List
Small
Icons
Details
Cada tem muestra un ttulo y una imagen.
La clase ListView utiliza la clase ListViewItem para
almacenar los valores de los tems y colecciones:
ListView.ListViewItemCollection
ListView.SelectedIndexCollection
ListView.SelectedListViewItemCollection
ListView.CheckedIndexCollection
ListView.CheckedListViewItemCollection
ListView.ColubmnHeaderCollection
Cursos de Verano 2002 Diseo de Interfaces y Mens
UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
TreeView

Muestra una lista jerrquica de tems o nodos.


Cada nodo incluye
Un ttulo
Una imagen (opcional)
Si tiene sub-nodos se pueden
expandir o esconder (collapse).
Los valores de un TreeView son
almacenados en objetos
TreeNode.

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
ImageList

Es un contenedor para imgenes.


Componente invisible que almacena imgenes
para otros controles
Hay que incorporar las imgenes a la lista y
asignar posteriormente a los tems el ndice de
la imagen que les corresponde.

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Contenidos
Introduccin
Aplicaciones con Interfaces Grficas de Usuario
Controles
Layout
Botones
Controles de Texto (Text Controls)
Controles de Lista (List Controls)
Mens
Barras de Estados y Herramientas
Dilogos Comunes
Otros Controles
Ejemplos
Cursos de Verano 2002 Diseo de Interfaces y Mens
UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Menus

Se constituyen mediante una jerarqua de


clases:
Clase base abstracta Menu
Clase MenuItem para tems simples
Clase MainMenu para los mens principales
Clase ContextMenu para los mens
contextuales

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
MenuItem

La clase MenuItem es la clase ms relevante.


Acta como un elemento de men simple, aunque
puede contener subtems (representados por
MenuItems).
Eventos
Onclick
Popup, permite hacer tareas antes de que el men sea
mostrado.
Select, permite hacer tareas mientras el usuario coloca el
cursor sobre un MenuItem.

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
MenuItem (II)

Valor Descripcin
Checked Aparece
Enabled Indica si est activo
Mnemonic Indica el nemotcnico asociado con este
ShortCut Combinacin de teclas de acceso rpido asociada
ShowShortCut Si muestra o no los ShortCut
RadioCheck Indica si muestra un radio botn en vez de una marca de
chequeo
MdiList Indica si mostrar la lista de las ventanas hijas en el
caso de una aplicacin MDI.

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Menus - ContextMenu
La clase ContexMenu representa los mens que aparecen cuando
el usuario pulsa el botn derecho del ratn sobre un control.
Controles tienen una propiedad ContextMenu a la que se puede
asociar esta clase de mens.
Eventos:
ContextMenuChanged, si la propiedad ContextMenu est asignada
MenuStart, cuando se hace click sobre un elemento de men.
MenuComplete, se genera cuando todos los mens estn cerrados

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Contenidos
Introduccin
Aplicaciones con Interfaces Grficas de Usuario
Controles
Layout
Botones
Controles de Texto (Text Controls)
Controles de Lista (List Controls)
Mens
Barras de Estados y Herramientas
Dilogos Comunes
Otros Controles
Ejemplos
Cursos de Verano 2002 Diseo de Interfaces y Mens
UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Barras de Estados y de Herramientas
Cuando el usuario interacciona con controles que reflejan propiedades
en una barra de herramientas o barra de estados cualquier cambio es
directamente aplicado a la seleccin actual (sin confirmacin), excepto
si el control requiere una entrada adicional del usuario

Los controles que aparecen en una barra de herramientas o de


estados y no llevan etiqueta deben proporcionar tooltips

Las barras de herramientas y de estados deben ser configurables para


dar mayor flexibilidad al usuario
visualizarlas y ocultarlas
ordenar y organizar los elementos

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Barras de Estados

Una barra de estados (StatusBar) puede ser dividida


en partes para mostrar ms de un tipo de informacin.

El framework .NET ofrece el control StatusBar para la


barra de estados y el control StatusBarPanel para los
paneles individuales.
Panels
Size
Alignment
Text
ShowPanels->True

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Barras de Herramientas

2 classes: ToolBar + ToolBarButton


Botones con diferentes estilos
Soporta mens Dropdown
Soporta botones de conmutacin (toggle)
Eventos
ButtonClick + ButtonDropDown

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Barras de Herramientas (II)
Cada botn puede tener su propia apariencia.
Valor Descripcin

DropDownButton Botn que muestra un men u otra ventana al


presionarlo
PushButton Botn tradicional
Separator Separacin entre botones
ToggleButton Botn de conmutacin

Las imgenes son almacenadas en un ImageList


Para asignar un tooltip para un botn:
ShowToolTips -> true
ToolTipText-> escribir el texto
Cursos de Verano 2002 Diseo de Interfaces y Mens
UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Barras de Herramientas (III)

Si el estilo es DropDownButton
Asignar la propiedad DropDownMenu
Asignar la propiedad DropDownArrows
Al hacer click en un botn se genera un evento
ButtonClick pero es un evento de la barra.
El evento ButtonDropDown se produce cuando
se presiona la flecha.

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Contenidos
Introduccin
Aplicaciones con Interfaces Grficas de Usuario
Controles
Layout
Botones
Controles de Texto (Text Controls)
Controles de Lista (List Controls)
Mens
Barras de Estados y Herramientas
Dilogos Comunes
Otros Controles
Ejemplos
Cursos de Verano 2002 Diseo de Interfaces y Mens
UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Dilogos Comunes

Windows ofrece algunos dilogos comunes.


El framework .NET encapsula esta funcionalidad en algunas clases.
En la base est la clase abstracta CommonDialog.

Clase Descripcin

ColorDialog Muestra la lista de colores posibles


FontDialog Muestra la lista de fuentes instalados en el sistema
PageSetupDialog Permite seleccionar mrgenes y orientacin de la pgina
PrintDialog Seleccin de la impresora y la parte del documento a
imprimir
FileDialog Seleccin de un fichero. Base para OpenFileDialog y
SaveFileDialog

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Dilogos Comunes

Se muestran con el mtodo ShowDialog().


OpenFileDialog
Mtodo OpenFile, abre el fichero seleccionado por el
usuario (Lectura)
FontDialog
Genera el evento Apply cuando al presionar el botn
Apply. Se puede utilizar para un preview con la letra
seleccionada.

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Contenidos
Introduccin
Aplicaciones con Interfaces Grficas de Usuario
Controles
Layout
Botones
Controles de Texto (Text Controls)
Controles de Lista (List Controls)
Mens
Barras de Estados y Herramientas
Dilogos Comunes
Otros Controles
Ejemplos
Cursos de Verano 2002 Diseo de Interfaces y Mens
UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Tabcontrols y TabPages

Permite definir mltiples pginas (TabPages)


para una misma ventana o cuadro de dilogo.
Cada pgina contiene un grupo de controles
que la aplicacin muestra cuando el usuario
selecciona la pestaa correspondiente.

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Tabcontrols y TabPages (II)
Las etiquetas del Tab pueden incluir texto,
informacin grfica o ambas
Si lleva texto: capitalizacin de sentencias
Si lleva slo grfico: emplear tooltips
Un control Tab (por defecto) slo muestra una fila
de tabs y aunque permite mltiples filas hay que
evitarlo porque hace ms difcil acceder a un tab
particular.
Se puede colocar el foco sobre un control
particular de la pgina, pero si no hay un control
apropiado se puede dejar en el propio tab
Cursos de Verano 2002 Diseo de Interfaces y Mens
UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Otros Contoles

PictureBox:
Representa un control que permite visualizar una
imagen (bitmap, icon, JPEG, GIF,...)

Timer:
Implementa un temporizador que genera un evento
para intervalos de tiempo definidos por el usuario.
Debe ser empleado en una ventana.

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Otros Contoles (II)

ScrollBar:
Implementa la funcionalidad bsica de una barra de
desplazamiento.
Value
Minimum (0), Maximum(100)
SmallChange(1), LargeChange(10)
TrackBar:
Es similar al ScrollBar pero tiene una interfaz de usuario
diferente.

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Otros Contoles (III)

NumericUpDown:
Representa un control que muestra valores numricos.
Value
Minimum y Maximum
Increment
Eventos: ValueChanged

DomainUpDown:
Igual al anterior pero con Strings

ProgressBar:
Representa una barra de progreso

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Otros Contoles (IV)

LinkLabel:
Control que puede mostrar hiperenlaces

MonthCalendar:
Control que encapsula el calendario por meses de
Windows.

DateTimePicker:
Control que permite seleccionar la fecha y hora

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto
Ejemplos

Cursos de Verano 2002 Diseo de Interfaces y Mens


UNIVERSIDAD DE OVIEDO Ana Beln Martnez Prieto

You might also like