How to.... custom control

How to.... custom control

Hi

here are parts of my custom control :

in Generic.xaml:

<ResourceDictionary      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"      xmlns:vsm="clr-namespace:System.Windows;assembly=System.Windows"      xmlns:sys="clr-namespace:System;assembly=mscorlib"      xmlns:local="clr-namespace:DataPager.DataPagerControl">            <Style x:Key="CustomTextBlock" TargetType="TextBlock">          <Setter Property="HorizontalAlignment" Value="Center"/>          <Setter Property="FontSize" Value="20"/>          <Setter Property="VerticalAlignment" Value="Center"/>          <Setter Property="Foreground" Value="SlateGray"/>       </Style>            <Style x:Key="PagerButton" TargetType="ToggleButton">          <Setter Property="Template">              <Setter.Value>                  <ControlTemplate x:Key="RoundedButton5" TargetType="ToggleButton">                      <Grid>                          <vsm:VisualStateManager.VisualStateGroups>                              <vsm:VisualStateGroup x:Name="FocusStates">                                  <vsm:VisualState x:Name="Unfocused"/>                                  <vsm:VisualState x:Name="Focused"/>                              </vsm:VisualStateGroup>                              <vsm:VisualStateGroup x:Name="CommonStates">                                  <vsm:VisualState x:Name="MouseOver">                                      <Storyboard>                                          <ColorAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="eli" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)">                                              <SplineColorKeyFrame KeyTime="00:00:00" Value="SlateGray"/>                                              <SplineColorKeyFrame KeyTime="00:00:01" Value="SlateGray"/>                                          </ColorAnimationUsingKeyFrames>                                      </Storyboard>                                  </vsm:VisualState>                                  <vsm:VisualState x:Name="Pressed">                                      <Storyboard>                                          <ColorAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="eli" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)">                                              <SplineColorKeyFrame KeyTime="00:00:00" Value="DarkBlue"/>                                              <SplineColorKeyFrame KeyTime="00:00:01" Value="DarkBlue"/>                                          </ColorAnimationUsingKeyFrames>                                      </Storyboard>                                  </vsm:VisualState>                                  <vsm:VisualState x:Name="Checked">                                      <Storyboard>                                          <ColorAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="eli" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)">                                              <SplineColorKeyFrame KeyTime="00:00:00" Value="DarkBlue"/>                                              <SplineColorKeyFrame KeyTime="00:00:01" Value="DarkBlue"/>                                          </ColorAnimationUsingKeyFrames>                                      </Storyboard>                                  </vsm:VisualState>                                  <vsm:VisualState x:Name="Disabled"/>                                  <vsm:VisualState x:Name="Normal"/>                              </vsm:VisualStateGroup>                          </vsm:VisualStateManager.VisualStateGroups>                          <Canvas>                              <Ellipse x:Name="eli"                                        Width="30"                                        Height="30"                                         Stroke="Transparent"                                       Canvas.Left="7"                                        Canvas.Top="7">                                  <Ellipse.Fill>                                      <RadialGradientBrush >                                          <GradientStop Offset="0.2" Color="Transparent"/>                                          <GradientStop Offset="1" Color="Transparent" />                                      </RadialGradientBrush>                                  </Ellipse.Fill>                              </Ellipse>                              <TextBlock Style="{StaticResource CustomTextBlock}" Text=???? Canvas.Top="7" Canvas.Left="16" />                          </Canvas>                      </Grid>                  </ControlTemplate>              </Setter.Value>          </Setter>        </Style>            <Style TargetType="local:Pager">          <Setter Property="Template">              <Setter.Value>                  <ControlTemplate TargetType="local:Pager">                      <Border Background="{TemplateBinding Background}"                              BorderBrush="{TemplateBinding BorderBrush}"                              BorderThickness="{TemplateBinding BorderThickness}"                              Width="500"                              Height="50">                          <Grid>                              <Grid.ColumnDefinitions>                                  <ColumnDefinition/>                                  <ColumnDefinition/>                                  <ColumnDefinition/>                                  <ColumnDefinition/>                                  <ColumnDefinition/>                                  <ColumnDefinition/>                                  <ColumnDefinition/>                                  <ColumnDefinition/>                                  <ColumnDefinition/>                              </Grid.ColumnDefinitions>                              <Button Style="{StaticResource FullBackButton}" Background="Aqua"/>                               <Button Grid.Column="1" Style="{StaticResource BackwardsButton}" Background="Aqua"/>                              <ToggleButton x:Name="One" Grid.Column="2" Command="{Binding FirstPageCommand}" Style="{StaticResource PagerButton}" Background="Aqua"/>                              <ToggleButton x:Name="Two" Grid.Column="3" Style="{StaticResource PagerButton}" Background="Aqua"/>                              <ToggleButton x:Name="Three" Grid.Column="4" Style="{StaticResource PagerButton}" Background="Aqua"/>                              <ToggleButton x:Name="Four" Grid.Column="5" Style="{StaticResource PagerButton}" Background="Aqua"/>                              <ToggleButton x:Name="Five" Grid.Column="6" Style="{StaticResource PagerButton}" Background="Aqua"/>                               <Button Grid.Column="7" Style="{StaticResource ForwardsButton}" Background="Aqua"/>                              <Button Grid.Column="8" Style="{StaticResource FullEndButton}" Background="Aqua"/>                          </Grid>                      </Border>                  </ControlTemplate>              </Setter.Value>          </Setter>      </Style>  </ResourceDictionary>

and the Pager.cs :

using System;  using System.Net;  using System.Windows;  using System.Windows.Controls;  using System.Windows.Documents;  using System.Windows.Ink;  using System.Windows.Input;  using System.Windows.Media;  using System.Windows.Media.Animation;  using System.Windows.Shapes;  using System.Collections;  using System.Windows.Controls.Primitives;    namespace DataPager.DataPagerControl  {      [TemplateVisualState(Name = "Normal", GroupName = "CommonStates")]      [TemplateVisualState(Name = "MouseOver", GroupName = "CommonStates")]      [TemplateVisualState(Name = "Pressed", GroupName = "CommonStates")]      [TemplateVisualState(Name = "Checked", GroupName = "CommonStates")]      public class Pager : Control      {          public static DependencyProperty BorderThickProperty;          public static DependencyProperty ItemsSourceProperty;          private ToggleButton tb;            private ToggleButton _one;          private ToggleButton _two;          private ToggleButton _three;          private ToggleButton _four;          private ToggleButton _five;            private string _currentTbChecked = "";     public Pager()          {              this.DefaultStyleKey = typeof(Pager);              BorderThickProperty = DependencyProperty.Register("BorderThick", typeof(int), typeof(Pager), new PropertyMetadata(15));              ItemsSourceProperty = DependencyProperty.Register("ItemsSource", typeof(IEnumerable), typeof(Pager), new PropertyMetadata(null));          }    public override void OnApplyTemplate()          {              base.OnApplyTemplate();              _one = GetTemplateChild("One") as ToggleButton;              _two = GetTemplateChild("Two") as ToggleButton;              _three = GetTemplateChild("Three") as ToggleButton;              _four = GetTemplateChild("Four") as ToggleButton;              _five = GetTemplateChild("Five") as ToggleButton;                               _one.Checked += new RoutedEventHandler(_one_Checked);              _two.Checked += new RoutedEventHandler(_two_Checked);              _three.Checked += new RoutedEventHandler(_three_Checked);              _four.Checked += new RoutedEventHandler(_four_Checked);              _five.Checked += new RoutedEventHandler(_five_Checked);          }  void _five_Checked(object sender, RoutedEventArgs e)          {}  void _four_Checked(object sender, RoutedEventArgs e)          {}  void _three_Checked(object sender, RoutedEventArgs e)          {}  void _two_Checked(object sender, RoutedEventArgs e)          {}  void _one_Checked(object sender, RoutedEventArgs e)          {}        }  }

I would like to set the all toggle buttons content on each one of tuggle button checked (or IsChecked == true) . how can mange the toggle buttons content within the control iteself, while the toggle buttons text is set in its style ? 

T H A N K S

Answers & Comments...

Answer: 1

You have almost done it - you just need to reference the toggle buttons in your code i.e. where you have 

[TemplateVisualState(Name = "Checked", GroupName = "CommonStates")]

add the template reference for the buttons i.e

[TemplatePart(Name = "One", Type = typeof(ToggleButton))]

and then in onApplyTemplate add: _one.Ischecked = true;

Another easier method is just to put the amend your xmal code:

From: <ToggleButton x:Name="One" Grid.Column="2" Command="{Binding FirstPageCommand}" Style="{StaticResource PagerButton}" Background="Aqua"/>  

To:<ToggleButton x:Name="One" IsChecked= "True" Grid.Column="2" Command="{Binding FirstPageCommand}" Style="{StaticResource PagerButton}" Background="Aqua"/>

---