Procedura dettagliata: applicazione di stili al contenuto WPF
In questa procedura dettagliata viene illustrato come applicare gli stili a un controllo Windows Presentation Foundation (WPF) incluso in un Windows Form.
Questa procedura dettagliata prevede l'esecuzione delle attività seguenti:
Creare il progetto.
Creare i tipi di controllo WPF.
Applicare uno stile a un controllo WPF.
Nota
È possibile che le finestre di dialogo e i comandi di menu visualizzati siano diversi da quelli descritti nella Guida a seconda delle impostazioni attive o dell'edizione del programma. Per modificare le impostazioni, scegliere Importa/Esporta impostazioni dal menu Strumenti. Per ulteriori informazioni, vedere Gestione delle impostazioni.
Prerequisiti
Per completare la procedura dettagliata, è necessario disporre dei componenti seguenti:
- Visual Studio 2010.
Creazione del progetto
Il primo passaggio consiste nella creazione del progetto Windows Form.
Nota
Con il contenuto WPF sono supportati solo progetti C# e Visual Basic.
Per creare il progetto
- Creare un nuovo progetto di applicazione Windows Form, denominato StylingWpfContent, in Visual Basic o Visual C#. Per ulteriori informazioni, vedere Procedura: creare un nuovo progetto di applicazione Windows Form.
Creazione di tipi di controlli WPF
Dopo avere aggiunto un tipo di controllo WPF al progetto, è possibile includerlo in un controllo ElementHost.
Per creare tipi di controlli WPF
Aggiungere un nuovo progetto UserControl di WPF alla soluzione. Utilizzare il nome predefinito per il tipo del controllo, ovvero UserControl1.xaml. Per ulteriori informazioni, vedere Procedura dettagliata: creazione di nuovo contenuto WPF in Windows Form in fase di progettazione.
In visualizzazione Progettazione verificare che UserControl1 sia selezionato. Per ulteriori informazioni, vedere Procedura: selezionare e spostare elementi sull'area di progettazione.
Nella finestra Proprietà impostare il valore delle proprietà Width e Height su 200.
Aggiungere un controllo System.Windows.Controls.Button al controllo UserControl e impostare il valore della proprietà Content su Annulla.
Aggiungere un secondo controllo System.Windows.Controls.Button al controllo UserControl e impostare il valore della proprietà Content su OK.
Compilare il progetto.
Applicazione di un stile a un controllo WPF
È possibile applicare un altro stile a un controllo WPF per modificarne l'aspetto e il comportamento.
Per applicare uno stile a un controllo WPF
Aprire Form1 in Progettazione Windows Form.
Nella Casella degli strumenti fare doppio clic su UserControl1 per creare un'istanza di UserControl1 sul form.
Un'istanza di UserControl1 viene inclusa in un nuovo controllo ElementHost denominato elementHost1.
Nel pannello smart tag per elementHost1, scegliere Modifica contenuto ospitato dall'elenco a discesa.
UserControl1 verrà visualizzato in WPF Designer.
In visualizzazione XAML inserire il seguente codice XAML dopo il tag di apertura <UserControl>:
Questo codice XAML crea una sfumatura con un bordo sfumato contrastante. Dopo aver fatto clic sul controllo, le sfumature cambiano per generare un aspetto del pulsante premuto. Per ulteriori informazioni, vedere Styling and Templating.
<UserControl.Resources>
<LinearGradientBrush x:Key="NormalBrush" EndPoint="0,1" StartPoint="0,0">
<GradientStop Color="#FFF" Offset="0.0"/>
<GradientStop Color="#CCC" Offset="1.0"/>
</LinearGradientBrush>
<LinearGradientBrush x:Key="PressedBrush" EndPoint="0,1" StartPoint="0,0">
<GradientStop Color="#BBB" Offset="0.0"/>
<GradientStop Color="#EEE" Offset="0.1"/>
<GradientStop Color="#EEE" Offset="0.9"/>
<GradientStop Color="#FFF" Offset="1.0"/>
</LinearGradientBrush>
<LinearGradientBrush x:Key="NormalBorderBrush" EndPoint="0,1" StartPoint="0,0">
<GradientStop Color="#CCC" Offset="0.0"/>
<GradientStop Color="#444" Offset="1.0"/>
</LinearGradientBrush>
<LinearGradientBrush x:Key="BorderBrush" EndPoint="0,1" StartPoint="0,0">
<GradientStop Color="#CCC" Offset="0.0"/>
<GradientStop Color="#444" Offset="1.0"/>
</LinearGradientBrush>
<LinearGradientBrush x:Key="PressedBorderBrush" EndPoint="0,1" StartPoint="0,0">
<GradientStop Color="#444" Offset="0.0"/>
<GradientStop Color="#888" Offset="1.0"/>
</LinearGradientBrush>
<Style x:Key="SimpleButton" TargetType="{x:Type Button}" BasedOn="{x:Null}">
<Setter Property="Background" Value="{StaticResource NormalBrush}"/>
<Setter Property="BorderBrush" Value="{StaticResource NormalBorderBrush}"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Grid x:Name="Grid">
<Border x:Name="Border" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}"/>
<ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" RecognizesAccessKey="True"/>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsPressed" Value="true">
<Setter Property="Background" Value="{StaticResource PressedBrush}" TargetName="Border"/>
<Setter Property="BorderBrush" Value="{StaticResource PressedBorderBrush}" TargetName="Border"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</UserControl.Resources>
Applicare lo stile SimpleButton definito nel passaggio precedente al pulsante Annulla inserendo il codice XAML riportato di seguito nel tag <Button> del pulsante Annulla.
Style="{StaticResource SimpleButton}La dichiarazione del pulsante sarà simile al codice XAML riportato di seguito.
<Button Height="23" Margin="41,52,98,0" Name="button1" VerticalAlignment="Top"
Style="{StaticResource SimpleButton}">Cancel</Button>
Compilare il progetto.
Aprire Form1 in Progettazione Windows Form.
Il nuovo stile verrà applicato al controllo del pulsante.
Per eseguire l'applicazione, scegliere Avvia debug dal menu Debug.
Fare clic sui pulsanti OK e Annulla e visualizzare le differenze.
Vedere anche
Riferimenti
Concetti
Cenni preliminari su XAML (WPF)