Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Foreground Color of Custom Button (ControlPresenter)

I am attempting to define a global button style in App.xaml, and it's mostly working as I expect. However, I just cannot figure out how to get the Foreground to work correctly. No matter what I do, I am getting the style of the default TextBlock (which sets the color to White).

    <Style TargetType="{x:Type Button}">
        <Setter Property="Margin" Value="3, 5" />
        <Setter Property="OverridesDefaultStyle" Value="True" />
        <Setter Property="FocusVisualStyle" 
                Value="{StaticResource ButtonFocusVisual}" />
        <Setter Property="Foreground" Value="Red" />
        <Setter Property="Padding" Value="5" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="Button">
                    <Grid x:Name="gridMainButton"
                          RenderTransformOrigin="0.5, 0.5">
                        <Grid.RenderTransform>
                            <ScaleTransform x:Name="scaleTransform" 
                                            CenterX="0.5"
                                            CenterY="0.5" />
                        </Grid.RenderTransform>
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="CommonStates" >
                                <VisualState x:Name="Normal" />
                                <VisualState x:Name="MouseOver" />
                                <VisualState x:Name="Pressed">
                                    <Storyboard>
                                        <DoubleAnimation
                                              Storyboard.TargetName="scaleTransform"
                                              Storyboard.TargetProperty="ScaleX"
                                              Duration="0"
                                              To="0.85" />
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>

                        <Ellipse x:Name="ellipse"
                                 HorizontalAlignment="Stretch"
                                 VerticalAlignment="Stretch"
                                 StrokeThickness="2"
                                 Stroke="{StaticResource standardBackground}"
                                 Fill="{StaticResource standardBackground}" />
                        <ContentPresenter HorizontalAlignment="Center"
                                          VerticalAlignment="Center"
                                          Margin="4, 8"/>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

I guess I could change the ContentPresenter to a TextBlock, which would be ok for this particular application, but I'm looking for a more generic solution.

Thanks,
wTs

like image 997
Wonko the Sane Avatar asked Mar 16 '11 18:03

Wonko the Sane


2 Answers

Like Markus Hütter said, the problem is probably that you have an implicit Style for a TextBlock defined and when the Button Content is set to a string, a TextBlock will be created where you have the ContentPresenter in the Template. This TextBlock will pick up the implicit Style and that's why you're getting this problem.

You can disable the implicit Style for a TextBlocks that is created in place for a string by specifying a DataTemplate for string. Add the following to App.xaml

<Application ...>
    <Application.Resources>
        <DataTemplate xmlns:sys="clr-namespace:System;assembly=mscorlib"
                      DataType="{x:Type sys:String}">
            <TextBlock Text="{Binding}">
                <TextBlock.Resources>
                    <Style TargetType="{x:Type TextBlock}"/>
                </TextBlock.Resources>
            </TextBlock>
        </DataTemplate>
        <!--...-->
    </Application.Resources>
</Application>
like image 132
Fredrik Hedblad Avatar answered Sep 29 '22 00:09

Fredrik Hedblad


you seem to be using a custom style for textblock (if you say Foreground color is white) lets call this StandardTextBlockStyle.

Within your button style inside the outer grid. include this:

<Grid x:Name="gridMainButton">
    <Grid.Resources>
        <Style TargetType="TextBlock" BasedOn="{StaticResource StandardTextBlockStyle}">
            <Setter Property="Foreground" Value="Black"/>
        </Style>
    </Grid.Resources>
    <!-- ...-->
</Grid>

this should override the default TextBlock style.

like image 26
Markus Hütter Avatar answered Sep 28 '22 23:09

Markus Hütter