tags:

views:

461

answers:

1

Hello,

I have a style for a GlassButton. The problem is that the gradients are built in the style and the colors are set in the gradients. Now, I have a framework for a button that I like but I need different buttons to be different colors. Is there any way I can "expose" one or more of the color properties from the Style to override in my button implementations? Style below:

And if not, then what's the best practice for doing something like this? I don't want to have to create different styles for each color, e.g. "GlassButtonBlue, GlassButtonGreen, GlassButtonRed"--seems like overkill...

<Style x:Key="GlassButton" TargetType="{x:Type Button}">
    <Setter Property="FontSize" Value="42" />
    <Setter Property="Foreground" Value="White" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type Button}">
                <Border x:Name="ButtonBorder" 
                    CornerRadius="25,25,25,25" 
                    BorderThickness="4,4,4,4" 
                    Background="CadetBlue"
                    BorderBrush="#99FFFFFF"
                    RenderTransformOrigin="0.5,0.5">
                    <Grid>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="*"/>
                            <RowDefinition Height="2.6*"/>
                        </Grid.RowDefinitions>
                        <Border Grid.Row="0" CornerRadius="23,23,0,0">
                            <Border.Background>
                                <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1">
                                    <GradientStop x:Name="test" Color="#08FFFFFF" Offset="0"/>
                                    <GradientStop Color="#88FFFFFF" Offset="1"/>
                                </LinearGradientBrush>
                            </Border.Background>
                        </Border>
                        <ContentPresenter x:Name="ButtonContentPresenter"          
                            VerticalAlignment="Center"  
                            Grid.RowSpan="2" 
                            HorizontalAlignment="Center"/>
                    </Grid>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsPressed" Value="True">
                        <Setter Property="RenderTransform" TargetName="ButtonBorder">
                            <Setter.Value>
                                <TransformGroup>
                                    <ScaleTransform ScaleX="0.9" ScaleY="0.9"/>
                                </TransformGroup>
                            </Setter.Value>
                        </Setter>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>
+1  A: 

This case demonstrates a good use for attached properties, which can be defined on your GlassButton control (of typed Button in actuality) so that the values in your XAML can bind to them. A simple template binding ({TemplateBinding MyAttachedProperty}) should do the job.

Give that a go and let me know if you need any help in specific parts.

Noldorin
Thanks...I looked briefly but since it involves code, I don't think I have time right now...will get back to this later this weekend...
LSTayon