AppointmentTemplate with Custom Data Type

[Chris Parker]

Hi,

Is it possible to use a custom data type for the DataTemplate so that I can display images along with subject, etc. Right now it appears the AppointmentTemplate DataTemplate is always of type SchedulerAppointment which doesn't allow binding of custom properties from my Meetings class.

[Vishal Omprasad]

Hi Chris,

Regarding “AppointmentTemplate with custom data”:

Your requirement of obtaining the custom data object's value in the DataTemplate can be achieved with the help of the DataItem property in the SfScheduler. Please refer to the following code snippet for your reference.

[C#]:

public class Meeting

{

    public DateTime From { get; set; }

    public DateTime To { get; set; }

    public bool IsAllDay { get; set; }

    public string EventName { get; set; }

    public TimeZoneInfo StartTimeZone { get; set; }

    public TimeZoneInfo EndTimeZone { get; set; }

    public Brush Background { get; set; }

    public Color TextColor { get; set; }

    public string Notes { get; set; }

    public string Location { get; set; }

}

[XAML]:

<Grid.Resources>

    <DataTemplate x:Key="dayAppointmentTemplate">

        <Grid>

            <Grid.RowDefinitions>

                <RowDefinition Height="0.1*" />

                <RowDefinition Height="0.9*" />

            </Grid.RowDefinitions>

            <Grid Grid.Row="0"

                  Background="{Binding DataItem.Background}"

                  IsClippedToBounds="True">

                <Label Text="{Binding DataItem.EventName}"

                       VerticalOptions="Center"

                       TextColor="White"

                       LineBreakMode="WordWrap"

                       MaxLines="1"

                       FontSize="Caption"

                       FontAttributes="Bold"

                       Margin="5,5,5,0" />

            </Grid>

            <Grid Grid.Row="1"

                  Background="{Binding DataItem.Background}"

                  Opacity="0.8"

                  IsClippedToBounds="True">

                <Label Text="{Binding DataItem.Notes}"

                       VerticalOptions="Start"

                       Grid.Row="1"

                       TextColor="White"

                       LineBreakMode="WordWrap"

                       Margin="3,3,3,0"

                       FontSize="10" />

            </Grid>

        </Grid>

    </DataTemplate>

</Grid.Resources>

 

<Grid.BindingContext>

    <local:Meeting />

</Grid.BindingContext>

<scheduler:SfScheduler x:Name="scheduler"

                       View="Week">

    <scheduler:SfScheduler.DaysView>

        <scheduler:SchedulerDaysView AppointmentTemplate="{StaticResource dayAppointmentTemplate}" />

    </scheduler:SfScheduler.DaysView>

    <scheduler:SfScheduler.AppointmentMapping>

        <scheduler:SchedulerAppointmentMapping Subject="EventName"

                                               StartTime="From"

                                               EndTime="To"

                                               Background="Background"

                                               IsAllDay="IsAllDay"

                                               StartTimeZone="StartTimeZone"

                                               EndTimeZone="EndTimeZone"

                                               TextColorMapping="TextColor" />

    </scheduler:SfScheduler.AppointmentMapping>

</scheduler:SfScheduler>

We have prepared an example sample demonstrating the above code snippet and attached below. Please refer to the sample and let us know whether your requirement is achieved.

Please note that, in the sample we have added DataTemplate only for Week view.

If you have any further questions or require assistance with any other aspect, please do not hesitate to let us know. We are here to help.

Regards,

Vishal O.

Attachment: SchedulerAppointmentDemo_a789b8f0.zip