How to use ScheduleViewDataTemplateSelector dynamically

[Hardik]

Hi, I am using this class for showing appointment with different styles.
I want the things dynamically. 

I have created data template

<DataTemplate x:Key="FlexibleFinishedRecurrentAppointmentTemplate">
      <Border x:Name="XamlBorder"
                    BorderBrush="Black"
                    BorderThickness="0.5"
                    Margin="-2">
        <Border.Background>
          <LinearGradientBrush EndPoint="0.5,1"
                                     StartPoint="0.5,0">
            <GradientStop Color="#FF6F94C0"
                                  Offset="0.162" />
            <GradientStop Color="#FFBCD0E8"
                                  Offset="0.892" />
          </LinearGradientBrush>
        </Border.Background>
        <Grid>
          <ToolTipService.ToolTip>
            <StackPanel Orientation="Vertical"
                                    MaxWidth="225"
                                    MaxHeight="225">
              <StackPanel Orientation="Horizontal">
                <TextBlock Text="{Binding Start, StringFormat=\{0:HH:mm\}}" />
                <TextBlock Text="-" />
                <TextBlock Text="{Binding End, StringFormat=\{0:HH:mm\}}" />
              </StackPanel>
              <TextBlock Text="{Binding Subject}"
                                       TextWrapping="Wrap" />
            </StackPanel>
          </ToolTipService.ToolTip>
          <StackPanel Orientation="Horizontal"
                                HorizontalAlignment="Right"
                                VerticalAlignment="Bottom">
            <maestroBaseControls:XamlIconMT x:Name="XamlFlexibleImage" Foreground="{StaticResource ColorBrush5}"
                           Margin="0,0,1,4"
                           HorizontalAlignment="Right"
                           VerticalAlignment="Bottom"
                           Width="16"
                           Height="16"
                           XamlIconType="{Binding Text, Converter={StaticResource XamlImageSourceConverter}, ElementName=XamlFlexible}" />
            <TextBlock x:Name="XamlFlexible"
                               Text="Flexible"
                               Width="1000"
                               Visibility="Collapsed" />
            <maestroBaseControls:XamlIconMT x:Name="Xamlrecurrence" Foreground="{StaticResource ColorBrush5}"
                               Margin="0,0,4,4"
                               HorizontalAlignment="Right"
                               VerticalAlignment="Bottom"
                               Width="16"
                               Height="16"
                               XamlIconType="{Binding Text, Converter={StaticResource XamlImageSourceConverter}, ElementName=XamlRecurrence}" />
            <TextBlock x:Name="XamlRecurrence"
                               Text="Recurrence"
                               Width="1000"
                               Visibility="Collapsed" />

          </StackPanel>
          <TextBlock x:Name="XamlSubjectTextBlock"
                               Margin="7 0 18 0"
                               Width="{Binding Width, ElementName=XamlBorder}"
                               VerticalAlignment="Top"
                               HorizontalAlignment="Left"
                               TextTrimming="WordEllipsis"
                               Text="{Binding Subject}"
                               Foreground="Black"
                               TextWrapping="Wrap" />
        </Grid>
      </Border>
    </DataTemplate>

So many templates are there each template have same content except the things in Bold area. Image will be different for different template. 

---------------------------------------------------------------------------------------------------------------------------------------------------
TemplateSelector static resource.

<localScheduler:ReservationTemplateSelector x:Key="XamlItemTemplateSelector"
                                                    FlexibleFinishedRecurrentAppointmentTemplate="{StaticResource FlexibleFinishedRecurrentAppointmentTemplate}"
-----------------------------------------------------------------------------------------------------------------------------------------------------------------

-----------------------------------------------------------------------------------------------------------------------------------------------------------------
Binding in XAML 
<telerik:RadScheduleView x:Name="XamlRadScheduleView"
                                            AppointmentItemContentTemplateSelector="{StaticResource XamlItemTemplateSelector}"
/>
------------------------------------------------------------------------------------------------------------------------------------------------------------------

In TemplateSelector class I am using 

public override DataTemplate SelectTemplate(object item, DependencyObject container, ViewDefinitionBase activeViewDeifinition)
 {
  {if (ocu.Appointment != null)
      {
        if (actualEndTime != null)
        {
          return this.FlexibleFinishedRecurrentAppointmentTemplate;
        }
..........
.......
.........
......... (multiple conditions are there)

Now I have a problem with this structure. If I want to add one new template then I have to make changes in each and every template. As Template change is something like this
T1 - image1
T2 - image2
T3 - image1 image2
T4 - without image

So if I want to add one more template with Image3 then changes into templates are like this
T1 - image1
T2 - image2
T3 - image3
T4 - image1 and image2
T5 - image2 and image3
T6 - image1 and image3
T7 - Image1 and Image2 and Image3
T8 - without image.

So it goes in the n^2 manner, Is there any possibility that In XAML I use only one template and make changes into template run time one the basis of different condition.?


Thanks
h@rdik pancholi

[Yana]

Hello Hardik,

In order to create DataTemplates dynamically, you should first build the XAML string that describes it and then pass the string to XamlReader.Load, here is a simple example in the ScheduleViewDataTemplateSelector SelectTemplate method:

public override DataTemplate SelectTemplate(object item, DependencyObject container, ViewDefinitionBase activeViewDefinition)
{
    var newTemplate = (DataTemplate) XamlReader.Load(@"<DataTemplate
        xmlns='http://schemas.microsoft.com/client/2007'
        xmlns:x='http://schemas.microsoft.com/winfx/2006/xaml'>
        <TextBlock Foreground='Red' Text='{Binding Subject}' TextWrapping='Wrap' TextTrimming='WordEllipsis' />
        </DataTemplate>");
    return newTemplate;
}

You can use StringBuilder to build the different templates, here you can find an example.

Hope this helps.

Kind regards,
Yana
the Telerik team

[Hardik]

HI thanks Yana.

Actually I am facing problem here,

For example,
 I have

var newTemplate = (DataTemplate) XamlReader.Load(@"<DataTemplate
        xmlns='http://schemas.microsoft.com/client/2007' 
        xmlns:x='http://schemas.microsoft.com/winfx/2006/xaml'>
        <TextBlock Foreground='Red' Text='{Binding Subject}' TextWrapping='Wrap' TextTrimming='WordEllipsis' />
        <TextBlock Foreground='Black' Text='{Binding Subject}' TextWrapping='Wrap' TextTrimming='WordEllipsis' />
        </DataTemplate>");
    return newTemplate;

Now I want to change the TextBlock  "Foreground" on basis of condition. How can I do that?

I tried this one.

 DataTemplate newTemplate = (DataTemplate)XamlReader.Load(@"<DataTemplate
        xmlns='http://schemas.microsoft.com/client/2007' 
        xmlns:x='http://schemas.microsoft.com/winfx/2006/xaml'>
        <TextBlock x:Name='Test' Foreground='Red' Text='{Binding Subject}' TextWrapping='Wrap' TextTrimming='WordEllipsis' />
  <TextBlock  x:Name='ABC' Foreground='Black' Text='{Binding Subject}' TextWrapping='Wrap' TextTrimming='WordEllipsis' />
        </DataTemplate>");

      FrameworkElement element = newTemplate.LoadContent() as FrameworkElement;

      if (element.FindName("Test") != null)
      {
        ((TextBlock)element).Foreground= new SolidColorBrush(Colors.Blue);;
      }

      return newTemplate ;

But this is not working.

Thanks
h@rdik pancholi

[Yana]

Hi Hardik,

You could try it like this:

var color = "Blue";

var newTemplate = (DataTemplate) XamlReader.Load(@"<DataTemplate
    xmlns='http://schemas.microsoft.com/client/2007'
    xmlns:x='http://schemas.microsoft.com/winfx/2006/xaml'>
    <TextBlock Foreground='" + color + @"' Text='{Binding Subject}' TextWrapping='Wrap' TextTrimming='WordEllipsis' />
    </DataTemplate>");
return newTemplate;

All the best,
Yana
the Telerik team

[Hardik]

Thanks Yana,

This is working.

But I am thinking other solution for my case.

As I had defined in first thread when multiple templates will be there it will cause problem on development.
 See my case is like this, I have 2 images and I need templates with combination of those images. So I will have 2^2 = 4 templates.

Template1 - Image1
Template2 - Image2
Template3 - Image1 and Image2
Template4 - No image

This development is done. Now let's assume my requirement gets changed and I need one more image. So now I will have 2^3 = 8 templates.

Template1 - Image1
Template2 - Image2
Template3 - Image3
Template4 - Image1 and Image2
Template5 - Image2 and Image3
Template6 - Image1 and Image3
Template7 - Image1 and Image2 and Image3
Template8 - No image

This work is very tedious as number of images increased. Here I not only images but other controls might be there. Here Appointments with different color also there.

So what I thought is I will create on common Template in which my all controls will be there, and as per my condition I want to hide control from this common template. With this image color of control also different. 

Like
Tempalate1 - Image1 and red color
Tempalate2 - Image1 and blue color

etc.......


What can be the easiest way to make this dynamic? So when any change into template I don't have to do any complex coding.

Thanks in advance
H@rdik Pancholi

[Yana]

Hi Hardik,

Yes, you could have one template with all the images and bind their Visibility property, so that it is switched according to the appointment's properties ( you could use a ValueConverter).

All the best,
Yana
the Telerik team

[Hardik]

Hi yana,

Its working for me.

Thanks
H@rdik Pancholi