Year Selection

5 posts, 0 answers
  1. Gabe
    Gabe avatar
    29 posts
    Member since:
    Mar 2011

    Posted 18 Apr 2011 Link to this post

    How do I set the RadDatePicker to have selection buttons that increment and decrement the year like the month selection buttons?
    So I would like to single select a data, but be able to switch the year, data and month quickly.
    How do I get this view ??
  2. Konstantina
    Admin
    Konstantina avatar
    2332 posts

    Posted 19 Apr 2011 Link to this post

    Hi Gabe,

    In order to add new buttons to the Calendar, you will have edit its style. Just drop a DatePicker control into the Expression Blend design surface, right-click it and choose from the menu Edit Template->Edit a Copy. Blend will generate all the needed resources. Find the RepeatButton with x:Name="MoveLeft" - this is the place where you can put your new buttons, which will switch the year. Then, you can create a Command which will increment/decrement the year, according to the current selected date (DisplayDate) and assign it to the newly added buttons.

    Hope this information helps.

    Best wishes,
    Konstantina
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  3. DevCraft banner
  4. Marshall
    Marshall avatar
    4 posts
    Member since:
    Aug 2012

    Posted 04 May 2011 Link to this post

    I am trying to do the same thing.  I was able to modify the control template pretty easily.

    <RepeatButton x:Name="MoveLeftYear" Grid.Column="0" Style="{StaticResource MoveLeftButtonStyle}"/>
    <RepeatButton x:Name="MoveLeft" Grid.Column="1" Style="{StaticResource MoveLeftButtonStyle}"/>
    <Button x:Name="Header" Grid.Column="2" Style="{StaticResource CalendarHeaderButton}"/>
    <RepeatButton x:Name="MoveRight" Grid.Column="3" Style="{StaticResource MoveRightButtonStyle}"/>
    <RepeatButton x:Name="MoveRightYear" Grid.Column="4" Style="{StaticResource MoveRightButtonStyle}"/>

    However, I'm having a problem wiring up the command.  It looks like normally one would find the button in OnApplyTemplate and then wire up a click event.  This is code that I've tried but it isn't getting me anywhere.  

    public class MyRadDatePicker : RadDatePicker
    {
        public override void OnApplyTemplate()
        {
            base.OnApplyTemplate();
      
            // This doesn't work.  moveLeftYearButton is always null.
            var moveLeftYearButton = GetTemplateChild("MoveLeftYear") as RepeatButton;
      
            // I can get to the Calendar but I can't get to the calendar MoveNext button
            var button = GetTemplateChild("PART_DropDownButton") as RadDropDownButton;
            if (button != null)
            {
                var calendar = (RadCalendar) (((Panel) button.DropDownContent).Children[0]);
            }
        }
    }

    Any help would be great! Thanks,
    -Marshall
  5. Marshall
    Marshall avatar
    4 posts
    Member since:
    Aug 2012

    Posted 04 May 2011 Link to this post

    Here is a little more info on what I'm trying to do and why I'm running into an issue.  I can wire up the two new buttons using Commanding like this:

    <RepeatButton x:Name="MoveLeftYear" Grid.Column="0" Style="{StaticResource MoveLeftButtonStyle}" Command="{Binding PreviousYearClickCommand}"/>
    <RepeatButton x:Name="MoveLeft" Grid.Column="1" Style="{StaticResource MoveLeftButtonStyle}"/>
    <Button x:Name="Header" Grid.Column="2" Style="{StaticResource CalendarHeaderButton}"/>
    <RepeatButton x:Name="MoveRight" Grid.Column="3" Style="{StaticResource MoveRightButtonStyle}"/>
    <RepeatButton x:Name="MoveRightYear" Grid.Column="4" Style="{StaticResource MoveRightButtonStyle}" Command="{Binding NextYearClickCommand}"/>

    public class MyRadDatePicker : RadDatePicker
    {
        public MyRadDatePicker()
        {
            PreviousYearClickCommand = new DelegateCommand<object>(OnPreviousYearClickCommandExecuted);
            NextYearClickCommand = new DelegateCommand<object>(OnNextYearClickCommandExecuted);
            DataContext = this;
        }
      
        public ICommand PreviousYearClickCommand { get; private set; }
        public ICommand NextYearClickCommand { get; private set; }
      
        private void OnPreviousYearClickCommandExecuted(object obj)
        {
            DisplayDate = DisplayDate.AddYears(-1);
        }
      
        private void OnNextYearClickCommandExecuted(object obj)
        {
            DisplayDate = DisplayDate.AddYears(1);
        }
    }

    And everything seems to work.  The problem though is I'm running into a DataContext issue.  In order for the Commanding to work I need to set my DataContext to the control in my constructor.  This is fine until I start implementing MVVM and use this new control on a form.  The field that I'm using it on now seems to be disconnected from its viewmodel.  So when the user changes the date the viewmodel doesn't know.  I suspect it is because I'm changing the DataContext.  Not sure.  What do you think?

    Thanks,
    -Marshall
  6. Pana
    Admin
    Pana avatar
    748 posts

    Posted 11 May 2011 Link to this post

    Hello,

    You could extend RadCalendar instead and modify the ControlTemplate of the RadCalendar to contain the buttons. Then you could bind the Command="{TemplateBinding NextYear}" without interfering the DataContext.

    Best wishes,
    Pana
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
Back to Top
DevCraft banner