This is a migrated thread and some comments may be shown as answers.

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

4 Answers 126 Views
DatePicker
This is a migrated thread and some comments may be shown as answers.
Chris
Top achievements
Rank 1
Chris asked on 02 Sep 2010, 07:53 PM

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



4 Answers, 1 is accepted

Sort by
0
Dani
Telerik team
answered on 03 Sep 2010, 01:21 PM
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
0
Dani
Telerik team
answered on 03 Sep 2010, 01:23 PM
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
0
Chris
Top achievements
Rank 1
answered on 03 Sep 2010, 01:48 PM
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
0
Kaloyan
Telerik team
answered on 09 Sep 2010, 08:52 AM
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
Tags
DatePicker
Asked by
Chris
Top achievements
Rank 1
Answers by
Dani
Telerik team
Chris
Top achievements
Rank 1
Kaloyan
Telerik team
Share this question
or