Procedura dettagliata: Hosting di un controllo composito WPF in Windows FormWalkthrough: Hosting a WPF Composite Control in Windows Forms

Windows Presentation Foundation (WPF)Windows Presentation Foundation (WPF) fornisce un ambiente completo per la creazione di applicazioni.provides a rich environment for creating applications. Tuttavia, quando è presente un investimento sostanziale Windows FormWindows Forms codice, può essere più efficace estendere esistente Windows FormWindows Forms dell'applicazione con WPFWPF anziché riscriverla da zero.However, when you have a substantial investment in Windows FormWindows Forms code, it can be more effective to extend your existing Windows FormWindows Forms application with WPFWPF rather than to rewrite it from scratch. Uno scenario comune è quando si desidera incorporare uno o più controlli implementati con WPFWPF all'interno dell'applicazione Windows Form.A common scenario is when you want to embed one or more controls implemented with WPFWPF within your Windows Forms application. Per altre informazioni sulla personalizzazione dei controlli WPF, vedere personalizzazione dei controlli.For more information about customizing WPF controls, see Control Customization.

Questa procedura dettagliata viene descritta un'applicazione che ospita un WPFWPF controllo composito per eseguire l'immissione di dati in un'applicazione Windows Form.This walkthrough steps you through an application that hosts a WPFWPF composite control to perform data-entry in a Windows Forms application. Il controllo composito è compresso in una DLL.The composite control is packaged in a DLL. Questa procedura generale può essere estesa ad applicazioni e controlli più complessi.This general procedure can be extended to more complex applications and controls. Questa procedura dettagliata è progettata per essere pressoché identiche aspetto e funzionalità a procedura dettagliata: Hosting di un Windows Forms Composite Control in WPF.This walkthrough is designed to be nearly identical in appearance and functionality to Walkthrough: Hosting a Windows Forms Composite Control in WPF. La principale differenza è che lo scenario di hosting è invertito.The primary difference is that the hosting scenario is reversed.

La procedura guidata è suddivisa in due sezioni.The walkthrough is divided into two sections. La prima sezione descrive brevemente l'implementazione del WPFWPF controllo composito.The first section briefly describes the implementation of the WPFWPF composite control. La seconda sezione illustra in dettaglio come ospitare il controllo composito in un'applicazione Windows Forms, ricevere eventi dal controllo e accedere ad alcune delle proprietà del controllo.The second section discusses in detail how to host the composite control in a Windows Forms application, receive events from the control, and access some of the control’s properties.

Le attività illustrate nella procedura dettagliata sono le seguenti:Tasks illustrated in this walkthrough include:

  • Implementazione del controllo composito WPF.Implementing the WPF composite control.

  • Implementazione dell'applicazione host Windows Forms.Implementing the Windows Forms host application.

Per un listato di codice completo delle attività illustrate in questa procedura dettagliata, vedere che ospita un controllo WPF composito in Windows Forms Sample.For a complete code listing of the tasks illustrated in this walkthrough, see Hosting a WPF Composite Control in Windows Forms Sample.

PrerequisitiPrerequisites

Per completare la procedura dettagliata, è necessario Visual Studio.You need Visual Studio to complete this walkthrough.

Implementazione del controllo composito WPFImplementing the WPF Composite Control

Il WPFWPF controllo composito usato in questo esempio è un modulo di immissione dati semplice che accetta nome e l'indirizzo dell'utente.The WPFWPF composite control used in this example is a simple data-entry form that takes the user's name and address. Quando l'utente fa clic su uno dei due pulsanti per indicare che l'attività è completata, il controllo genera un evento personalizzato per restituire tali informazioni all'host.When the user clicks one of two buttons to indicate that the task is finished, the control raises a custom event to return that information to the host. La figura seguente mostra il controllo sottoposto a rendering.The following illustration shows the rendered control.

L'immagine seguente mostra un controllo composito WPF:The following image shows a WPF composite control:

Screenshot che mostra un controllo WPF semplice.

Creazione del progettoCreating the Project

Per avviare il progetto:To start the project:

  1. Avvio veloce Microsoft Visual StudioMicrosoft Visual Studioe aprire la nuovo progetto nella finestra di dialogo.Launch Microsoft Visual StudioMicrosoft Visual Studio, and open the New Project dialog box.

  2. In Visual c# e nella categoria Windows selezionare la libreria di controlli utente WPF modello.In Visual C# and the Windows category, select the WPF User Control Library template.

  3. Assegnare il nome MyControls al nuovo progetto.Name the new project MyControls.

  4. Per il percorso, specificare una cartella di livello superiore denominata in modo appropriato, ad esempio WindowsFormsHostingWpfControl.For the location, specify a conveniently named top-level folder, such as WindowsFormsHostingWpfControl. Successivamente, si immetterà l'applicazione host in questa cartella.Later, you will put the host application in this folder.

  5. Fare clic su OK per creare il progetto.Click OK to create the project. Il progetto predefinito contiene un unico controllo denominato UserControl1.The default project contains a single control named UserControl1.

  6. In Esplora soluzioni rinominare UserControl1 a MyControl1.In Solution Explorer, rename UserControl1 to MyControl1.

Il progetto dovrebbe includere riferimenti alle DLL di sistema seguenti.Your project should have references to the following system DLLs. Se alcune di queste DLL non sono incluse per impostazione predefinita, aggiungerle al progetto.If any of these DLLs are not included by default, add them to your project.

  • PresentationCorePresentationCore

  • PresentationFrameworkPresentationFramework

  • SystemSystem

  • WindowsBaseWindowsBase

Creazione dell'interfaccia utenteCreating the User Interface

Il interfaccia utenteuser interface (UI) per il controllo composito viene implementato con Extensible Application Markup Language (XAML)Extensible Application Markup Language (XAML).The interfaccia utenteuser interface (UI) for the composite control is implemented with Extensible Application Markup Language (XAML)Extensible Application Markup Language (XAML). Il controllo composito Interfaccia utenteUI costituito da cinque TextBox elementi.The composite control Interfaccia utenteUI consists of five TextBox elements. Ciascuna TextBox è associato un elemento TextBlock elemento che funge da etichetta.Each TextBox element has an associated TextBlock element that serves as a label. Esistono due Button elementi in basso OK e Annulla.There are two Button elements at the bottom, OK and Cancel. Quando l'utente fa clic su uno di questi pulsanti, il controllo genera un evento personalizzato per restituire le informazioni all'host.When the user clicks either button, the control raises a custom event to return the information to the host.

Layout di baseBasic Layout

I vari Interfaccia utenteUI gli elementi sono contenuti un Grid elemento.The various Interfaccia utenteUI elements are contained in a Grid element. È possibile usare Grid per disporre il contenuto di composita controllare in gran parte lo stesso modo in cui si userebbe una Table elemento in formato HTML.You can use Grid to arrange the contents of the composite control in much the same way you would use a Table element in HTML. WPFWPF ha anche un Table elemento, ma Grid è più semplice e più adatto per le attività di layout semplice.also has a Table element, but Grid is more lightweight and better suited for simple layout tasks.

Il codice XAML seguente illustra il layout di base.The following XAML shows the basic layout. Questo XAML definisce la struttura generale del controllo specificando il numero di colonne e righe di Grid elemento.This XAML defines the overall structure of the control by specifying the number of columns and rows in the Grid element.

In MyControl1.xaml sostituire il codice XAML esistente con il seguente.In MyControl1.xaml, replace the existing XAML with the following 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>

Aggiunta di elementi TextBlock e TextBox alla grigliaAdding TextBlock and TextBox Elements to the Grid

Si inserisce un Interfaccia utenteUI elemento della griglia impostando l'elemento RowProperty e ColumnProperty attributi per il numero di riga e colonna appropriato.You place a Interfaccia utenteUI element in the grid by setting the element's RowProperty and ColumnProperty attributes to the appropriate row and column number. Ricordare che la numerazione di righe e colonne e in base zero.Remember that row and column numbering are zero-based. È possibile avere un elemento estendersi su più colonne impostando relativo ColumnSpanProperty attributo.You can have an element span multiple columns by setting its ColumnSpanProperty attribute. Per altre informazioni sulle Grid elementi, vedere creare un elemento griglia.For more information about Grid elements, see Create a Grid Element.

il XAML seguente viene illustrato il controllo composito TextBox e TextBlock gli elementi con loro RowProperty e ColumnProperty attributi, che vengono impostati per inserire correttamente gli elementi nella griglia.The following XAML shows the composite control’s TextBox and TextBlock elements with their RowProperty and ColumnProperty attributes, which are set to place the elements properly in the grid.

In MyControl1.xaml aggiungere il seguente XAML all'interno di Grid elemento.In MyControl1.xaml, add the following XAML within the Grid element.

  <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"/>

Applicazione di stili agli elementi dell'interfaccia utenteStyling the UI Elements

Molti degli elementi nel form di immissione dati hanno un aspetto simile, che significa che hanno impostazioni identiche per alcune delle loro proprietà.Many of the elements on the data-entry form have a similar appearance, which means that they have identical settings for several of their properties. Anziché impostare separatamente i relativi attributi, il XAML precedente utilizza Style elementi per definire le impostazioni delle proprietà standard per le classi di elementi.Rather than setting each element's attributes separately, the previous XAML uses Style elements to define standard property settings for classes of elements. Questo approccio riduce la complessità del controllo e consente di modificare l'aspetto di più elementi tramite un unico attributo di stile.This approach reduces the complexity of the control and enables you to change the appearance of multiple elements through a single style attribute.

Il Style gli elementi sono contenuti nel Grid dell'elemento Resources proprietà, in modo che possono essere usati da tutti gli elementi nel controllo.The Style elements are contained in the Grid element's Resources property, so they can be used by all elements in the control. Se uno stile è denominato, applicarlo a un elemento aggiungendo un Style elemento impostato sul nome dello stile.If a style is named, you apply it to an element by adding a Style element set to the style's name. Gli stili che non sono denominati diventano lo stile predefinito per l'elemento.Styles that are not named become the default style for the element. Per altre informazioni sulle WPFWPF stili, vedere Styling and Templating.For more information about WPFWPF styles, see Styling and Templating.

L'esempio di XAML seguente illustra il Style elementi per il controllo composito.The following XAML shows the Style elements for the composite control. Per visualizzare come gli stili vengono applicati agli elementi, vedere il codice XAML precedente.To see how the styles are applied to elements, see the previous XAML. Ad esempio, l'ultima TextBlock elemento ha la inlineText stile di visualizzazione e l'ultimo TextBox elemento utilizza lo stile predefinito.For example, the last TextBlock element has the inlineText style, and the last TextBox element uses the default style.

In MyControl1.xaml aggiungere il XAML seguente subito dopo il Grid elemento iniziale.In MyControl1.xaml, add the following XAML just after the Grid start element.

<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>

Aggiunta dei pulsanti OK e CancelAdding the OK and Cancel Buttons

Gli elementi finali del controllo composito sono le OK e Annulla Button elementi, che occupano le prime due colonne dell'ultima riga del Grid.The final elements on the composite control are the OK and CancelButton elements, which occupy the first two columns of the last row of the Grid. Questi elementi usano un gestore eventi comune, ButtonClickede il valore predefinito Button stile definito in XAML i precedenti.These elements use a common event handler, ButtonClicked, and the default Button style defined in the previous XAML.

In MyControl1.xaml aggiungere il seguente XAML dopo l'ultimo TextBox elemento.In MyControl1.xaml, add the following XAML after the last TextBox element. Il XAMLXAML parte del controllo composito è stata completata.The XAMLXAML part of the composite control is now complete.

<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>

Implementazione del file code-behindImplementing the Code-Behind File

Il file, code-behind MyControl1.xaml.cs implementa tre attività essenziali:The code-behind file, MyControl1.xaml.cs, implements three essential tasks:

  1. Gestisce l'evento che si verifica quando l'utente fa clic su uno dei pulsanti.Handles the event that occurs when the user clicks one of the buttons.

  2. Recupera i dati dal TextBox elementi e li Assembla in un oggetto argomento dell'evento personalizzato.Retrieves the data from the TextBox elements, and packages it in a custom event argument object.

  3. Genera l'oggetto personalizzato OnButtonClick evento che notifica all'host che l'utente ha terminato e passa i dati all'host.Raises the custom OnButtonClick event, which notifies the host that the user is finished and passes the data back to the host.

Il controllo espone inoltre un numero di proprietà di colore e tipo di carattere che consentono di modificare l'aspetto.The control also exposes a number of color and font properties that enable you to change the appearance. A differenza di WindowsFormsHost classe, che viene usato per ospitare un controllo Windows Form, il ElementHost classe espone il controllo Background solo la proprietà.Unlike the WindowsFormsHost class, which is used to host a Windows Forms control, the ElementHost class exposes the control’s Background property only. Per mantenere la somiglianza tra questo esempio di codice e l'esempio illustrato procedura dettagliata: Hosting di controlli Windows Form compositi in WPF, il controllo espone direttamente le proprietà rimanenti.To maintain the similarity between this code example and the example discussed in Walkthrough: Hosting a Windows Forms Composite Control in WPF, the control exposes the remaining properties directly.

Struttura di base del file code-behindThe Basic Structure of the Code-Behind File

Il file code-behind è costituito da un singolo spazio dei nomi MyControls, che contiene due classi MyControl1 e MyControlEventArgs.The code-behind file consists of a single namespace, MyControls, which will contain two classes, MyControl1 and MyControlEventArgs.

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

La prima classe MyControl1, è una classe parziale che contiene il codice che implementa la funzionalità del Interfaccia utenteUI definita in MyControl1.xaml.The first class, MyControl1, is a partial class containing the code that implements the functionality of the Interfaccia utenteUI defined in MyControl1.xaml. Quando viene analizzato MyControl1.xaml, il XAMLXAML viene convertito nella stessa classe parziale, e le due classi parziali vengono unite per formare il controllo compilato.When MyControl1.xaml is parsed, the XAMLXAML is converted to the same partial class, and the two partial classes are merged to form the compiled control. Per questo motivo, il nome della classe nel file code-behind deve corrispondere al nome della classe assegnato a MyControl1.xaml e deve ereditare dall'elemento radice del controllo.For this reason, the class name in the code-behind file must match the class name assigned to MyControl1.xaml, and it must inherit from the root element of the control. La seconda classe, MyControlEventArgs, è una classe di argomenti di evento che viene usata per inviare i dati all'host.The second class, MyControlEventArgs, is an event arguments class that is used to send the data back to the host.

Aprire MyControl1.xaml.cs.Open MyControl1.xaml.cs. Modificare la dichiarazione di classe esistente in modo che lo ha il seguente nome ed eredita da Grid.Change the existing class declaration so that it has the following name and inherits from Grid.

public partial class MyControl1 : Grid

Inizializzazione del controlloInitializing the Control

Il codice seguente implementa alcune attività di base:The following code implements several basic tasks:

  • Dichiara un evento privato OnButtonClicke il relativo delegato associato, MyControlEventHandler.Declares a private event, OnButtonClick, and its associated delegate, MyControlEventHandler.

  • Crea diverse variabili globali private che archiviano i dati dell'utente.Creates several private global variables that store the user's data. Questi dati vengono esposti tramite le proprietà corrispondenti.This data is exposed through corresponding properties.

  • Implementa un gestore Init, per il controllo Loaded evento.Implements a handler, Init, for the control’s Loaded event. Questo gestore inizializza le variabili globali assegnando loro i valori definiti in MyControl1.xaml.This handler initializes the global variables by assigning them the values defined in MyControl1.xaml. A tale scopo, Usa la Name assegnato a una tipica TextBlock elemento nameLabel, per accedere alle impostazioni delle proprietà dell'elemento.To do this, it uses the Name assigned to a typical TextBlock element, nameLabel, to access that element's property settings.

Eliminare il costruttore esistente e aggiungere il codice seguente per il MyControl1 classe.Delete the existing constructor and add the following code to your MyControl1 class.

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;
}

Gestione degli eventi clic dei pulsantiHandling the Buttons' Click Events

L'utente indica che l'attività di immissione dati è completata facendo il OK pulsante o il Annulla pulsante.The user indicates that the data-entry task is finished by clicking either the OK button or the Cancel button. Entrambi i pulsanti usano lo stesso Click gestore eventi, ButtonClicked.Both buttons use the same Click event handler, ButtonClicked. Entrambi i pulsanti hanno un nome, btnOK oppure btnCancel, che consente al gestore determinare quale pulsante è stato fatto clic esaminando il valore della sender argomento.Both buttons have a name, btnOK or btnCancel, that enables the handler to determine which button was clicked by examining the value of the sender argument. Il gestore esegue le operazioni seguenti:The handler does the following:

  • Crea una MyControlEventArgs oggetto che contiene i dati dal TextBox elementi.Creates a MyControlEventArgs object that contains the data from the TextBox elements.

  • Se l'utente ha fatto clic la annullare pulsante, i set di MyControlEventArgs dell'oggetto IsOK proprietà false.If the user clicked the Cancel button, sets the MyControlEventArgs object's IsOK property to false.

  • Genera il OnButtonClick evento per indicare all'host che l'utente ha terminato e passa nuovamente i dati raccolti.Raises the OnButtonClick event to indicate to the host that the user is finished, and passes back the collected data.

Aggiungere il codice seguente per il MyControl1 classe, dopo il Init (metodo).Add the following code to your MyControl1 class, after the Init method.

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);
}

Creazione di proprietàCreating Properties

Il resto della classe espone semplicemente proprietà che corrispondono alle variabili globali precedentemente illustrate.The remainder of the class simply exposes properties that correspond to the global variables discussed previously. Quando una proprietà viene modificata, la funzione di accesso impostata modifica l'aspetto del controllo cambiando le proprietà degli elementi corrispondenti e aggiornando le variabili globali sottostanti.When a property changes, the set accessor modifies the appearance of the control by changing the corresponding element properties and updating the underlying global variables.

Aggiungere il codice seguente per il MyControl1 classe.Add the following code to your MyControl1 class.

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;
    }
}

Invio di dati di nuovo all'hostSending the Data Back to the Host

Il componente finale nel file è il MyControlEventArgs classe, che viene usato per inviare i dati raccolti all'host.The final component in the file is the MyControlEventArgs class, which is used to send the collected data back to the host.

Aggiungere il codice seguente per il MyControls dello spazio dei nomi.Add the following code to your MyControls namespace. L'implementazione è semplice e non verrà ulteriormente illustrata.The implementation is straightforward, and is not discussed further.

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; }
    }
}

Compilare la soluzione.Build the solution. La compilazione genererà una DLL denominata MyControls.dll.The build will produce a DLL named MyControls.dll.

Implementazione dell'applicazione host Windows FormsImplementing the Windows Forms Host Application

I moduli di Windows host applicazione utilizza un ElementHost oggetti all'host di WPFWPF controllo composito.The Windows Forms host application uses an ElementHost object to host the WPFWPF composite control. L'applicazione gestisce il OnButtonClick eventi per ricevere i dati dal controllo composito.The application handles the OnButtonClick event to receive the data from the composite control. L'applicazione presenta anche un insieme di pulsanti di opzione che è possibile utilizzare per modificare l'aspetto del controllo.The application also has a set of option buttons that you can use to modify the control’s appearance. La figura seguente mostra l'applicazione.The following illustration shows the application.

L'immagine seguente mostra un controllo composito WPF ospitato in un'applicazione Windows Forms"The following image shows a WPF composite control hosted in a Windows Forms application"

Scteenshot che mostra un controllo Windows Form che ospita Avalon.

Creazione del progettoCreating the Project

Per avviare il progetto:To start the project:

  1. Avvio veloce Visual StudioVisual Studioe aprire la nuovo progetto nella finestra di dialogo.Launch Visual StudioVisual Studio, and open the New Project dialog box.

  2. In Visual c# e nella categoria Windows selezionare la Windows Forms Application modello.In Visual C# and the Windows category, select the Windows Forms Application template.

  3. Assegnare il nome WFHost al nuovo progetto.Name the new project WFHost.

  4. Come percorso, specificare la stessa cartella di livello superiore che contiene il progetto MyControls.For the location, specify the same top-level folder that contains the MyControls project.

  5. Fare clic su OK per creare il progetto.Click OK to create the project.

È inoltre necessario aggiungere i riferimenti alla DLL contenente MyControl1 e ad altri assembly.You also need to add references to the DLL that contains MyControl1 and other assemblies.

  1. Il nome del progetto in Esplora soluzioni e scegliere Aggiungi riferimento.Right-click the project name in Solution Explorer, and select Add Reference.

  2. Scegliere il esplorare scheda e passare alla cartella che contiene MyControls.Click the Browse tab, and browse to the folder that contains MyControls.dll. In questa procedura dettagliata la cartella è MyControls\bin\Debug.For this walkthrough, this folder is MyControls\bin\Debug.

  3. Selezionare MyControls e quindi fare clic su OK.Select MyControls.dll, and then click OK.

  4. Aggiungere riferimenti agli assembly indicati di seguito.Add references to the following assemblies.

    • PresentationCorePresentationCore

    • PresentationFrameworkPresentationFramework

    • System.XamlSystem.Xaml

    • WindowsBaseWindowsBase

    • WindowsFormsIntegrationWindowsFormsIntegration

Implementazione dell'interfaccia utente per l'applicazioneImplementing the User Interface for the Application

L'interfaccia utente per l'applicazione Windows Form contiene vari controlli per interagire con il controllo composito WPF.The UI for the Windows Form application contains several controls to interact with the WPF composite control.

  1. Aprire Form1 in Progettazione Windows Form.Open Form1 in the Windows Form Designer.

  2. Ingrandire il form per cui inserire i controlli.Enlarge the form to accommodate the controls.

  3. Nell'angolo superiore destro del form, aggiungere un System.Windows.Forms.Panel controllo per contenere il WPFWPF controllo composito.In the upper-right corner of the form, add a System.Windows.Forms.Panel control to hold the WPFWPF composite control.

  4. Aggiungere il codice seguente System.Windows.Forms.GroupBox controlli al form.Add the following System.Windows.Forms.GroupBox controls to the form.

    NomeName TestoText
    groupBox1groupBox1 Colore di sfondoBackground Color
    groupBox2groupBox2 Colore primo pianoForeground Color
    groupBox3groupBox3 Dimensione carattereFont Size
    groupBox4groupBox4 Famiglia di caratteriFont Family
    groupBox5groupBox5 StileFont Style
    groupBox6groupBox6 Spessore carattereFont Weight
    groupBox7groupBox7 Dati dal controlloData from control
  5. Aggiungere il codice seguente System.Windows.Forms.RadioButton controlli per il System.Windows.Forms.GroupBox controlli.Add the following System.Windows.Forms.RadioButton controls to the System.Windows.Forms.GroupBox controls.

    GroupBoxGroupBox NomeName TestoText
    groupBox1groupBox1 radioBackgroundOriginalradioBackgroundOriginal OriginaleOriginal
    groupBox1groupBox1 radioBackgroundLightGreenradioBackgroundLightGreen LightGreenLightGreen
    groupBox1groupBox1 radioBackgroundLightSalmonradioBackgroundLightSalmon LightSalmonLightSalmon
    groupBox2groupBox2 radioForegroundOriginalradioForegroundOriginal OriginaleOriginal
    groupBox2groupBox2 radioForegroundRedradioForegroundRed RossoRed
    groupBox2groupBox2 radioForegroundYellowradioForegroundYellow GialloYellow
    groupBox3groupBox3 radioSizeOriginalradioSizeOriginal OriginaleOriginal
    groupBox3groupBox3 radioSizeTenradioSizeTen 1010
    groupBox3groupBox3 radioSizeTwelveradioSizeTwelve 1212
    groupBox4groupBox4 radioFamilyOriginalradioFamilyOriginal OriginaleOriginal
    groupBox4groupBox4 radioFamilyTimesradioFamilyTimes Times New RomanTimes New Roman
    groupBox4groupBox4 radioFamilyWingDingsradioFamilyWingDings WingDingsWingDings
    groupBox5groupBox5 radioStyleOriginalradioStyleOriginal NormaleNormal
    groupBox5groupBox5 radioStyleItalicradioStyleItalic CorsivoItalic
    groupBox6groupBox6 radioWeightOriginalradioWeightOriginal OriginaleOriginal
    groupBox6groupBox6 radioWeightBoldradioWeightBold GrassettoBold
  6. Aggiungere il codice seguente System.Windows.Forms.Label controlla all'ultima System.Windows.Forms.GroupBox.Add the following System.Windows.Forms.Label controls to the last System.Windows.Forms.GroupBox. Questi controlli visualizzano i dati restituiti dai WPFWPF controllo composito.These controls display the data returned by the WPFWPF composite control.

    GroupBoxGroupBox NomeName TestoText
    groupBox7groupBox7 lblNamelblName Nome:Name:
    groupBox7groupBox7 lblAddresslblAddress Indirizzo:Street Address:
    groupBox7groupBox7 lblCitylblCity Città:City:
    groupBox7groupBox7 lblStatelblState Stato:State:
    groupBox7groupBox7 lblZiplblZip CAP:Zip:

Inizializzazione del formInitializing the Form

Viene in genere implementato il codice di hosting del modulo Load gestore dell'evento.You generally implement the hosting code in the form's Load event handler. Il codice seguente illustra il Load gestore dell'evento, un gestore per il WPFWPF del controllo composito Loaded evento e le dichiarazioni per diverse variabili globali usate successivamente.The following code shows the Load event handler, a handler for the WPFWPF composite control’s Loaded event, and declarations for several global variables that are used later.

Nella finestra di progettazione Windows Form, fare doppio clic sul form per creare un Load gestore dell'evento.In the Windows Forms Designer, double-click the form to create a Load event handler. Aggiungere il codice seguente all'inizio di Form1.cs, using istruzioni.At the top of Form1.cs, add the following using statements.

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

Sostituire il contenuto dell'oggetto esistente Form1 classe con il codice seguente.Replace the contents of the existing Form1 class with the following code.

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;
}

Il Form1_Load metodo nel codice precedente illustra la procedura generale per l'hosting di un WPFWPF controllo:The Form1_Load method in the preceding code shows the general procedure for hosting a WPFWPF control:

  1. Creare un nuovo ElementHost oggetto.Create a new ElementHost object.

  2. Impostare il controllo Dock proprietà DockStyle.Fill.Set the control's Dock property to DockStyle.Fill.

  3. Aggiungere il ElementHost controllo per il Panel del controllo Controls raccolta.Add the ElementHost control to the Panel control's Controls collection.

  4. Creare un'istanza di WPFWPF controllo.Create an instance of the WPFWPF control.

  5. Ospitare il controllo composito sul form assegnando il controllo per il ElementHost del controllo Child proprietà.Host the composite control on the form by assigning the control to the ElementHost control's Child property.

Le due righe restanti nel Form1_Load metodo associare i gestori a due eventi di controllo:The remaining two lines in the Form1_Load method attach handlers to two control events:

  • OnButtonClick è un evento personalizzato che viene generato dal controllo composito quando l'utente sceglie il OK oppure Annulla pulsante.OnButtonClick is a custom event that is fired by the composite control when the user clicks the OK or Cancel button. Si gestisce l'evento per ottenere la risposta dell'utente e per raccogliere i dati specificati dall'utente.You handle the event to get the user's response and to collect any data that the user specified.

  • Loaded è un evento standard generato da un WPFWPF controllare quando è stato caricato completamente.Loaded is a standard event that is raised by a WPFWPF control when it is fully loaded. L'evento è usato qui poiché nell'esempio è necessario inizializzare diverse variabili globali usando le proprietà del controllo.The event is used here because the example needs to initialize several global variables using properties from the control. Al momento del form Load evento, il controllo non è stato caricato completamente e questi valori sono ancora impostati su null.At the time of the form's Load event, the control is not fully loaded and those values are still set to null. È necessario attendere che il controllo Loaded evento si verifica prima di poter accedere a tali proprietà.You need to wait until the control’s Loaded event occurs before you can access those properties.

Il Loaded gestore di è illustrato nel codice precedente.The Loaded event handler is shown in the preceding code. Il OnButtonClick gestore di è descritto nella sezione successiva.The OnButtonClick handler is discussed in the next section.

Gestione dell'evento OnButtonClickHandling OnButtonClick

Il OnButtonClick evento si verifica quando l'utente fa clic il OK oppure Annulla pulsante.The OnButtonClick event occurs when the user clicks the OK or Cancel button.

Il gestore eventi controlla l'argomento dell'evento IsOK campo per determinare quale pulsante è stato fatto clic.The event handler checks the event argument's IsOK field to determine which button was clicked. Il lbl data variabili corrispondono al Label controlli descritti in precedenza.The lbldata variables correspond to the Label controls that were discussed earlier. Se l'utente sceglie il OK pulsante, i dati del controllo TextBox assegnato ai corrispondenti controlli Label controllo.If the user clicks the OK button, the data from the control’s TextBox controls is assigned to the corresponding Label control. Se l'utente sceglie annullare, il Text valori vengono impostati sulle stringhe predefinite.If the user clicks Cancel, the Text values are set to the default strings.

Aggiungere il seguente pulsante fare clic sul codice del gestore eventi per il Form1 classe.Add the following button click event handler code to the Form1 class.

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: ";
    }
}

Compilare ed eseguire l'applicazione.Build and run the application. Aggiungere il testo nel controllo composito WPF e quindi fare clic su OK.Add some text in the WPF composite control and then click OK. Il testo viene visualizzato nelle etichette.The text appears in the labels. A questo punto, il codice non è stato aggiunto ai pulsanti di opzione.At this point, code has not been added to handle the radio buttons.

Modifica dell'aspetto del controlloModifying the Appearance of the Control

Il RadioButton controlli nel form consentirà all'utente di modificare il WPFWPF nonché alcune proprietà del tipo di carattere i colori di primo piano e sfondo del controllo composito.The RadioButton controls on the form will enable the user to change the WPFWPF composite control’s foreground and background colors as well as several font properties. Il colore di sfondo è esposto dal ElementHost oggetto.The background color is exposed by the ElementHost object. Le proprietà restanti sono esposte come proprietà personalizzate del controllo.The remaining properties are exposed as custom properties of the control.

Fare doppio clic su ognuno RadioButton controllo sul form per creare CheckedChanged gestori eventi.Double-click each RadioButton control on the form to create CheckedChanged event handlers. Sostituire il CheckedChanged gestori di eventi con il codice seguente.Replace the CheckedChanged event handlers with the following code.

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;
}

Compilare ed eseguire l'applicazione.Build and run the application. Fare clic sui vari pulsanti di opzione per vedere l'effetto sul controllo composito WPF.Click the different radio buttons to see the effect on the WPF composite control.

Vedere ancheSee also