Laden...

Button Background bei MouseOver animieren, variable Farbe

Letzter Beitrag vor 3 Jahren 9 Posts 814 Views
Button Background bei MouseOver animieren, variable Farbe

Hallo,

ich habe folgende Frage. Ich möchte die Hintergrundfarbe eines Buttons bei MouseOver animieren und dabei gern die Zielfarbe variabel gestalten. Ich hatte den Gedanken, dass über eine AttatchedProperty zu lösen. Dazu habe mit einen Style definiert


<Color x:Key="ButtonMouseOverColor" A="#FF" R="#52" G="#52" B="#5E"/>
<Style TargetType="{x:Type Button}">
        <Setter Property="SnapsToDevicePixels" Value="true"/>
        <Setter Property="OverridesDefaultStyle" Value="true"/>
        <Setter Property="Background" Value="Transparent"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Button}">
                    <Border x:Name="Border" TextBlock.Foreground="{TemplateBinding Foreground}" CornerRadius="4" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}">
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="CommonStates">
                                <VisualState x:Name="Normal"/>
                                <VisualState x:Name="MouseOver">
                                    <Storyboard>
                                        <ColorAnimation Storyboard.TargetName="Border" Storyboard.TargetProperty="(Border.Background).(SolidColorBrush.Color)" To="{StaticResource ButtonMouseOverColor}" Duration="0:0:0"/>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Pressed"/>
                                <VisualState x:Name="Disabled"/>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <ContentPresenter Margin="2" HorizontalAlignment="Center" VerticalAlignment="Center" RecognizesAccessKey="True" />
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

und folgende Attatched Property, die ich bei Verwendung des Buttons setzten kann und über die dann die Background-Color der Border im Style gesetzt werden soll.


using System.Windows;
using System.Windows.Media;

namespace Sportboden.Resources
{
    public class Extensions : DependencyObject
    {
        public static readonly DependencyProperty MouseOverColorProperty = DependencyProperty.RegisterAttached("MouseOverColor", typeof(Color), typeof(Extensions), new PropertyMetadata(Color.FromArgb(0xFF, 0x46, 0x82, 0xB4)));

        public static void SetMouseOverColor(DependencyObject target, Color value)
        {
            target.SetValue(MouseOverColorProperty, value);
        }

        public static Color GetMouseOverColor(DependencyObject target)
        {
            return (Color)target.GetValue(MouseOverColorProperty);
        }
    }
}


Nun würde ich gern in der Animation unter "To" den Wert setzten, der in der AttatchedProperty steht, bring das aber nicht zusammen. Vielleicht habe ich aber auch einen Denkfehler und das geht so gar nicht. Wie kann ich das lösen?

Danke und Grüße,

Alex

Final no hay nada más

Hallo Th69,

danke für deine Antwort. Ich glaube aber, dass löst mein Problem, bzw. beantwortet die Frage nicht. Ich möchte nicht die AttatechProperty bei Verwendung eines Buttons an einen Wert binden, sondern in einem Style in der Animation dem Zielwert den Wert der AttatchedProperty zuweisen.


To="local:Extentions.MouseOverColor"

Ich frage mich nur gerade, ob das überhaupt geht, weil für in der Animation ja Binding nicht funktioniert und dann auch eine (Attatched) DependencyProperty wenig Sinn mach.

Wie gesagt, ich weiß nicht, ob ich hier völlig auf dem Holzweg bin.

Final no hay nada más

Was passiert denn bei


To="{Binding Path=(local:Extensions.MouseOverColor)}"

?

PS: Deine Klasse heißt doch Extensions (und nicht Extentions).

Das ist sicher ein Tippfehler, im Code stimmt es aber.

folgendes habe ich versucht:


<ColorAnimation Storyboard.TargetName="Border" Storyboard.TargetProperty="(Border.Background).(SolidColorBrush.Color)" To="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type Button}}, Path=(resources:Extentions.MouseOverColor)}" Duration="0:0:0"/>

Im Output erscheint: System.Windows.Data Error: 4 : Cannot find source for binding with reference 'RelativeSource FindAncestor, AncestorType='System.Windows.Controls.Button', AncestorLevel='1''. BindingExpression:Path=(0); DataItem=null; target element is 'ColorAnimation' (HashCode=47260332); target property is 'To' (type 'Nullable`1')

Final no hay nada más

Ich hatte mal gelesen, das Binding im der Animation nicht funktioniert:
wpf-animation-binding-to-the-to-attribute-of-storyboard-animation

Ich hatte das Propblem schon mal, deswegen hatte ich es weiter oben auch schon erwähnt.

Final no hay nada más

Tja, dann geht das wohl nicht so einfach.

Hast du denn mehrere Buttons mit jeweils verschiedenen MouseOverColor?
Und hast du mal DynamicResource ausprobiert (und dann diese Resource zur Laufzeit ändern)?

Ich habe einen Button mit eigenem Template und ich möchte abhängig vom Hintergrund, vor dem sich der Button befindet, die MouseOverColor anpassen können, damit immer ausreichend Kontrast vorhanden ist.

Final no hay nada más