DatePicker Template fails with latest version - calendar doesn't show

5 posts, 0 answers
  1. Chris
    Chris avatar
    53 posts
    Member since:
    Oct 2012

    Posted 02 Sep 2010 Link to this post

    Hi,

    After updating to the latest version of the controls for SIlverlight, clicking on the calendar image for the datepicker control doesn't display the calendar picklist to select a date. 

    This worked fine using version 603 (Q1 2010 SP2) version of the controls.

    The following is my control declaration:

                <telerikControls:RadDatePicker x:Name="DateOfBirthField"
                                               Margin="10,0,0,0"
                                               Width="100"
                                               Template="{StaticResource RadDatePickerControlTemplate}"
                                               telerik:StyleManager.Theme="Windows7"
                                               SelectedDate="{Binding Constituent.DateOfBirth, ConverterParameter=DateOnly, Mode=TwoWay}"
                                               SelectionChanged="DateOfBirthField_SelectionChanged"
                                                />


    The code below is my Control Template

        <ControlTemplate x:Key="RadDatePickerControlTemplate"
                         TargetType="telerikComboBox:RadDatePicker">
            <Grid x:Name="LayoutRoot">

                <VisualStateManager.VisualStateGroups>
                    <VisualStateGroup x:Name="CommonStates">
                        <VisualState x:Name="Disabled">
                            <Storyboard>
                                <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ButtonGrid"
                                                               Storyboard.TargetProperty="Visibility">
                                    <DiscreteObjectKeyFrame KeyTime="0:0:0"
                                                            Value="Collapsed" />
                                </ObjectAnimationUsingKeyFrames>
                                <DoubleAnimationUsingKeyFrames Storyboard.TargetName="MouseOverVisual"
                                                               Storyboard.TargetProperty="Opacity">
                                    <LinearDoubleKeyFrame KeyTime="0:0:0.050"
                                                          Value="0" />
                                </DoubleAnimationUsingKeyFrames>
                                <ObjectAnimationUsingKeyFrames Storyboard.TargetName="MouseOverVisual"
                                                               Storyboard.TargetProperty="Visibility">
                                    <DiscreteObjectKeyFrame KeyTime="0:0:0.50">
                                        <DiscreteObjectKeyFrame.Value>
                                            <Visibility>Collapsed</Visibility>
                                        </DiscreteObjectKeyFrame.Value>
                                    </DiscreteObjectKeyFrame>
                                </ObjectAnimationUsingKeyFrames>
                                <ObjectAnimationUsingKeyFrames Storyboard.TargetName="InputBox"
                                                               Storyboard.TargetProperty="Foreground">
                                    <DiscreteObjectKeyFrame KeyTime="0:0:0"
                                                            Value="{StaticResource TextBlock_Foreground_Disabled}" />
                                </ObjectAnimationUsingKeyFrames>
                            </Storyboard>
                        </VisualState>
                        <VisualState x:Name="Normal">
                            <Storyboard>
                                <DoubleAnimationUsingKeyFrames Storyboard.TargetName="MouseOverVisual"
                                                               Storyboard.TargetProperty="Opacity">
                                    <LinearDoubleKeyFrame KeyTime="0:0:0.150"
                                                          Value="0" />
                                </DoubleAnimationUsingKeyFrames>
                                <ObjectAnimationUsingKeyFrames Storyboard.TargetName="MouseOverVisual"
                                                               Storyboard.TargetProperty="Visibility">
                                    <DiscreteObjectKeyFrame KeyTime="0:0:0.150">
                                        <DiscreteObjectKeyFrame.Value>
                                            <Visibility>Collapsed</Visibility>
                                        </DiscreteObjectKeyFrame.Value>
                                    </DiscreteObjectKeyFrame>
                                </ObjectAnimationUsingKeyFrames>
                            </Storyboard>
                        </VisualState>
                        <VisualState x:Name="MouseOver">
                            <Storyboard>
                                <DoubleAnimationUsingKeyFrames Storyboard.TargetName="MouseOverVisual"
                                                               Storyboard.TargetProperty="Opacity">
                                    <LinearDoubleKeyFrame KeyTime="0:0:0.115"
                                                          Value="1" />
                                </DoubleAnimationUsingKeyFrames>
                                <ObjectAnimationUsingKeyFrames Storyboard.TargetName="MouseOverVisual"
                                                               Storyboard.TargetProperty="Visibility">
                                    <DiscreteObjectKeyFrame KeyTime="0:0:0">
                                        <DiscreteObjectKeyFrame.Value>
                                            <Visibility>Visible</Visibility>
                                        </DiscreteObjectKeyFrame.Value>
                                    </DiscreteObjectKeyFrame>
                                </ObjectAnimationUsingKeyFrames>
                                <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)"
                                                               Storyboard.TargetName="ButtonChrome">
                                    <DiscreteObjectKeyFrame KeyTime="0">
                                        <DiscreteObjectKeyFrame.Value>
                                            <Visibility>Visible</Visibility>
                                        </DiscreteObjectKeyFrame.Value>
                                    </DiscreteObjectKeyFrame>
                                </ObjectAnimationUsingKeyFrames>
                            </Storyboard>
                        </VisualState>
                        <VisualState x:Name="DropDownOpen">
                            <Storyboard>
                                <DoubleAnimationUsingKeyFrames Storyboard.TargetName="MouseOverVisual"
                                                               Storyboard.TargetProperty="Opacity">
                                    <LinearDoubleKeyFrame KeyTime="0:0:0.050"
                                                          Value="0" />
                                </DoubleAnimationUsingKeyFrames>
                                <ObjectAnimationUsingKeyFrames Storyboard.TargetName="MouseOverVisual"
                                                               Storyboard.TargetProperty="Visibility">
                                    <DiscreteObjectKeyFrame KeyTime="0:0:0.050">
                                        <DiscreteObjectKeyFrame.Value>
                                            <Visibility>Collapsed</Visibility>
                                        </DiscreteObjectKeyFrame.Value>
                                    </DiscreteObjectKeyFrame>
                                </ObjectAnimationUsingKeyFrames>
                            </Storyboard>
                        </VisualState>
                    </VisualStateGroup>
                    <VisualStateGroup x:Name="FocusStates">
                        <VisualState x:Name="Focused">

                        </VisualState>
                        <VisualState x:Name="Unfocused" />
                    </VisualStateGroup>
                    <VisualStateGroup x:Name="ValidationStates">
                        <VisualState x:Name="Valid" />
                        <VisualState x:Name="InvalidUnfocused">
                            <Storyboard>
                                <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ValidationTooltip"
                                                               Storyboard.TargetProperty="Visibility">
                                    <DiscreteObjectKeyFrame KeyTime="0:0:0">
                                        <DiscreteObjectKeyFrame.Value>
                                            <Visibility>Visible</Visibility>
                                        </DiscreteObjectKeyFrame.Value>
                                    </DiscreteObjectKeyFrame>
                                </ObjectAnimationUsingKeyFrames>
                            </Storyboard>
                        </VisualState>
                        <VisualState x:Name="InvalidFocused">
                            <Storyboard>
                                <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ValidationTooltip"
                                                               Storyboard.TargetProperty="Visibility">
                                    <DiscreteObjectKeyFrame KeyTime="0:0:0">
                                        <DiscreteObjectKeyFrame.Value>
                                            <Visibility>Visible</Visibility>
                                        </DiscreteObjectKeyFrame.Value>
                                    </DiscreteObjectKeyFrame>
                                </ObjectAnimationUsingKeyFrames>
                                <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ValidationTooltip"
                                                               Storyboard.TargetProperty="IsOpen">
                                    <DiscreteObjectKeyFrame KeyTime="0:0:0">
                                        <DiscreteObjectKeyFrame.Value>
                                            <System:Boolean>True</System:Boolean>
                                        </DiscreteObjectKeyFrame.Value>
                                    </DiscreteObjectKeyFrame>
                                </ObjectAnimationUsingKeyFrames>
                            </Storyboard>
                        </VisualState>
                    </VisualStateGroup>
                </VisualStateManager.VisualStateGroups>


                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*" />
                    <ColumnDefinition Width="Auto" />
                </Grid.ColumnDefinitions>

                <Border x:Name="MouseOverVisual"
                        Grid.ColumnSpan="2"
                        IsHitTestVisible="False"
                        Opacity="0"
                        Visibility="Collapsed"
                        CornerRadius="{StaticResource SplitButton_SpanCornerRadius}"
                        BorderThickness="{TemplateBinding BorderThickness}" />

                <telerik:PickerTextBox x:Name="InputBox"
                                       Padding="{TemplateBinding Padding}"
                                       IsReadOnly="{TemplateBinding IsReadOnly}"
                                       TabIndex="{TemplateBinding TabIndex}"
                                       HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
                                       VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
                                       Style="{StaticResource DateTextBox}"
                                       HorizontalAlignment="Stretch" />

                <telerik:RadToggleButton x:Name="ToggleButtonElement"
                                         MinWidth="15"
                                         Grid.Column="1"
                                         IsTabStop="False">

                    <telerik:RadToggleButton.Template>
                        <ControlTemplate TargetType="telerik:RadToggleButton"
                                         telerik:StyleManager.Theme="Windows7">
                            <ContentPresenter />
                        </ControlTemplate>
                    </telerik:RadToggleButton.Template>

                    <Grid Width="24"
                          x:Name="ButtonGrid">
                        <Telerik_Windows_Controls_Chromes:ButtonChrome x:Name="ButtonChrome"
                                                                       telerik:StyleManager.Theme="Windows7"
                                                                       Visibility="Collapsed" />
                        <Rectangle Margin="0"
                                   Width="20"
                                   Height="20">
                            <Rectangle.Fill>
                                <ImageBrush Stretch="Fill"
                                            ImageSource="/direcTORY;component/Images/Calendar.png" />
                            </Rectangle.Fill>
                        </Rectangle>


                    </Grid>
                </telerik:RadToggleButton>

                <Popup x:Name="PART_Popup">

                    <Grid x:Name="DropDownRoot">

                        <Telerik_Windows_Controls_Chromes:ShadowChrome telerik:StyleManager.Theme="Windows7"
                                                                       Margin="0 0 3 3" />

                        <telerikComboBox:RadCalendar x:Name="CalendarElement"
                                                     IsReadOnly="{TemplateBinding IsReadOnly}"
                                                     telerik:StyleManager.Theme="Windows7"
                                                     Margin="0 0 3 3" />
                    </Grid>
                </Popup>


                <Telerik_Windows_Controls_Chromes:ValidationTooltip x:Name="ValidationTooltip"
                                                                    Grid.ColumnSpan="2"
                                                                    Visibility="Collapsed"
                                                                    telerik:StyleManager.Theme="Windows7"
                                                                    DataContext="{Binding RelativeSource={RelativeSource TemplatedParent}}" />

            </Grid>


        </ControlTemplate>


    Thanks

    Chris



  2. Dani
    Admin
    Dani avatar
    848 posts

    Posted 03 Sep 2010 Link to this post

    Hi Chris,

    Thank you for sharing the difficulty you are experiencing.

    The reason why there is a problem  after your upgrade is that since our Q2 release (which was on 14th July ) we introduced a new control - RadDateTimePicker, which, in addition to being a separate control also shares the same template with both the RadDatePicker and RadTimePicker. In short, the Control Template for RadDatePicker has changed since 0603.

    You need to update your custom template to the latest source of the control.

    I can see that you are using the Windows7 theme. So, please find attached the latest default styles for RadDatepicker, Windows7 theme.

    If you need further assistance, please let me know.


    Best wishes,
    Dani
    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. Dani
    Admin
    Dani avatar
    848 posts

    Posted 03 Sep 2010 Link to this post

    Hello Chris,

    The attachement.

    All the best,
    Dani
    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
  5. Chris
    Chris avatar
    53 posts
    Member since:
    Oct 2012

    Posted 03 Sep 2010 Link to this post

    Hi Dani,

    Can you identify what is wrong in my template that it breaks?

    I tried creating a new template in Blend using the Edit Template, but it just created an empty template with no controls (ie. textbox, toggle button, etc. - the control parts within the template)

    I thought upgrading my dlls would not break any of my existing code, and for the most part it didn't except for the updated datepicker control.

    This is what we made the control look like (see attached)

    Any help would be greatly appreciated.

    Regards,

    Chris
  6. Kaloyan
    Admin
    Kaloyan avatar
    920 posts

    Posted 09 Sep 2010 Link to this post

    Hi Chris,

    Sorry for the late response. Which version of the controls are you using? I have edited the template without any problem and  I am using the latest internal build assemblies. 

    Best wishes,
    Kaloyan
    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