Codejock Forums Homepage
Forum Home Forum Home > General > XAML Snippets
  New Posts New Posts RSS Feed - XAML Button with Icon
  FAQ FAQ  Forum Search   Events   Register Register  Login Login

XAML Button with Icon

 Post Reply Post Reply
Author
Message
Ikkon View Drop Down
Newbie
Newbie
Avatar

Joined: 14 August 2008
Location: United States
Status: Offline
Points: 1
Post Options Post Options   Thanks (0) Thanks(0)   Quote Ikkon Quote  Post ReplyReply Direct Link To This Post Topic: XAML Button with Icon
    Posted: 14 August 2008 at 9:01am
Hello,

I am trying to make a button with styl that has a textBlock and image on the button.

I have the style working, so I tried to extend the style to add the textblock and image icon. but every time I add a control template in the extending style the first style vanishes...

anyone know how to do this or a bettter way? I just want to be able to add a button set the style and not have to worry about the text or icon


<Style x:Key="RegularButton">
                <Setter Property="Control.Margin" Value="2" />
                <Setter Property="Control.FontSize" Value="12" />
                <Setter Property="Control.Foreground" Value="Black"/>
                <Setter Property="Control.FontWeight" Value="bold"/>
                <Setter Property="Control.FontFamily" Value="Tohoma"/>
                <Setter Property="Control.Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type Button}">
                            <Grid>
                                <Grid.BitmapEffect>
                                    <DropShadowBitmapEffect Opacity=".25" ShadowDepth="2.4" Softness=".05" />
                                </Grid.BitmapEffect>
                                <Rectangle x:Name="GelBackground" Opacity="1" RadiusX="4" RadiusY="4" StrokeThickness="2">
                                    <Rectangle.Stroke>
                                        <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                                            <GradientStop Color="#999999" Offset="0" />
                                            <GradientStop Color="#999999" Offset="1" />
                                        </LinearGradientBrush>
                                    </Rectangle.Stroke>
                                    <Rectangle.Fill>
                                        <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                                            <GradientStop Color="#ffffff" Offset=".15"/>
                                            <GradientStop Color="#cccccc" Offset=".9"/>
                                        </LinearGradientBrush>
                                    </Rectangle.Fill>
                                </Rectangle>
                                <ContentPresenter VerticalAlignment="Center" HorizontalAlignment="Center"/>
                            </Grid>
                            <ControlTemplate.Triggers>
                                <Trigger Property="IsMouseOver" Value="True">
                                    <Setter Property="Fill" TargetName="GelBackground">
                                        <Setter.Value>
                                            <RadialGradientBrush GradientOrigin="0,0.83" Center="0.8,0.4" Opacity=".9" RadiusX="5" RadiusY="0.8">
                                                <RadialGradientBrush.GradientStops>
                                                    <GradientStop Color="#97fafe" Offset="0" />
                                                    <GradientStop Color="#48e4ea" Offset="0.25" />
                                                    <GradientStop Color="#094254" Offset="0.63" />
                                                    <GradientStop Color="#0a4244" Offset="0.8" />
                                                </RadialGradientBrush.GradientStops>
                                            </RadialGradientBrush>
                                        </Setter.Value>
                                    </Setter>
                                </Trigger>
                                <Trigger Property="IsPressed" Value="true">
                                    <Setter Property="Fill" TargetName="GelBackground">
                                        <Setter.Value>
                                            <RadialGradientBrush GradientOrigin="0,0.83" Center="0.8,0.4" Opacity=".7" RadiusX="5" RadiusY="0.8">
                                                <RadialGradientBrush.GradientStops>
                                                    <GradientStop Color="#97fafe" Offset="0" />
                                                    <GradientStop Color="#48e4ea" Offset="0.25" />
                                                    <GradientStop Color="#094254" Offset="0.63" />
                                                    <GradientStop Color="#000000" Offset="0.8" />
                                                </RadialGradientBrush.GradientStops>
                                            </RadialGradientBrush>
                                        </Setter.Value>
                                    </Setter>
                                </Trigger>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>               
            </Style>


        <!-- second style -->

            <Style x:Key="lastButton" BasedOn="{StaticResource RegularButton}" TargetType="Button">
            <Setter Property="Control.Foreground" Value="silver" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate>
                        <StackPanel>
                            <TextBlock Margin="15,12,10,0" HorizontalAlignment="left" VerticalAlignment="Center" Text="Next"/>
                            <Image Margin="10,-16,20,20" Width="17" Height="16" HorizontalAlignment="right" VerticalAlignment="Center" Source="bottom-next.png"/>
                        </StackPanel>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>


the button I want to be something like

<Button Height="28" Width="100" Style="{StaticResource lastButton}"/>

Back to Top
Oleg View Drop Down
Admin Group
Admin Group


Joined: 21 May 2003
Location: United States
Status: Offline
Points: 11234
Post Options Post Options   Thanks (0) Thanks(0)   Quote Oleg Quote  Post ReplyReply Direct Link To This Post Posted: 14 August 2008 at 2:02pm

Hi,

Our Markup doesn't support ControlTemplate, BitmapEffect, RadialGradientBrush tags. Check readme.txt and our xaml samlpes for list of supported tags.
Oleg, Support Team
CODEJOCK SOFTWARE SOLUTIONS
Back to Top
 Post Reply Post Reply
  Share Topic   

Forum Jump Forum Permissions View Drop Down

Forum Software by Web Wiz Forums® version 12.04
Copyright ©2001-2021 Web Wiz Ltd.

This page was generated in 0.172 seconds.