Compartir a través de


Guía paso a paso: Hospedaje de un control compuesto de WPF en Windows Forms

Windows Presentation Foundation (WPF) proporciona un entorno enriquecido para crear aplicaciones. Sin embargo, cuando tiene una inversión sustancial en el código de Windows Forms, puede ser más eficaz ampliar la aplicación de Windows Forms existente con WPF en lugar de volver a escribirla desde cero. Un escenario común es cuando quiere insertar uno o varios controles implementados con WPF dentro de la aplicación de Windows Forms. Para obtener más información sobre cómo personalizar controles WPF, vea Personalización de controles.

Este tutorial le guiará a través de una aplicación que hospeda un control compuesto de WPF para realizar la entrada de datos en una aplicación de Windows Forms. El control compuesto se empaqueta en un archivo DLL. Este procedimiento general se puede extender a aplicaciones y controles más complejos. Este tutorial está diseñado para ser casi idéntico en apariencia y funcionalidad para Walkthrough: Hospedaje de un control compuesto de Windows Forms en WPF. La principal diferencia es que se invierte el escenario de hospedaje.

El tutorial se divide en dos secciones. En la primera sección se describe brevemente la implementación del control compuesto de WPF. En la segunda sección se describe detalladamente cómo hospedar el control compuesto en una aplicación de Windows Forms, recibir eventos del control y acceder a algunas de las propiedades del control.

Las tareas que se muestran en este tutorial incluyen:

  • Implementación del control compuesto de WPF.

  • Implementación de la aplicación host de Windows Forms.

Para obtener una lista de código completa de las tareas que se muestran en este tutorial, vea Hospedaje de un control compuesto de WPF en el ejemplo de Windows Forms.

Prerrequisitos

Necesita Visual Studio para completar este tutorial.

Implementación del control compuesto de WPF

El control compuesto de WPF usado en este ejemplo es un formulario simple de entrada de datos que toma el nombre y la dirección del usuario. Cuando el usuario hace clic en uno de los dos botones para indicar que la tarea ha finalizado, el control genera un evento personalizado para devolver esa información al host. En la ilustración siguiente se muestra el control representado.

En la imagen siguiente se muestra un control compuesto de WPF:

Captura de pantalla que muestra un control WPF simple.

Creación del proyecto

Para iniciar el proyecto:

  1. Inicie Visual Studio y abra el cuadro de diálogo Nuevo proyecto .

  2. En Visual C# y la categoría de Windows, seleccione la plantilla Biblioteca de control de usuarios de WPF .

  3. Asigne al nuevo proyecto MyControlsel nombre .

  4. Para la ubicación, especifique una carpeta de nivel superior denominada convenientemente, como WindowsFormsHostingWpfControl. Más adelante, colocará la aplicación host en esta carpeta.

  5. Haga clic en Aceptar para crear el proyecto. El proyecto predeterminado contiene un único control denominado UserControl1.

  6. En el Explorador de soluciones, cambie el nombre UserControl1 a MyControl1.

El proyecto debe tener referencias a los siguientes archivos DLL del sistema. Si alguno de estos archivos DLL no se incluye de forma predeterminada, agréguelos al proyecto.

  • PresentationCore

  • PresentationFramework

  • Sistema

  • WindowsBase

Creación de la interfaz de usuario

La interfaz de usuario (UI) del control compuesto se implementa con lenguaje de marcado extensible de aplicaciones (XAML). La interfaz de usuario del control compuesto consta de cinco TextBox elementos. Cada TextBox elemento tiene un elemento asociado TextBlock que actúa como etiqueta. Hay dos Button elementos en la parte inferior, Ok y Cancel. Cuando el usuario hace clic en cualquiera de los botones, el control genera un evento personalizado para devolver la información al host.

Diseño básico

Los distintos elementos de la interfaz de usuario se encuentran en un Grid elemento . Puede usar Grid para organizar el contenido del control compuesto de la misma manera que usaría un Table elemento en HTML. WPF también tiene un Table elemento, pero Grid es más ligero y más adecuado para tareas de diseño simples.

En el código XAML siguiente se muestra el diseño básico. Este XAML define la estructura general del control especificando el número de columnas y filas del Grid elemento.

En MyControl1.xaml, reemplace el XAML existente por el siguiente XAML.

<Grid xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      x:Class="MyControls.MyControl1"
      Background="#DCDCDC"
      Width="375"
      Height="250"
      Name="rootElement"
      Loaded="Init">

  <Grid.ColumnDefinitions>
    <ColumnDefinition Width="Auto" />
    <ColumnDefinition Width="Auto" />
    <ColumnDefinition Width="Auto"/>
    <ColumnDefinition Width="Auto"/>
  </Grid.ColumnDefinitions>

  <Grid.RowDefinitions>
    <RowDefinition Height="Auto" />
    <RowDefinition Height="Auto" />
    <RowDefinition Height="Auto" />
    <RowDefinition Height="Auto" />
    <RowDefinition Height="Auto" />
    <RowDefinition Height="Auto" />
  </Grid.RowDefinitions>
</Grid>

Agregar elementos TextBlock y TextBox a la cuadrícula

Para colocar un elemento de interfaz de usuario en la cuadrícula, establezca los atributos RowProperty y ColumnProperty del elemento en el número de fila y columna adecuados. Recuerde que la numeración de filas y columnas se basa en cero. Para que un elemento abarque varias columnas, establezca su ColumnSpanProperty atributo. Para obtener más información sobre Grid los elementos, vea Crear un elemento Grid.

En el siguiente XAML se muestran los elementos TextBox y TextBlock del control compuesto con sus atributos RowProperty y ColumnProperty, que están configurados para colocar correctamente los elementos en la cuadrícula.

En MyControl1.xaml, agregue el siguiente XAML dentro del Grid elemento .

  <TextBlock Grid.Column="0"
        Grid.Row="0" 
        Grid.ColumnSpan="4"
        Margin="10,5,10,0"
        HorizontalAlignment="Center"
        Style="{StaticResource titleText}">Simple WPF Control</TextBlock>

  <TextBlock Grid.Column="0"
        Grid.Row="1"
        Style="{StaticResource inlineText}"
        Name="nameLabel">Name</TextBlock>
  <TextBox Grid.Column="1"
        Grid.Row="1"
        Grid.ColumnSpan="3"
        Name="txtName"/>

  <TextBlock Grid.Column="0"
        Grid.Row="2"
        Style="{StaticResource inlineText}"
        Name="addressLabel">Street Address</TextBlock>
  <TextBox Grid.Column="1"
        Grid.Row="2"
        Grid.ColumnSpan="3"
        Name="txtAddress"/>

  <TextBlock Grid.Column="0"
        Grid.Row="3"
        Style="{StaticResource inlineText}"
        Name="cityLabel">City</TextBlock>
  <TextBox Grid.Column="1"
        Grid.Row="3"
        Width="100"
        Name="txtCity"/>

  <TextBlock Grid.Column="2"
        Grid.Row="3"
        Style="{StaticResource inlineText}"
        Name="stateLabel">State</TextBlock>
  <TextBox Grid.Column="3"
        Grid.Row="3"
        Width="50"
        Name="txtState"/>

  <TextBlock Grid.Column="0"
        Grid.Row="4"
        Style="{StaticResource inlineText}"
        Name="zipLabel">Zip</TextBlock>
  <TextBox Grid.Column="1"
        Grid.Row="4"
        Width="100"
        Name="txtZip"/>

Aplicar estilos a los elementos de la interfaz de usuario

Muchos de los elementos del formulario de entrada de datos tienen una apariencia similar, lo que significa que tienen una configuración idéntica para varias de sus propiedades. En lugar de establecer los atributos de cada elemento por separado, el XAML anterior usa Style elementos para definir la configuración de propiedades estándar para las clases de elementos. Este enfoque reduce la complejidad del control y le permite cambiar la apariencia de varios elementos a través de un único atributo de estilo.

Los Style elementos están contenidos en la Grid propiedad del Resources elemento, por lo que todos los elementos del control pueden usarlos. Si un estilo tiene nombre, se aplica a un elemento agregando un elemento Style con el nombre del estilo. Los estilos que no tienen nombre se convierten en el estilo predeterminado del elemento. Para obtener más información sobre los estilos de WPF, vea Aplicar estilos y plantillas.

En el código XAML siguiente se muestran los Style elementos del control compuesto. Para ver cómo se aplican los estilos a los elementos, consulta el CÓDIGO XAML anterior. Por ejemplo, el último TextBlock elemento tiene el inlineText estilo y el último TextBox elemento usa el estilo predeterminado.

En MyControl1.xaml, agregue el código XAML siguiente justo después del Grid elemento start.

<Grid.Resources>
  <Style x:Key="inlineText" TargetType="{x:Type TextBlock}">
    <Setter Property="Margin" Value="10,5,10,0"/>
    <Setter Property="FontWeight" Value="Normal"/>
    <Setter Property="FontSize" Value="12"/>
  </Style>
  <Style x:Key="titleText" TargetType="{x:Type TextBlock}">
    <Setter Property="DockPanel.Dock" Value="Top"/>
    <Setter Property="FontWeight" Value="Bold"/>
    <Setter Property="FontSize" Value="14"/>
    <Setter Property="Margin" Value="10,5,10,0"/>
  </Style>
  <Style TargetType="{x:Type Button}">
    <Setter Property="Margin" Value="10,5,10,0"/>
    <Setter Property="Width" Value="60"/>
  </Style>
  <Style TargetType="{x:Type TextBox}">
    <Setter Property="Margin" Value="10,5,10,0"/>
  </Style>
</Grid.Resources>

Agregar los botones Aceptar y Cancelar

Los elementos finales del control compuesto son los elementos Ok y CancelButton , que ocupan las dos primeras columnas de la última fila de Grid. Estos elementos usan un controlador de eventos común, ButtonClickedy el estilo predeterminado Button definido en el XAML anterior.

En MyControl1.xaml, agregue el código XAML siguiente después del último TextBox elemento. La parte XAML del control compuesto ahora está completa.

<Button Grid.Row="5"
        Grid.Column="0"
        Name="btnOK"
        Click="ButtonClicked">OK</Button>
<Button Grid.Row="5"
        Grid.Column="1"
        Name="btnCancel"
        Click="ButtonClicked">Cancel</Button>

Implementación del archivo Code-Behind

El archivo de código subyacente, MyControl1.xaml.cs, implementa tres tareas esenciales:

  1. Controla el evento que se produce cuando el usuario hace clic en uno de los botones.

  2. Recupera los datos de los TextBox elementos y los empaqueta en un objeto de argumento de evento personalizado.

  3. Genera el evento personalizado OnButtonClick , que notifica al host que el usuario ha terminado y pasa los datos al host.

El control también expone una serie de propiedades de color y fuente que permiten cambiar la apariencia. A diferencia de la WindowsFormsHost clase , que se usa para hospedar un control de Windows Forms, la ElementHost clase expone solo la propiedad del Background control. Para mantener la similitud entre este ejemplo de código y el ejemplo descrito en Tutorial: Hospedar un control compuesto de Formularios Windows Forms en WPF, el control expone las propiedades restantes directamente.

Estructura básica del archivo de Code-Behind

El archivo de código subyacente consta de un único espacio de nombres, MyControls, que contendrá dos clases, MyControl1 y MyControlEventArgs.

namespace MyControls
{
  public partial class MyControl1 : Grid
  {
    //...
  }
  public class MyControlEventArgs : EventArgs
  {
    //...
  }
}

La primera clase, MyControl1, es una clase parcial que contiene el código que implementa la funcionalidad de la interfaz de usuario definida en MyControl1.xaml. Cuando se analiza MyControl1.xaml, el XAML se convierte en la misma clase parcial y las dos clases parciales se combinan para formar el control compilado. Por este motivo, el nombre de clase del archivo de código subyacente debe coincidir con el nombre de clase asignado a MyControl1.xaml y debe heredar del elemento raíz del control. La segunda clase, MyControlEventArgs, es una clase de argumentos de evento que se usa para devolver los datos al host.

Abra MyControl1.xaml.cs. Cambie la declaración de clase existente para que tenga el nombre siguiente y herede de Grid.

public partial class MyControl1 : Grid

Inicialización del control

El código siguiente implementa varias tareas básicas:

  • Declara un evento privado, OnButtonClick, y su delegado asociado, MyControlEventHandler.

  • Crea varias variables globales privadas que almacenan los datos del usuario. Estos datos se exponen a través de las propiedades correspondientes.

  • Implementa un controlador, Init, para el evento de Loaded del control. Este controlador inicializa las variables globales asignando los valores definidos en MyControl1.xaml. Para ello, usa el Name asignado a un elemento típico TextBlock , nameLabel, para tener acceso a la configuración de propiedad de ese elemento.

Elimine el constructor existente y agregue el código siguiente a la MyControl1 clase .

public delegate void MyControlEventHandler(object sender, MyControlEventArgs args);
public event MyControlEventHandler OnButtonClick;
private FontWeight _fontWeight;
private double _fontSize;
private FontFamily _fontFamily;
private FontStyle _fontStyle;
private SolidColorBrush _foreground;
private SolidColorBrush _background;

private void Init(object sender, EventArgs e)
{
    //They all have the same style, so use nameLabel to set initial values.
    _fontWeight = nameLabel.FontWeight;
    _fontSize = nameLabel.FontSize;
    _fontFamily = nameLabel.FontFamily;
    _fontStyle = nameLabel.FontStyle;
    _foreground = (SolidColorBrush)nameLabel.Foreground;
    _background = (SolidColorBrush)rootElement.Background;
}

Controlar los eventos de clic de los botones

El usuario indica que la tarea de entrada de datos ha finalizado haciendo clic en el botón Aceptar o en el botón Cancelar . Ambos botones usan el mismo Click controlador de eventos, ButtonClicked. Ambos botones tienen un nombre, btnOK o btnCancel, que permite al controlador determinar en qué botón se hizo clic examinando el argumento sender. El controlador hace lo siguiente:

  • Crea un MyControlEventArgs objeto que contiene los datos de los TextBox elementos .

  • Si el usuario hace clic en el botón Cancelar , establece la MyControlEventArgs propiedad del IsOK objeto en false.

  • Genera el OnButtonClick evento para indicar al host que el usuario ha finalizado y pasa los datos recopilados.

Agregue el código siguiente a la MyControl1 clase después del Init método .

private void ButtonClicked(object sender, RoutedEventArgs e)
{
    MyControlEventArgs retvals = new MyControlEventArgs(true,
                                                        txtName.Text,
                                                        txtAddress.Text,
                                                        txtCity.Text,
                                                        txtState.Text,
                                                        txtZip.Text);
    if (sender == btnCancel)
    {
        retvals.IsOK = false;
    }
    if (OnButtonClick != null)
        OnButtonClick(this, retvals);
}

Crear propiedades

El resto de la clase simplemente expone las propiedades que corresponden a las variables globales descritas anteriormente. Cuando cambia una propiedad, el descriptor de acceso set modifica la apariencia del control cambiando las propiedades de elemento correspondientes y actualizando las variables globales subyacentes.

Agregue el código siguiente a la MyControl1 clase .

public FontWeight MyControl_FontWeight
{
    get { return _fontWeight; }
    set
    {
        _fontWeight = value;
        nameLabel.FontWeight = value;
        addressLabel.FontWeight = value;
        cityLabel.FontWeight = value;
        stateLabel.FontWeight = value;
        zipLabel.FontWeight = value;
    }
}
public double MyControl_FontSize
{
    get { return _fontSize; }
    set
    {
        _fontSize = value;
        nameLabel.FontSize = value;
        addressLabel.FontSize = value;
        cityLabel.FontSize = value;
        stateLabel.FontSize = value;
        zipLabel.FontSize = value;
    }
}
public FontStyle MyControl_FontStyle
{
    get { return _fontStyle; }
    set
    {
        _fontStyle = value;
        nameLabel.FontStyle = value;
        addressLabel.FontStyle = value;
        cityLabel.FontStyle = value;
        stateLabel.FontStyle = value;
        zipLabel.FontStyle = value;
    }
}
public FontFamily MyControl_FontFamily
{
    get { return _fontFamily; }
    set
    {
        _fontFamily = value;
        nameLabel.FontFamily = value;
        addressLabel.FontFamily = value;
        cityLabel.FontFamily = value;
        stateLabel.FontFamily = value;
        zipLabel.FontFamily = value;
    }
}

public SolidColorBrush MyControl_Background
{
    get { return _background; }
    set
    {
        _background = value;
        rootElement.Background = value;
    }
}
public SolidColorBrush MyControl_Foreground
{
    get { return _foreground; }
    set
    {
        _foreground = value;
        nameLabel.Foreground = value;
        addressLabel.Foreground = value;
        cityLabel.Foreground = value;
        stateLabel.Foreground = value;
        zipLabel.Foreground = value;
    }
}

Envío de los datos al host

El componente final del archivo es la MyControlEventArgs clase , que se usa para devolver los datos recopilados al host.

Agregue el siguiente código al espacio de nombres MyControls. La implementación es sencilla y no se analiza aún más.

public class MyControlEventArgs : EventArgs
{
    private string _Name;
    private string _StreetAddress;
    private string _City;
    private string _State;
    private string _Zip;
    private bool _IsOK;

    public MyControlEventArgs(bool result,
                              string name,
                              string address,
                              string city,
                              string state,
                              string zip)
    {
        _IsOK = result;
        _Name = name;
        _StreetAddress = address;
        _City = city;
        _State = state;
        _Zip = zip;
    }

    public string MyName
    {
        get { return _Name; }
        set { _Name = value; }
    }
    public string MyStreetAddress
    {
        get { return _StreetAddress; }
        set { _StreetAddress = value; }
    }
    public string MyCity
    {
        get { return _City; }
        set { _City = value; }
    }
    public string MyState
    {
        get { return _State; }
        set { _State = value; }
    }
    public string MyZip
    {
        get { return _Zip; }
        set { _Zip = value; }
    }
    public bool IsOK
    {
        get { return _IsOK; }
        set { _IsOK = value; }
    }
}

Compile la solución. La compilación generará un archivo DLL denominado MyControls.dll.

Implementación de la aplicación host de Windows Forms

La aplicación host de Windows Forms usa un ElementHost objeto para hospedar el control compuesto de WPF. La aplicación controla el OnButtonClick evento para recibir los datos del control compuesto. La aplicación también tiene un conjunto de botones de opción que puede usar para modificar la apariencia del control. En la ilustración siguiente se muestra la aplicación.

En la imagen siguiente se muestra un control compuesto de WPF hospedado en una aplicación de Windows Forms.

Captura de pantalla que muestra un control Avalon de hospedaje de Formularios Windows Forms.

Creación del proyecto

Para iniciar el proyecto:

  1. Inicie Visual Studio y abra el cuadro de diálogo Nuevo proyecto .

  2. En Visual C# y la categoría de Windows, seleccione la plantilla Aplicación de Windows Forms .

  3. Asigne al nuevo proyecto WFHostel nombre .

  4. Para la ubicación, especifique la misma carpeta de nivel superior que contiene el proyecto MyControls.

  5. Haga clic en Aceptar para crear el proyecto.

También debe agregar referencias a la biblioteca DLL que contiene MyControl1 y a otros ensamblados.

  1. Haga clic con el botón derecho en el nombre del proyecto en el Explorador de soluciones y seleccione Agregar referencia.

  2. Haga clic en la pestaña Examinar y vaya a la carpeta que contiene MyControls.dll. Para este tutorial, esta carpeta es MyControls\bin\Debug.

  3. Seleccione MyControls.dlly haga clic en Aceptar.

  4. Agregue referencias a los ensamblados siguientes.

    • PresentationCore

    • PresentationFramework

    • System.Xaml

    • WindowsBase

    • WindowsFormsIntegration

Implementación de la interfaz de usuario para la aplicación

La interfaz de usuario de la aplicación windows Forms contiene varios controles para interactuar con el control compuesto de WPF.

  1. Abra Form1 en el Diseñador de Windows Forms.

  2. Amplíe el formulario para acomodar los controles.

  3. En la esquina superior derecha del formulario, agregue un System.Windows.Forms.Panel control para sostener el control compuesto de WPF.

  4. Agregue los siguientes System.Windows.Forms.GroupBox controles al formulario.

    Nombre Mensaje de texto
    groupBox1 Color de fondo
    groupBox2 Color de primer plano
    groupBox3 Tamaño de fuente
    groupBox4 Familia de fuentes
    groupBox5 Estilo de fuente
    groupBox6 Peso de fuente
    groupBox7 Datos de control
  5. Agregue los siguientes System.Windows.Forms.RadioButton controles a los System.Windows.Forms.GroupBox controles.

    GroupBox Nombre Mensaje de texto
    groupBox1 radioBackgroundOriginal Texto original en inglés
    groupBox1 fondo de radio verde claro Verde Claro
    groupBox1 radioBackgroundLightSalmon LightSalmon
    groupBox2 radioForegroundOriginal Texto original en inglés
    groupBox2 radioForegroundRed Rojo
    groupBox2 radioForegroundYellow Amarillo
    groupBox3 radioSizeOriginal Texto original en inglés
    groupBox3 radioSizeTen 10
    groupBox3 radioSizeTwelve 12
    groupBox4 radioFamilyOriginal Texto original en inglés
    groupBox4 radioFamilyTimes Times New Roman
    groupBox4 radioFamilyWingDings WingDings
    groupBox5 radioStyleOriginal Normal
    groupBox5 radioStyleItalic Itálico
    groupBox6 radioWeightOriginal Texto original en inglés
    groupBox6 radioWeightBold Audaz
  6. Agregue los controles siguientes System.Windows.Forms.Label al último System.Windows.Forms.GroupBox. Estos controles muestran los datos devueltos por el control compuesto de WPF.

    GroupBox Nombre Mensaje de texto
    groupBox7 lblNombre Nombre:
    groupBox7 lblAddress Dirección postal:
    groupBox7 lblCity Ciudad:
    groupBox7 lblState Estado:
    groupBox7 lblZip Cremallera:

Inicialización del formulario

Por lo general, se implementa el código de hospedaje en el controlador de eventos del Load formulario. El código siguiente muestra el Load controlador de eventos, un controlador para el evento del Loaded control compuesto de WPF y declaraciones para varias variables globales que se usan más adelante.

En el Diseñador de Windows Forms, haga doble clic en el formulario para crear un Load controlador de eventos. En la parte superior de Form1.cs, agregue las siguientes using declaraciones.

using System.Windows;
using System.Windows.Forms.Integration;
using System.Windows.Media;

Reemplace el contenido de la clase existente Form1 por el código siguiente.

private ElementHost ctrlHost;
private MyControls.MyControl1 wpfAddressCtrl;
System.Windows.FontWeight initFontWeight;
double initFontSize;
System.Windows.FontStyle initFontStyle;
System.Windows.Media.SolidColorBrush initBackBrush;
System.Windows.Media.SolidColorBrush initForeBrush;
System.Windows.Media.FontFamily initFontFamily;

public Form1()
{
    InitializeComponent();
}

private void Form1_Load(object sender, EventArgs e)
{
    ctrlHost = new ElementHost();
    ctrlHost.Dock = DockStyle.Fill;
    panel1.Controls.Add(ctrlHost);
    wpfAddressCtrl = new MyControls.MyControl1();
    wpfAddressCtrl.InitializeComponent();
    ctrlHost.Child = wpfAddressCtrl;

    wpfAddressCtrl.OnButtonClick +=
        new MyControls.MyControl1.MyControlEventHandler(
        avAddressCtrl_OnButtonClick);
    wpfAddressCtrl.Loaded += new RoutedEventHandler(
        avAddressCtrl_Loaded);
}

void avAddressCtrl_Loaded(object sender, EventArgs e)
{
    initBackBrush = (SolidColorBrush)wpfAddressCtrl.MyControl_Background;
    initForeBrush = wpfAddressCtrl.MyControl_Foreground;
    initFontFamily = wpfAddressCtrl.MyControl_FontFamily;
    initFontSize = wpfAddressCtrl.MyControl_FontSize;
    initFontWeight = wpfAddressCtrl.MyControl_FontWeight;
    initFontStyle = wpfAddressCtrl.MyControl_FontStyle;
}

El Form1_Load método del código anterior muestra el procedimiento general para hospedar un control WPF:

  1. Cree un nuevo objeto ElementHost.

  2. Establezca la propiedad del Dock control en DockStyle.Fill.

  3. Agregue el control ElementHost a la colección Controls del control Panel.

  4. Cree una instancia del control WPF.

  5. Hospede el control compuesto en el formulario asignando el control a la ElementHost propiedad del Child control.

Las dos líneas restantes del Form1_Load método adjuntan controladores a dos eventos de control:

  • OnButtonClick es un evento personalizado que desencadena el control compuesto cuando el usuario hace clic en el botón Aceptar o Cancelar . Controla el evento para obtener la respuesta del usuario y recopilar los datos especificados por el usuario.

  • Loaded es un evento estándar que es generado por un control WPF cuando se carga por completo. El evento se usa aquí porque el ejemplo debe inicializar varias variables globales mediante propiedades del control . En el momento del evento del Load formulario, el control no se carga completamente y esos valores siguen estando establecidos en null. Debe esperar a que ocurra el evento del control Loaded antes de poder acceder a esas propiedades.

El Loaded controlador de eventos se muestra en el código anterior. El OnButtonClick controlador se describe en la sección siguiente.

Manejar OnButtonClick

El OnButtonClick evento se produce cuando el usuario hace clic en el botón Aceptar o Cancelar .

El controlador de eventos comprueba el campo del argumento del IsOK evento para determinar en qué botón se hizo clic. Las lbl variables de datos corresponden a los Label controles que se trataron anteriormente. Si el usuario hace clic en el botón Aceptar , los datos de los controles del TextBox control se asignan al control correspondiente Label . Si el usuario hace clic en Cancelar, los Text valores se establecen en las cadenas predeterminadas.

Agregue el siguiente código del controlador de eventos de clic de botón a la clase Form1.

void avAddressCtrl_OnButtonClick(
    object sender,
    MyControls.MyControl1.MyControlEventArgs args)
{
    if (args.IsOK)
    {
        lblAddress.Text = "Street Address: " + args.MyStreetAddress;
        lblCity.Text = "City: " + args.MyCity;
        lblName.Text = "Name: " + args.MyName;
        lblState.Text = "State: " + args.MyState;
        lblZip.Text = "Zip: " + args.MyZip;
    }
    else
    {
        lblAddress.Text = "Street Address: ";
        lblCity.Text = "City: ";
        lblName.Text = "Name: ";
        lblState.Text = "State: ";
        lblZip.Text = "Zip: ";
    }
}

Compile y ejecute la aplicación. Agregue texto en el control compuesto de WPF y, a continuación, haga clic en Aceptar. El texto aparece en las etiquetas. En este momento, no se ha agregado código para controlar los botones de radio.

Modificar la apariencia del control

Los RadioButton controles del formulario permitirán al usuario cambiar los colores de primer plano y de fondo del control compuesto de WPF, así como varias propiedades de fuente. El color de fondo está expuesto por el objeto ElementHost. Las propiedades restantes se exponen como propiedades personalizadas del control.

Haga doble clic en cada RadioButton control del formulario para crear CheckedChanged controladores de eventos. Reemplace los CheckedChanged controladores de eventos por el código siguiente.

private void radioBackgroundOriginal_CheckedChanged(object sender, EventArgs e)
{
    wpfAddressCtrl.MyControl_Background = initBackBrush;
}

private void radioBackgroundLightGreen_CheckedChanged(object sender, EventArgs e)
{
    wpfAddressCtrl.MyControl_Background = new SolidColorBrush(Colors.LightGreen);
}

private void radioBackgroundLightSalmon_CheckedChanged(object sender, EventArgs e)
{
    wpfAddressCtrl.MyControl_Background = new SolidColorBrush(Colors.LightSalmon);
}

private void radioForegroundOriginal_CheckedChanged(object sender, EventArgs e)
{
    wpfAddressCtrl.MyControl_Foreground = initForeBrush;
}

private void radioForegroundRed_CheckedChanged(object sender, EventArgs e)
{
    wpfAddressCtrl.MyControl_Foreground = new System.Windows.Media.SolidColorBrush(Colors.Red);
}

private void radioForegroundYellow_CheckedChanged(object sender, EventArgs e)
{
    wpfAddressCtrl.MyControl_Foreground = new System.Windows.Media.SolidColorBrush(Colors.Yellow);
}

private void radioFamilyOriginal_CheckedChanged(object sender, EventArgs e)
{
    wpfAddressCtrl.MyControl_FontFamily = initFontFamily;
}

private void radioFamilyTimes_CheckedChanged(object sender, EventArgs e)
{
    wpfAddressCtrl.MyControl_FontFamily = new System.Windows.Media.FontFamily("Times New Roman");
}

private void radioFamilyWingDings_CheckedChanged(object sender, EventArgs e)
{
    wpfAddressCtrl.MyControl_FontFamily = new System.Windows.Media.FontFamily("WingDings");
}

private void radioSizeOriginal_CheckedChanged(object sender, EventArgs e)
{
    wpfAddressCtrl.MyControl_FontSize = initFontSize;
}

private void radioSizeTen_CheckedChanged(object sender, EventArgs e)
{
    wpfAddressCtrl.MyControl_FontSize = 10;
}

private void radioSizeTwelve_CheckedChanged(object sender, EventArgs e)
{
    wpfAddressCtrl.MyControl_FontSize = 12;
}

private void radioStyleOriginal_CheckedChanged(object sender, EventArgs e)
{
    wpfAddressCtrl.MyControl_FontStyle = initFontStyle;
}

private void radioStyleItalic_CheckedChanged(object sender, EventArgs e)
{
    wpfAddressCtrl.MyControl_FontStyle = System.Windows.FontStyles.Italic;
}

private void radioWeightOriginal_CheckedChanged(object sender, EventArgs e)
{
    wpfAddressCtrl.MyControl_FontWeight = initFontWeight;
}

private void radioWeightBold_CheckedChanged(object sender, EventArgs e)
{
    wpfAddressCtrl.MyControl_FontWeight = FontWeights.Bold;
}

Compile y ejecute la aplicación. Haga clic en los diferentes botones de radio para ver el efecto en el control compuesto de WPF.

Consulte también