Home Products Downloads Purchase Support Forum About Blog

How to add a control in OutlookPane for Silverlight

by viblend 23. March 2010 05:07

In the new release of VIBlend Controls for Silverlight, we added several new controls. One of them is the OutlookPane control. In this blog post we show you how to add any control as a content to it.

At first you need to add references to the NavigationPanes.dll, VIBlendUtilities.dll and Extensions.dll in order to use the OutlookPane and Calendar controls. Then you should create the DataTemplates for the OutlookPane items. The CalendarTemplate simply adds an Image on the left side of a TextBlock. In the source code below, this template is used to define the look of the OutlookPaneItem’s header. The other data template is the ShortCalendarTemplate which is used when the OutlookPaneItem is collapsed or  shown in the OutlookPane’s status area.  After the creation of the DataTemplates,  you should add a new instance of the OutlookPane control and insert a new OutlookPaneItem to it. Finally, put a new Calendar control as a content of the OutlookPaneItem.

Source Code:

<Grid x:Name="LayoutRoot">
            <DataTemplate x:Name="CalendarTemplate">
              <StackPanel Orientation="Horizontal">
                    <Image Margin="2" Width="18" HorizontalAlignment="Left" Height="18" Source="calendarIcon.png"></Image>
                    <TextBlock Grid.Column="1" VerticalAlignment="Center" HorizontalAlignment="Left" FontWeight="Bold" Text="Calendar"></TextBlock>
            <DataTemplate x:Name="ShortCalendarTemplate">
                <Image Margin="2" Width="18" HorizontalAlignment="Left" Height="18" Source="calendarIcon.png"></Image>
        <viblend:OutlookPane Width="250" Height="300" VerticalAlignment="Center" HorizontalAlignment="Center">
                <viblend:OutlookPaneItem IsSelected="True" MenuItemHeader="Calendar" CollapsedDefaultHeaderTemplate="{StaticResource ShortCalendarTemplate}" 
                                             CollapsedStatusContentTemplate="{StaticResource ShortCalendarTemplate}"
                                             DefaultHeaderTemplate="{StaticResource CalendarTemplate}"
                <toolkit:Calendar VerticalAlignment="Center" HorizontalAlignment="Center"></toolkit:Calendar>

Here is the result:

Comments are closed

About the author

Some text that describes me

Tag cloud

Recent comments

Comment RSS
Copyright © 2011 VIBlend  
Terms of Use | Privacy Policy
WinForms Controls Purchase Online About Us
DataGrid Navigation Pane Technical Support Blog
ScrollBar TreeView
ListBox ProgressBar Downloads Register
ComboBox Buttons
TabControl Editors Documentation Client Login

VIBlend Blog is powered by BlogEngine.NET