Este documento describe cómo construir interfaces de usuario en Windows Forms y WPF. Explica los diferentes tipos de controles en cada plataforma, incluidos controles de contenido, ítems y disposición. También cubre cómo agregar y eliminar controles dinámicamente y cómo manejar la disposición de controles a través de propiedades como Anchor, Dock, Margin y HorizontalAlignment.

1. Construyendo una
interfaz de usuario
D A N A E A G U I L A R G U Z M Á N .
M C T , M C P , M C T S
D A N A E A G U I L A R @ G M A I L . C O M

2. Contenido del Módulo
1. Controles Windows Forms
2. Controles WPF
3. Manejo de disposición de controles en Windows Forms
4. Manejo de disposición de controles en WPF
5. Propiedades adjuntas

3. 1. Controles de Windows Forms
Jerarquía
de
componen
tes y
controles
Windows
Forms

4. 1. Controles de Windows Forms
Controles Comunes de Windows Forms

5. 1. Controles de Windows Forms
Contenedores Menus y Toolbars Componentes

6. 1. Controles de Windows Forms
Datos Impresión Diálogos
Interoperabilidad con WPF Reportes

7. 1. Controles de Windows Forms
Principales miembros de los controles Windows Forms:
 Name
 Tag
 Controls
 Invoke(), InvokeRequired
 Dispose()

8. 1. Controles de Windows Forms
Agregando y removiendo controles en tiempo de ejecución:
Button unBoton = new Button();
this.Controls.Add(unBoton);
// Remueve el botón a partir de su referencia
this.Controls.Remove(unBoton);
// Remueve el botón por su índice en la colección de controles
this.Controls.RemoveAt(0);
Agregar controles
Remover controles

9. 2. Controles WPFJerarquía de clases
de los controles
WPF

10. 2. Controles WPF
Contenido Ítems Disposición

11. 2. Controles WPF
Decorator Control
Shape
FrameworkElementInteroperabilidad con Win32
TextBoxBase
RangeBase

12. 2. Controles WPF
Clasificación principal:
1. Controles de Contenido
2. Controles de Ítems
3. Controles de Disposición

13. 2. Controles WPF
1. Controles WPF de Contenido

14. 2. Controles WPF
1. Controles WPF de Contenido
 Derivan de la clase ContentControl
 Pueden contener solo 1 control hijo.
 El control hijo puede ser de cualquier tipo.
 Se accede al control hijo con la propiedad Content
 Si el control hijo deriva de UIElement se mostrará en UI, de otro
modo se llamará al método ToString

15. 2. Controles WPF
2. Controles WPF de Ítems

16. 2. Controles WPF
2. Controles WPF de Ítems
 Derivan de la clase ItemsControl
 Pueden contener muchos elementos hijos.
 Los controles hijos pueden ser de cualquier tipo.
 Se accede a los hijos mediante la propiedad Items.

17. 2. Controles WPF
3. Controles de Disposición

18. 2. Controles WPF
3. Controles de Disposición
 Derivan de la clase Panel
 Pueden contener muchos elementos hijos
 Su objetivo es el de organizar la disposición de los controles en el UI
 Se accede a los hijos mediante la propiedad Children

19. 2. Controles WPF
Agregando y removiendo controles en tiempo de ejecución
Button unButton = new Button();
grid1.Children.Add(unButton);
grid1.Children.Remove(unButton);
grid1.Children.RemoveAt(0);
Button unButton = new Button();
listBox1.Items.Add(unButton);
listBox1.Items.Remove(unButton);
listBox1.Items.RemoveAt(0);
Agregar y remover controles de un control de Ítems
Agregar y remover controles de un control de Disposición
Button unButton = new Button();
button1.Content = unButton;
button1.Content = null;
Agregar y remover controles de un control de Contenido

20. 3. Manejo de disposición de controles
en Windows Forms
Posición y
tamaño de
los
controles

21. 3. Manejo de disposición de
controles en Windows Forms
La propiedad Anchor

22. 3. Manejo de disposición de
controles en Windows Forms
La propiedad Dock

23. 4. Manejo de disposición de
controles en WPF
VerticalAlignment y HorizontalAlignment

24. 4. Manejo de disposición de
controles en WPF
Margin y Padding

25. 4. Manejo de disposición de
controles en WPF
Docking

26. 5. Propiedades adjuntas
Permiten a los controles hijos especificar valores para propiedades que
están definidas en controles padres.
Generalmente usado en propiedades de controles de disposición
<DockPanel>
<Label DockPanel.Dock="Top">
Label que usa una propiedad adjunta
</Label>
</DockPanel>