RadControls for WPF, 2011.Q1
The attached project will be generated in this blog and will be used in future:
DOWNLOAD: RadScheduleView_StartUp.zip
This is probably the first post of a series that will guide you through RadScheduleView styling. We will try to use Blend as much as possible for the styling and designing part and VisualStudio 2010 for some of the code that we will need.
RadScheduleView requires the following references:
In the MainWindow select the “[grid]” element, find the RadScheduleView in the toolbox and double-click it:
Probably the view now does not look as you expected. You should be asked to set AppointmentsSource.
This part is thrilling. Blend provides a great support for property editing. We will create one little class that we will use as DataContext. Using MVVM you will probably have one. Add the following class to your project:
using
Telerik.Windows.Controls;
using
Telerik.Windows.Controls.ScheduleView;
namespace
RadScheduleView_DataTemplates
{
public
class
ViewModel
{
public
ViewModel()
{
this
.Appointments =
new
ObservableAppointmentCollection();
ResourceType rooms =
new
ResourceType(
"Room"
);
rooms.Resources.Add(
new
Resource(
"Room 101"
));
rooms.Resources.Add(
new
Resource(
"Room 203"
));
rooms.Resources.Add(
new
Resource(
"Room 304"
));
this
.ResourceTypes =
new
ResourceTypeCollection();
this
.ResourceTypes.Add(rooms);
this
.GroupDescription =
new
GroupDescriptionCollection();
this
.GroupDescription.Add(
new
DateGroupDescription());
this
.GroupDescription.Add(
new
ResourceGroupDescription() { ResourceType =
"Room"
});
}
public
ObservableAppointmentCollection Appointments {
get
;
private
set
; }
public
ResourceTypeCollection ResourceTypes {
get
;
private
set
; }
public
GroupDescriptionCollection GroupDescription {
get
;
private
set
; }
}
}
Do not forget to rebuild the project in blend (Ctrl + Shift + B).
Select the RadScheduleView in the Design Surface and go to “Properties” in the “Data Sources” property group. Click the small rectangle at the right end of “AppointmentsSource” property and select “Data Binding”:
Click the “+ CLR Object” in the dialog that will appear:
And create an instance of our ViewModel:
And select the AppointmentsSource as source for the binding for the RadScheduleView’s AppointmentsSource property:
Go on. Bind the “GroupDescriptionsSource” property to the “GroupDescription” of the ViewModel:
And the “ResourceTypesSource” to “ResourceTypes”:
There you go grouped:
So far you should have the following XAML:
<
Window
xmlns:telerik
=
"http://schemas.telerik.com/2008/xaml/presentation"
xmlns:local
=
"clr-namespace:RadScheduleView_DataTemplates"
mc:Ignorable
=
"d"
x:Class
=
"RadScheduleView_DataTemplates.MainWindow"
Title
=
"MainWindow"
Height
=
"350"
Width
=
"525"
>
<
Window.Resources
>
<
local:ViewModel
x:Key
=
"ViewModel"
d:IsDataSource
=
"True"
/>
</
Window.Resources
>
<
Grid
DataContext
=
"{Binding Source={StaticResource ViewModel}}"
>
<
telerik:RadScheduleView
d:LayoutOverrides
=
"Width, Height"
AppointmentsSource
=
"{Binding Appointments}"
GroupDescriptionsSource
=
"{Binding GroupDescription}"
ResourceTypesSource
=
"{Binding ResourceTypes}"
>
<
telerik:RadScheduleView.ViewDefinitions
>
<
telerik:DayViewDefinition
/>
<
telerik:WeekViewDefinition
/>
<
telerik:MonthViewDefinition
/>
<
telerik:TimelineViewDefinition
/>
</
telerik:RadScheduleView.ViewDefinitions
>
</
telerik:RadScheduleView
>
</
Grid
>
</
Window
>
A download should be available at the top of the page. This project will be use as base for the next RadScheduleView customization posts.