2016-04-05 5 views
0

Ich versuche, eine Vorlage für meine Knöpfe zu erstellen, die haben:Stil mit Vorlage blockiert den Text in WPF

  • Border Eckenradius
  • Hintergrund als Gradient
  • ändern Grenzfarbe auf schweben

Bisher habe ich hier:

<Window.Resources> 
    <Style TargetType="Button" x:Key="aimDark"> 
     <Setter Property="VerticalAlignment" Value="Top" /> 
     <Setter Property="Margin" Value="5,5,5,0" /> 
     <Setter Property="Height" Value="20" /> 
     <Setter Property="Foreground" Value="#0e0e0e" /> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="Button"> 
        <Border 
         CornerRadius="4" 
         BorderBrush="#000000" 
         BorderThickness="1"> 
         <Border.Background> 
          <LinearGradientBrush StartPoint="0,0" EndPoint="0,1"> 
           <GradientStop Color="#006d23" Offset="0" /> 
           <GradientStop Color="#006d23" Offset="0.05" /> 
           <GradientStop Color="#00c741" Offset="0.45" /> 
           <GradientStop Color="#00c741" Offset="1" /> 
          </LinearGradientBrush> 
         </Border.Background> 
         <RenderOptions.EdgeMode>Aliased</RenderOptions.EdgeMode> 
        </Border> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 
</Window.Resources> 
<Grid> 
    <Button Content="Test" Name="btn01" Style="{StaticResource aimDark}" /> 
</Grid> 

Das Problem:

Zuerst mein Content in der Taste in der Tat nicht angezeigt wird, ist es nicht in meiner Taste machen Text.

Und ich weiß nicht, wie nur die Rahmenfarbe in der Hover-Ereignis ändern.

Antwort

0

Sie benötigen eine ContentPresenter, damit der Inhalt der Schaltfläche angezeigt wird.

Auch wenn Sie einen Namen in ControlTemplate>Border definieren können Sie es ändern, wenn ein Action-Abzug ist wie folgt:

<Style x:Key="mylayout" TargetType="Button"> 
    <Setter Property="VerticalAlignment" Value="Top" /> 
    <Setter Property="Margin" Value="5,5,5,0" /> 
    <Setter Property="Height" Value="20" /> 
    <Setter Property="Foreground" Value="#949494" /> 
    <Setter Property="Background" Value="the_gradient" /> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="Button"> 
       <Border CornerRadius="4" BorderBrush="#000000" BorderThickness="1" Background="{TemplateBinding Background}" Name="border"> 
        <ContentPresenter Content="{TemplateBinding Content}" HorizontalAlignment="Center" VerticalAlignment="Center"/> 
       </Border> 
       <ControlTemplate.Triggers> 
        <Trigger Property="IsMouseOver" Value="True"> 
         <Setter Property="BorderBrush" TargetName="border" Value="#e9eceb" /> 
        </Trigger> 
       </ControlTemplate.Triggers> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 
1

In ControlTemplate sollten Sie ContentPresenter angeben, um die Content eines Button anzuzeigen.

<Window.Resources> 
    <Style TargetType="Button" x:Key="aimDark"> 
     <Setter Property="VerticalAlignment" Value="Top" /> 
     <Setter Property="Margin" Value="5,5,5,0" /> 
     <Setter Property="Height" Value="20" /> 
     <Setter Property="Foreground" Value="#0e0e0e" /> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="Button"> 
        <Border 
        CornerRadius="4" 
        BorderBrush="#000000" 
        BorderThickness="1"> 
         <Border.Background> 
          <LinearGradientBrush StartPoint="0,0" EndPoint="0,1"> 
           <GradientStop Color="#006d23" Offset="0" /> 
           <GradientStop Color="#006d23" Offset="0.05" /> 
           <GradientStop Color="#00c741" Offset="0.45" /> 
           <GradientStop Color="#00c741" Offset="1" /> 
          </LinearGradientBrush>         
         </Border.Background> 
         <RenderOptions.EdgeMode>Aliased</RenderOptions.EdgeMode> 
         <ContentPresenter Content="{TemplateBinding Content}" HorizontalAlignment="Center" VerticalAlignment="Center"/> 
        </Border> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 
</Window.Resources> 
1

Die Vorlage, die Sie nicht ContentPresenter erstellt hat, und das ist erforderlich, um den Inhalt (Text oder andere) zu zeigen. Ich schlage vor, Sie starten von default Button template und nehmen Änderungen vor, wie Sie brauchen.