开发者

Swapping Colors in Button-Template on pressed

I am trying to design a button-template, that swaps its colors, when pressed.

Unluckily I cant get it to work.

I am using the BorderBrush as a temporary variable. Most likely there are more sophisticated solutions possible.

Here is my code.

    <Style TargetType="{x:Type Button}">
        <Style.Setters>
            <Setter Property="Foreground"
                    Value="{StaticResource RahmenFarbe}" />
            <Setter Property="Background"
                    Value="{StaticResource HintergrundFarbe}" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Button}">
                        <Grid Width="{TemplateBinding Width}"
                              Height="{TemplateBinding Height}"
                              ClipToBounds="True">
                            <Border BorderBrush="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=Button, AncestorLevel=1}, Path=Foreground}"
                                    x:Name="ButtonBorder"
                                    CornerRadius="25"
                                    BorderThickness="4"
                                    Background="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=Button, AncestorLevel=1}, Path=Background}"
                                    RenderTransformOrigin="0.5,0.5">
                                <TextBlock  x:Name="ButtonTextBlock"
                                            Foreground="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=Button, AncestorLevel=1}, Path=Foreground}"
                                            VerticalAlignment="Center"
                                            HorizontalAlignment="Center">
                                <ContentPresenter x:Name="myContentPresenter"
                                                  Content="{TemplateBinding Content}" />
                                </TextBlock>
                            </Border>
                        </Grid>
          开发者_如何学JAVA              <ControlTemplate.Triggers>
                            <Trigger Property="IsPressed"
                                     Value="True">
                                <Setter Property="BorderBrush"
                                        Value="{Binding Mode=OneTime, Path=Foreground}" />
                                <Setter Property="Foreground"
                                        Value="{Binding Mode=OneTime, Path=Background}" />
                                <Setter Property="Background"
                                        Value="{Binding Mode=OneTime, Path=BorderBrush}" />
                            </Trigger>
                        </ControlTemplate.Triggers >

                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style.Setters>
    </Style>

Any help would be appreciated.

Regards Sebastian


Update

Finally understood what you really wanted to do. Here is how you get it done. Bind to the TemplatedParent's Background and Foreground and set TargetName in the setters. This way, the source for the colors will always stay the same and you can easily swap them

<ControlTemplate.Triggers>
    <Trigger Property="IsPressed" Value="True">
        <Setter TargetName="ButtonBorder"
                Property="Background"
                Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Foreground}" />
        <Setter TargetName="ButtonTextBlock"
                Property="Foreground"
                Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Background}" />
    </Trigger>
</ControlTemplate.Triggers>

Optionally, you can also change the Bindings in your Template from

Background="{Binding Path=Background,
                     RelativeSource={RelativeSource FindAncestor,
                                                    AncestorType=Button,
                                                    AncestorLevel=1}}"

To just

Background="{TemplateBinding Background}"


Here is the solution with codebehind.

<Style TargetType="{x:Type Button}">
        <Style.Setters>
            <Setter Property="Foreground"
                    Value="{StaticResource RahmenFarbe}" />
            <Setter Property="Background"
                    Value="{StaticResource HintergrundFarbe}" />
            <Setter Property="FontSize"
                    Value="18" />
            <Setter Property="FontWeight"
                    Value="Bold" />
            <EventSetter Event="PreviewMouseDown"
                         Handler="vertauscheFarben" />
            <EventSetter Event="PreviewMouseUp"
                         Handler="vertauscheFarben" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Button}">
                        <Grid Width="{TemplateBinding Width}"
                              Height="{TemplateBinding Height}"
                              ClipToBounds="True">
                            <Border BorderBrush="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=Button, AncestorLevel=1}, Path=Foreground}"
                                    x:Name="ButtonBorder"
                                    CornerRadius="25"
                                    BorderThickness="4"
                                    Background="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=Button, AncestorLevel=1}, Path=Background}"
                                    RenderTransformOrigin="0.5,0.5">
                                <TextBlock  x:Name="ButtonTextBlock"
                                            Foreground="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=Button, AncestorLevel=1}, Path=Foreground}"
                                            VerticalAlignment="Center"
                                            HorizontalAlignment="Center">
                                <ContentPresenter x:Name="myContentPresenter"
                                                  Content="{TemplateBinding Content}" />
                                </TextBlock>
                            </Border>
                        </Grid>

                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style.Setters>
    </Style>

This is the CodeBehind

Private Sub vertauscheFarben(sender As Object, e As MouseButtonEventArgs)
    Dim Button = DirectCast(sender, Button)

    Dim Temp = Button.Foreground
    Button.Foreground = Button.Background
    Button.Background = Temp
End Sub

It is working, but I would prefer it within Xaml - so I won't mark this as answered.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜