locked
Problem handling Click events - again. RRS feed

  • Question

  •  Hi all.

     Using the method described here I've created a template for my button template.

    To the right is how my solution looks like : 

    the generic.xaml file contains templates for my buttons. Those are basically 2 similiar buttons with minor differences.

     

    Generic.xaml : 

     

    <ResourceDictionary

          xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

          xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

          xmlns:local="clr-namespace:InfinityControls;assembly=InfinityControls">

        <!-- GlassButton Template -->

        <Style TargetType="local:GlassButton">

            <Setter Property="Template">

                <Setter.Value>

                    <ControlTemplate TargetType="local:GlassButton">

                        <Grid x:Name="RootElement">

                            <!-- Control Resources -->

                            <Grid.Resources>

                                <!—Mouse over-->

                                <Storyboard x:Name="MouseOver State">

                                    <ColorAnimationUsingKeyFrames Storyboard.TargetName="grid" Storyboard.TargetProperty="(Panel.Background).(GradientBrush.GradientStops)[0].(GradientStop.Color)" BeginTime="00:00:00">

                                        <SplineColorKeyFrame KeyTime="00:00:00" Value="#000049FF"/>

                                        <SplineColorKeyFrame KeyTime="00:00:00.4" Value="#FF0049FF"/>

                                    </ColorAnimationUsingKeyFrames>

                                    <!---->

                                    <ColorAnimationUsingKeyFrames Storyboard.TargetName="grid" Storyboard.TargetProperty="(Panel.Background).(GradientBrush.GradientStops)[1].(GradientStop.Color)" BeginTime="00:00:00">

                                         <SplineColorKeyFrame KeyTime="00:00:00" Value="#00000000"/>

                                         <SplineColorKeyFrame KeyTime="00:00:00.4" Value="#33000000"/>

                                    </ColorAnimationUsingKeyFrames>

                                    <!—Activate the secondary content presenter-->

                                    <ColorAnimationUsingKeyFrames Storyboard.TargetName="SecondaryContent" Storyboard.TargetProperty="(TextBlock.Foreground).(SolidColorBrush.Color)" BeginTime="00:00:00">

                                        <SplineColorKeyFrame KeyTime="00:00:00" Value="#00F2F2F2"/>

                                        <SplineColorKeyFrame KeyTime="00:00:00.4" Value="#FFF2F2F2"/>

                                    </ColorAnimationUsingKeyFrames>

                                    <!—Deactivate the primary content presenter-->

                                    <ColorAnimationUsingKeyFrames Storyboard.TargetName="PrimaryContent" Storyboard.TargetProperty="(TextBlock.Foreground).(SolidColorBrush.Color)" BeginTime="00:00:00">

                                        <SplineColorKeyFrame KeyTime="00:00:00" Value="#FFF2F2F2"/>

                                        <SplineColorKeyFrame KeyTime="00:00:00.4" Value="#00F2F2F2"/>

                                    </ColorAnimationUsingKeyFrames>

                                </Storyboard>

                                <!—Press the button-->

                                <Storyboard x:Name="Pressed State">

                                    <ColorAnimationUsingKeyFrames Storyboard.TargetName="InternalBorder" Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color)" BeginTime="00:00:00">

                                        <SplineColorKeyFrame KeyTime="00:00:00" Value="#FF000000"/>

                                        <SplineColorKeyFrame KeyTime="00:00:00.2000000" Value="#FFFFFFFF"/>

                                        <SplineColorKeyFrame KeyTime="00:00:00.5000000" Value="#FF000000"/>

                                    </ColorAnimationUsingKeyFrames>

                                    <ColorAnimationUsingKeyFrames Storyboard.TargetName="grid" Storyboard.TargetProperty="(Panel.Background).(GradientBrush.GradientStops)[0].(GradientStop.Color)" BeginTime="00:00:00">

                                        <SplineColorKeyFrame KeyTime="00:00:00" Value="#B20049FF"/>

                                        <SplineColorKeyFrame KeyTime="00:00:00.5000000" Value="#B20049FF"/>

                                    </ColorAnimationUsingKeyFrames>

                                </Storyboard>

                                <!—All back to normal -->

                                <Storyboard x:Name="Normal State">

                                    <ColorAnimationUsingKeyFrames Storyboard.TargetName="grid" Storyboard.TargetProperty="(Panel.Background).(GradientBrush.GradientStops)[0].(GradientStop.Color)" BeginTime="00:00:00">

                                        <SplineColorKeyFrame KeyTime="00:00:00" Value="#FF0049FF"/>

                                        <SplineColorKeyFrame KeyTime="00:00:00.3000000" Value="#000049FF"/>

                                    </ColorAnimationUsingKeyFrames>

                                    <ColorAnimationUsingKeyFrames Storyboard.TargetName="grid" Storyboard.TargetProperty="(Panel.Background).(GradientBrush.GradientStops)[1].(GradientStop.Color)" BeginTime="00:00:00">

                                        <SplineColorKeyFrame KeyTime="00:00:00" Value="#33000000"/>

                                        <SplineColorKeyFrame KeyTime="00:00:00.3000000" Value="#00000000"/>

                                    </ColorAnimationUsingKeyFrames>

                                    <!—Deactivate secondary content presenter-->

                                    <ColorAnimationUsingKeyFrames Storyboard.TargetName="SecondaryContent" Storyboard.TargetProperty="(TextBlock.Foreground).(SolidColorBrush.Color)" BeginTime="00:00:00">

                                        <SplineColorKeyFrame KeyTime="00:00:00" Value="#FFF2F2F2"/>

                                        <SplineColorKeyFrame KeyTime="00:00:00.4" Value="#00F2F2F2"/>

                                    </ColorAnimationUsingKeyFrames>

                                    <!—Activate primary content presenter-->

                                    <ColorAnimationUsingKeyFrames Storyboard.TargetName="PrimaryContent" Storyboard.TargetProperty="(TextBlock.Foreground).(SolidColorBrush.Color)" BeginTime="00:00:00">

                                        <SplineColorKeyFrame KeyTime="00:00:00" Value="#00F2F2F2"/>

                                        <SplineColorKeyFrame KeyTime="00:00:00.4" Value="#FFF2F2F2"/>

                                    </ColorAnimationUsingKeyFrames>

                                </Storyboard>

                            </Grid.Resources>

                            <!-- Control Body -->

                            <Border Height="{TemplateBinding Height}" HorizontalAlignment="Left" VerticalAlignment="Top" Width="{TemplateBinding Width}" x:Name="ExternalBorder" Background="#7F000000" BorderThickness="1,1,1,1" BorderBrush="#FFFFFFFF" CornerRadius="5,5,5,5">

                                <Grid x:Name="grid">

                                    <Grid.Background>

                                        <RadialGradientBrush>

                                            <GradientStop Color="#000049FF"/>

                                            <GradientStop Color="#00000000" Offset="1"/>

                                        </RadialGradientBrush>

                                    </Grid.Background>

                                    <Grid.RowDefinitions>

                                        <RowDefinition Height="0.5*"/>

                                        <RowDefinition Height="0.5*"/>

                                    </Grid.RowDefinitions>

                                    <Border Margin="8,8,8,8" Grid.RowSpan="2" BorderBrush="#FF000000" CornerRadius="5,5,5,5" BorderThickness="1,1,1,1" x:Name="InternalBorder"/>

                                    <Border CornerRadius="5,5,0,0" x:Name="LightReflection">

                                        <Border.Background>

                                            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">

                                                <GradientStop Color="#B2FFFFFF"/>

                                                <GradientStop Color="#33FFFFFF" Offset="1"/>

                                            </LinearGradientBrush>

                                        </Border.Background>

                                    </Border>

    <ContentPresenter x:Name="ContentHolder" Content="{TemplateBinding Content}" Visibility="Collapsed"/>

                                    <TextBlock x:Name="PrimaryContent"   Height="Auto" Text="" TextWrapping="NoWrap" Foreground="#FFF2F2F2" FontSize="16"  Width="Auto" HorizontalAlignment="Center" VerticalAlignment="Center" Margin="0,0,0,0" Grid.RowSpan="2"/>

                                    <TextBlock x:Name="SecondaryContent" Height="Auto" Text="" TextWrapping="NoWrap" Foreground="#00F2F2F2" FontSize="16" Width="Auto" HorizontalAlignment="Center" VerticalAlignment="Center" Margin="0,0,0,0" Grid.RowSpan="2" FontFamily="SomeWeirdFont.ttf#SomeWeirdFont"/>

                                      </Grid>

                            </Border>

                        </Grid>

                    </ControlTemplate>

                </Setter.Value>

            </Setter>

        </Style>

    </ResourceDictionary>

     

    Ok, so what we have above is a button template that has 3! text fields. A content presenter for the  Content="{TemplateBinding Content}" + 2 Textblocks, one of them having a different font. The reason for this is the fact that I've run into severe difficulties while trying to animate ContentPresenter's Foreground and I was unable to TemplateBind content to a TextBlock. Therefore I've decided to use an invisible content presenter for the template binding and 2 textblocks for display - all handled from codeBehind.

     

    GlassButton.cs  :

    using System;

    using System.Windows;

    using System.Windows.Controls;

    using System.Windows.Media.Animation;

     

    namespace InfinityControls

    {

     

        public partial class GlassButton : Button

        {

            private ContentPresenter ContentHolder;

            private TextBlock PrimaryContent;

            private TextBlock SecondaryContent;

     

            private Storyboard MouseEnterStoryBoard;

            private Storyboard MouseLeaveStoryBoard;

            private Storyboard MouseClickStoryBoard;
        

     

            public GlassButton()

            {

                //InitializeComponent(); <-- Doesn't exist in the current context error, but it seems to load fine without it... wth...

                this.Loaded += new RoutedEventHandler(GlassButton_Loaded);

               

            }

     

     

     

            void GlassButton_Loaded(object sender, RoutedEventArgs e)

            {

               

            }

     

            protected override void OnApplyTemplate()

            {

                base.OnApplyTemplate();

                           //Here we bind the content to the textblocks
     

                ContentHolder = GetTemplateChild("ContentHolder") as ContentPresenter;

                PrimaryContent = GetTemplateChild("PrimaryContent") as TextBlock;

                SecondaryContent = GetTemplateChild("SecondaryContent") as TextBlock;

               

                PrimaryContent.Text = ContentHolder.Content.ToString();

                SecondaryContent.Text = ContentHolder.Content.ToString();

     

                           //Animations wouldn't work on their own, despite the naming so I chose to handle them from the cs as well.

                MouseEnterStoryBoard = GetTemplateChild("MouseOver State") as Storyboard;

                MouseLeaveStoryBoard = GetTemplateChild("Normal State") as Storyboard;

                MouseClickStoryBoard = GetTemplateChild("Pressed State") as Storyboard;

     

                MouseEnter += new System.Windows.Input.MouseEventHandler(GlassButton_MouseEnter);

                MouseLeave += new System.Windows.Input.MouseEventHandler(GlassButton_MouseLeave);

                MouseLeftButtonDown += new System.Windows.Input.MouseButtonEventHandler(GlassButton_MouseLeftButtonDown);

            }

     

            void GlassButton_MouseLeftButtonDown(object sender, System.Windows.Input.MouseButtonEventArgs e)

            {

                MouseClickStoryBoard.Begin();

            }

     

            void GlassButton_MouseLeave(object sender, System.Windows.Input.MouseEventArgs e)

            {

                MouseLeaveStoryBoard.Begin();

            }

     

            void GlassButton_MouseEnter(object sender, System.Windows.Input.MouseEventArgs e)

            {

                MouseEnterStoryBoard.Begin();

            } 

        }

    }

     

     We just got a cool looking button, that changes the font during the MouseOver event, however there is a problem...

     

    Page.xaml.cs : 

     

     

    public Page()

                {

                      // Required to initialize variables

                      InitializeComponent();

                      this.Loaded += new RoutedEventHandler(MainPage_Loaded);
        

                }

     

            void MainPage_Loaded(object sender, RoutedEventArgs e)

            {

                           //We add a click event to MyGlassButton <- which is a GlassButton type object
                MyGlassButton.Click += new RoutedEventHandler(MyGlassButton_Click);

            }

     

            void MyGlassButton_Click(object sender, RoutedEventArgs e)

            {

                   // We're hoping to do stuff here, however when

                                 // MyGlassButton is pressed, NOTHING happens
     

            }       

     

    In the Page.xaml.cs we assign a click event to a Button of the GlassButton type. However when the button is pressed, nothing happens. I've tried debugging it and it NEVER reaches the MyGlassButton_Click method. I'm not sure what's going on, I was trying out templates stored in App.xaml and they worked fine, however It couldn't add a codeBehind for those templates, so I chose to follow what CodeProject had available.

     
    Can anyone point me in the right direction ?

    Regards
     

     

    Friday, May 16, 2008 10:48 AM

All replies

  • Hi:

      Could you paste your project for us to reproduce this problem?

    Thanks

    Monday, May 19, 2008 2:12 AM