Demonstra Passo a passo: Conteúdo do estilo do WPF
Essa explicação passo a passo mostram como aplicar estilos a um controle hospedado em um Windows Form Windows Presentation Foundation (WPF).
Nesta explicação passo a passo, você executa as seguintes tarefas:
Criar o projeto.
Cria os tipos de controle WPF.
Aplicar um estilo para o controle WPF.
.gif "Observação") Observação |
|---|
As caixas de diálogo e comandos de menu demonstradas podem ser diferentes daqueles descritos na Ajuda, dependendo das configurações ativas ou configurações de edição. Para alterar as configurações, escolha Import and Export Settings sobre o Ferramentas menu. Para obter mais informações, consulte Trabalhando com configurações. |
Pré-requisitos
Para completar este passo a passo, são necessários os seguintes componentes:
- Visual Studio 2010.
Criando o projeto
A primeira etapa é criar um projeto de Formulário Windows.
| Observação |
|---|
Quando hospedar conteúdo WPF, apenas projetos C# e Visual Basic são suportados. |
Para criar o projeto
- Crie um novo projeto Windows Forms Application em Visual Basic ou Visual C# chamado SelectingWpfContent . Para obter mais informações, consulte Como: Crie um novo projeto de aplicativo do Windows Forms.
Criando o tipo de controle WPF
Após adicionar um tipo de controle WPF para o projeto, você pode hospedá-lo em um ElementHost controle.
Para criar tipos de controle WPF
Adicionar um novo WPF UserControl o projeto à solução. Use o nome padrão para o tipo de controle, UserControl1.xaml. Para obter mais informações, consulte Demonstra Passo a passo: Criando novo conteúdo WPF no Windows Forms em tempo de Design.
No modo de exibição de design, veja se UserControl1 está selecionada. Para obter mais informações, consulte Como: Selecionar e mover elementos na superfície de design.
Na janela Propriedades, defina o valor das properties Width e Height como 200.
Adicionar um System.Windows.Controls.Button o controle para o UserControl e definir o valor a Content propriedade para cancelar.
Adicionar um segundo System.Windows.Controls.Button o controle para o UserControl e definir o valor a Content propriedade para OK.
Crie o projeto.
Aplicar um estilo a um controle WPF
Você pode aplicar outro estilo a um controle WPF para alterar sua aparência e comportamento.
Aplicar um estilo a um controle WPF
Abra Form1 no Windows Forms Designer.
Na caixa Toolbox, clique duas vezes em UserControl1 para criar uma instância de UserControl1 sobre o formulário.
Uma instância de UserControl1 está hospedada em um novo controle ElementHost chamado elementHost1.
No painel de marcas inteligentes para elementHost1, clique em Editar Host conteúdo a partir de drop-down list.
UserControl1 é aberta no WPF Designer.
No modo de exibição XAML, inserir o seguinte XAML após o marca de abertura para <UserControl>.
Este XAML cria um preenchimento gradual com uma borda de gradiente de contraste. Quando o controle é clicado, Os gradientes são alterados para gerar uma aparência botão pressionado. Para obter mais informações, consulte 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>
Aplicar o SimpleButton estilo definido na etapa anterior para o botão Cancelar, inserindo o seguinte XAML na <Button> a marca do botão Cancelar.
Style="{StaticResource SimpleButton}Sua declaração de botão será semelhante a seguinte XAML.
<Button Height="23" Margin="41,52,98,0" Name="button1" VerticalAlignment="Top"
Style="{StaticResource SimpleButton}">Cancel</Button>
Crie o projeto.
Abra Form1 no Windows Forms Designer.
O novo estilo é aplicado ao controle de botão.
Do Debug menu, selecione Start Debugging para executar o aplicativo.
Clique nos botões OK e Cancelar e exibir as diferenças.