Setting Tooltips for a particular Date

[Kiran]

Hi

Is it possible to show tooltip for particular dates in a month. I can set tooltip at control level but i need to set tooltip at an individual date level.

Thanks
Kiran

[Konstantina]

Hello Kiran,

Thank you for contacting us.

You can achieve that by editing the ControlTemplate of the Calendar in Expression Blend and then put a ToolTip to the DayButton element. You can find more information in this forum post: http://www.telerik.com/community/forums/silverlight/calendar/tooltip-for-selected-dates.aspx

If you need further assistance please let us know.

Regards,
Konstantina
the Telerik team

[Kiran]

Hi

Is it possible to do it programmatically in code behind. Basically I have a dictionary object and I need to show the tooltip for the date which matches item in the dictionary object.

Dictionary<DateTime, string> dayToolTips = new Dictionary<DateTime, string>();

Regards
Kiran

[George]

Hi Kiran,

Yes, you could accomplish this easily. I would suggest you to use a Converter that converts the DateTime key in your Dictionary and returns the string value. 

I hope this helps!

Kind regards,
George
the Telerik team

[Kiran]

Hi

Thanks for your reply but how do i know which day to show tooltip. I was trying to define a custom class like this

class ButtonStyleSelector : StyleSelector
{

        Dictionary<DateTime, string> _dayToolTips;
        public ButtonStyleSelector()
        {
        }

        public ButtonStyleSelector(Dictionary<DateTime, string> dayToolTips)
        {
            _dayToolTips = dayToolTips;
        }

        public override Style SelectStyle(object item, DependencyObject container)
        {
            CalendarButtonContent content = item as CalendarButtonContent;
            if (_dayToolTips == null)
                return DefaultStyle;
            if(_dayToolTips.ContainsKey(content.Date))
            {
                return TooltipButtonStyle;
            }
            return DefaultStyle;

        }
        public Style DefaultStyle
        {
            get;
            set;
        }
        public Style TooltipButtonStyle
        {
            get;
            set;
        }
}

 
I have defined a custom class for DayTemplateSelector and using it like this

_toolTipStyle = new ButtonStyleSelector(dayToolTips);
RadCalendar.DayButtonStyleSelector = _toolTipStyle;

My problem is what do return as TooltipButtonStyle so that ToolTip appears for matching date in the calendar. I need to do it using code only.

Regards
Kiran

[Pana]

Hi Kiran,

Check the attached project. It has some comments to guide you through the process. You have to set the DayButtonStyle of the calendar to Null in order to make the StyleSelector work. The style selector then adds tooltip on the container depending on the ViewModel parsed as content for the button. Using the button type property you can determine if it is a week header button, day button (I suppose these are the one you want to attached tooltips on) or something else.

Whatever the case in the attached project the tooltip is set to the DayOfWeek of the date content of the button. You can pretty easy use that day for lookup in your dictionary. I believe given a working project with the style selector you will be able to adjust it to work for your scenario.

Best of luck and thanks for you interest in our controls.

All the best,
Panayot
the Telerik team

[Kiran]

Hi

Great it works. Is there a way i can make it work for SL version also. Only problem I have is that control does not have tooltip property directly in SL.

control.ToolTip = new ToolTip() { Content = _ToolTips[content.Date] };

Is there any SL alternative for this?

Regards
Kiran

[Pana]

Hello Kiran,

In Silverlight:

ToolTipService.SetToolTip(control, _ToolTips[content.Date]);

The tooltip in SL is defined pretty much like attached behavior. IMO this keeps the Control's API cleaner.

P.S. Now as I think of it you should be able to set "control.ToolTip = _ToolTips[content.Date]" in WPF.

Greetings,
Panayot
the Telerik team

[Michel]

Hi,

I looked at the sample provided by Telerik. Unfortunately, I want to set a Tooltip AND set a particular style for specified dates.

Everything is as usual until the style gets applied I have this error message:

Here's what I use:

<local:CalendarStyleSelector x:Key="CalendarStyleSelector">
    <local:CalendarStyleSelector.DefaultStyle>
        <Style TargetType="CalendarButton">
            <Setter Property="Background" Value="White" />
        </Style>
    </local:CalendarStyleSelector.DefaultStyle>

    <local:CalendarStyleSelector.EventStyle>
        <Style TargetType="CalendarButton">
            <Setter Property="Background" Value="Orange" />
        </Style>
    </local:CalendarStyleSelector.EventStyle>
</local:CalendarStyleSelector>

Then in code behind:

var calendarStyleSelector = Resources["CalendarStyleSelector"] as CalendarStyleSelector;

if (calendarStyleSelector != null)
{
    calendarStyleSelector.EventsCollection = _events1;
    calendar1.DayButtonStyleSelector = calendarStyleSelector;
}

When styles are applied, I get this:

System.InvalidOperationException was unhandled by user code
  Message=A style intended for type 'CalendarButton' cannot be applied to type 'CalendarButton'.
  Source=PresentationFramework
  StackTrace:
       at System.Windows.Controls.ItemsControl.ApplyItemContainerStyle(DependencyObject container, Object item)
       at System.Windows.Controls.ItemsControl.MS.Internal.Controls.IGeneratorHost.PrepareItemContainer(DependencyObject container, Object item)
       at System.Windows.Controls.ItemContainerGenerator.System.Windows.Controls.Primitives.IItemContainerGenerator.PrepareItemContainer(DependencyObject container)
       at System.Windows.Controls.Panel.GenerateChildren()

My guess is I need to specify that it's a "Telerik" CalendarButton, but how ?

We are using version: 2012.1.326.40

Thanks,

Michel

[Michel]

Fixed the problem but styles don't work all the tiem, the Style Selector does not get called for Day buttons on simple reload of the data source, so the tooltip method proposed does not work.

Well, never mind this approach, I am using the SelectedDates in ReadOnly instead.

Still buggy but much simpler. The calendars have a "disabled" look after a refresh but if you move the cursor over the control, all dates get their "normal" look again... weird...

Michel