2009-08-19 17 views
4

Ich bin ein Anfänger mit WPF und ich weiß nicht einmal, wo ich die Antwort auf diese Frage finden soll. Diese XAML scheint sehr einfach zu mir:Warum ändert sich der Hintergrund des Buttons?

<Page 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> 
    <Grid> 
    <Button> 
     <Button.Style> 
     <Style TargetType="{x:Type Button}"> 
     <Style.Triggers> 
      <Trigger Property="IsMouseOver" Value="True"> 
      <Setter Property="Background" Value="Green"/> 
      </Trigger>  
     </Style.Triggers> 
     </Style> 
     </Button.Style> 
     <Button.Content>Test</Button.Content> 
    </Button> 
    </Grid> 
</Page> 

Wenn ich die Maus über die Schaltfläche, IsMouseOver Änderungen True und der Auslöser macht grünen Hintergrund macht. Für einen Augenblick. Dann wird es blau.

Noch besser: wenn ich den gleichen Setzer an die IsFocused Eigenschaft anschließe, wenn ich mich auf den Knopf konzentriere, pocht die Hintergrundfarbe zwischen Grünem und Blauem.

Es gibt etwas, irgendwo in der Schaltfläche (ich vermute, es ist in jedem Standard-Theme unter Vista verwendet wird), die es so verhält. Ich vermute, dass es eine andere Eigenschaft gibt, die der Auslöser setzen muss. Aber was?

Antwort

22

Sie müssen die ButtonTemplate anstelle von Style ändern. In die Vorlage eingebaut ist etwas, das ButtonChrome genannt wird, und das verursacht den störenden blauen Fokus-Effekt. Hier ist ein sehr einfacher Wieder Templating der Button Kontrolle, von dem bereitgestellten Einfachen Styles genommen:

<Style TargetType="{x:Type Button}"> 
    <Setter Property="SnapsToDevicePixels" Value="true"/> 
    <Setter Property="OverridesDefaultStyle" Value="true"/> 
    <Setter Property="MinHeight" Value="23"/> 
    <Setter Property="MinWidth" Value="75"/> 
    <Setter Property="Template"> 
    <Setter.Value> 
     <ControlTemplate TargetType="{x:Type Button}"> 
     <Border 
      x:Name="Border" 
      CornerRadius="2" 
      BorderThickness="1" 
      Background="#C0C0C0" 
      BorderBrush="#404040"> 
      <ContentPresenter 
      Margin="2" 
      HorizontalAlignment="Center" 
      VerticalAlignment="Center" 
      RecognizesAccessKey="True"/> 
     </Border> 
     <ControlTemplate.Triggers> 
      <Trigger Property="IsKeyboardFocused" Value="true"> 
      <Setter TargetName="Border" Property="BorderBrush" Value="#202020" /> 
      </Trigger> 
      <Trigger Property="IsDefaulted" Value="true"> 
      <Setter TargetName="Border" Property="BorderBrush" Value="#202020" /> 
      </Trigger> 
      <Trigger Property="IsMouseOver" Value="true"> 
      <Setter TargetName="Border" Property="Background" Value="#808080" /> 
      </Trigger> 
      <Trigger Property="IsPressed" Value="true"> 
      <Setter TargetName="Border" Property="Background" Value="#E0E0E0" /> 
      <Setter TargetName="Border" Property="BorderBrush" Value="#606060" /> 
      </Trigger> 
      <Trigger Property="IsEnabled" Value="false"> 
      <Setter TargetName="Border" Property="Background" Value="#EEEEEE" /> 
      <Setter TargetName="Border" Property="BorderBrush" Value="#AAAAAA" /> 
      <Setter Property="Foreground" Value="#888888"/> 
      </Trigger> 
     </ControlTemplate.Triggers> 
     </ControlTemplate> 
    </Setter.Value> 
    </Setter> 
</Style> 

Sie können sehen, dass durch die Steuerung wieder Templating, können Sie seine visuelle Struktur ändern. Der visuelle Baum in dieser Vorlage ist nichts anderes als eine Border, die eine ContentPresenter enthält (damit Sie den Inhalt der Schaltfläche sehen können). Ich habe den ButtonChrome auf diese Weise aus dem visuellen Baum entfernt.

+0

Danke! Wenn Sie "die bereitgestellten einfachen Stile" sagen, worauf beziehen Sie sich? –

+0

diesen Artikel Check out: http://blog.falafel.com/2008/07/17/UsingTheSimpleStylesProjectInVisualStudioToCustomizeWPFControls.aspx – Charlie

+0

@ Robert- Sie können sie in Expression erhalten Blending siehe hier: http://msdn.microsoft. com/de-us/library/cc294894 (v = Ausdruck.40) .aspx – RichardOD

6

Charlies Antwort ist gut. Ich möchte nur mit einer Erklärung ergänzen, was vor sich ging, und ein Kommentar schien nicht der richtige Ort zu sein.

Der Grund, warum es für einen Augenblick grün war und dann war blau ist, weil die Standard-Theme des ControlTemplate für Button bereits ein IsMouseOverTrigger hatten den Hintergrund zu ändern.

Dann haben Sie eine andere in Ihrem Style hinzugefügt. Dies ersetzt nicht die bestehende, weil Sie mehrere Trigger s auf der gleichen Eigenschaft und Wert haben können, die sehr unterschiedlich Setter s haben und ganz andere Dinge tun.

So versuchte es beides, und tat zuerst das grüne.

+2

Das war, was ich dachte, ging vor. Gibt es eine Möglichkeit, einen Trigger einfach zu entfernen, wenn Sie es nicht möchten, oder das Steuerelement auf die einzige Weise neu zu gestalten? –

+1

Re-Templat ist der einzige Weg, soweit ich weiß. –

Verwandte Themen