25 WPF Calendars in one window, takes 5 seconds to open Window

Question

I'm new to WPF, and trying to get an idea of just how much slower it might be. I started a new WPF app, in Visual Studio 2010 (.NET 4), and created this XAML:

<Window x:Class="CalendarTest1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="800" Width="1000">
    <WrapPanel>
        <Calendar />
        <Calendar />
        <Calendar />
...repeats for a total of 25 calendar objects...
    </WrapPanel>
</Window>

When I run my application, in the IDE or not, it takes 5 seconds for the window to open. Once open, it redraws quickly (as I resize it) and everything seems snappy.

My PC isn't the fastest: AMD Dual Core 2.3GHz, 2GB RAM, XP 32-bit OS, on-board video.

I can place 25 buttons, instead of Calendars, and that loads in less than 1 second.

I'm trying to create something like the little month calendars in the day view in the MS Outlook calendar, like this:

So I was thinking I could use a WrapPanel and add/remove Calendar controls as it resizes. I might not need 25, but even with 9 or 12 it is slower than I would think (I have a legacy Win32 app that displays 18 calendars like this in less than 1 second).

My questions are:

Is the Calendar control slow because of a certain design -- either a bad design, or just not designed for this usage, or is it just slow because it is trying to display a lot of data/controls/info?

If I go to the trouble to create my own control, assuming I use a good design (general ideas welcome), can it be a lot faster, or is this just "typical" for WPF?

Is there something I can do to make the default Calendar control faster for this usage?

Answer 1

Not an answer per se, but adding this to Window.Resources reduced the load time 50% in my machine (which is now under 1 second for 25 calendars)

    <Window.Resources>
        <Style TargetType="CalendarDayButton">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="CalendarDayButton">
                        <ContentPresenter ContentSource="Content" Margin="2"/>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

        <Style TargetType="Calendar">
            <Setter Property="CalendarDayButtonStyle" Value="{StaticResource {x:Type CalendarDayButton}}"/>
        </Style>
    </Window.Resources>

Edit:

This visual change does not affect the control's functionality. All the Calendar's Day items are still Selectable, and you can bind the Calendar.SelectedDate property.

There's just no visual indication that an item is selected, therefore clicking on the days seems to do nothing.

Just add this to your ControlTemplate:

                <ControlTemplate TargetType="CalendarDayButton">
                    <ContentPresenter ContentSource="Content" Margin="2"/>

                    <ControlTemplate.Triggers>
                        <!-- Set The FontWeight to "Bold" when Selected -->
                        <Trigger Property="IsSelected" Value="True">
                            <Setter Property="FontWeight" Value="Bold"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>

You can play around with this ControlTemplate and its Triggers to add visual effects. Though keep in mind the more complex the template, the longer it will take to load.

Answer 2

This will give you an idea of what a calendar is versus a button using Snoop. Yes, we do expect a lot of calendars to take a lot more rendering time. If you need to use a lot of them, I'd attempt to create your own that's simpler and/or virtualize them

Heres a button, 3 children...

And heres a Calendar, 522 children. Notice each of the CalendarButtons I didn't expand still have 9 children each