Customizing ScheduleView TimeLinew View

[sravan]

Hi 

Is it possible to disable the time grouping in scheduleview timeline view i have added the an attachment for the reference.

please help me in this point


Regards,
sekhar.

[Scott]

I did that by looking for

 

<

 

 

Style x:Key="MajorHorizontalTimeRulerItemStyle" TargetType="local:TimeRulerItem">

 

Change this line from this

<

 

 

Border BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="{TemplateBinding BorderBrush}" Background="{TemplateBinding Background}">

 

to this

<

 

 

Border BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="{TemplateBinding BorderBrush}" Background="{TemplateBinding Background}" Visibility="Collapsed">

 

 

[sravan]

Hi Scott,

Please can you explain where can i place that code in the my xaml when i copy that code in my application it is raising exception..

here is my xaml code

i want to hide the time lines in the header.

also how can i change the background color of a particular day like sunday saturdays and holidays with different colors.
 please can you help me in this part.

<UserControl x:Class="DemosAdvancedScheduler.advancedScheduler"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
xmlns:schedule="clr-namespace:Telerik.Windows.Controls.ScheduleView;assembly=Telerik.Windows.Controls.ScheduleView"
xmlns:scheduleView="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.ScheduleView"
xmlns:local="clr-namespace:DemosAdvancedScheduler"
xmlns:telerikQuickStart="clr-namespace:Telerik.Windows.Controls.QuickStart;assembly=Telerik.Windows.Controls">
    <UserControl.Resources>
        <local:ViewModel x:Key="ViewModel" />
        <SolidColorBrush x:Key="MainBackground" Color="#FF000000" />
        <LinearGradientBrush x:Key="SubHeadingBackground" EndPoint="0.5,1" MappingMode="RelativeToBoundingBox"
StartPoint="0.5,0">
            <GradientStop Color="#FF4B4B4B" Offset="1" />
            <GradientStop Color="#FF6E6E6E" />
        </LinearGradientBrush>
        <LinearGradientBrush x:Key="SelectionOptionBackground" EndPoint="0.5,1" StartPoint="0.5,0">
            <GradientStop Color="#FF1E1E1E" Offset="0" />
            <GradientStop Color="#FF040404" Offset="1" />
        </LinearGradientBrush>
        <SolidColorBrush x:Key="SelectionOptionBorderBrush" Color="#FF313132" />
        <Style x:Key="SelectionOptionStyle" TargetType="Border">
            <Setter Property="Background" Value="{StaticResource SelectionOptionBackground}" />
            <Setter Property="BorderBrush" Value="{StaticResource SelectionOptionBorderBrush}" />
            <Setter Property="BorderThickness" Value="1 0 1 1" />
            <Setter Property="MinHeight" Value="70" />
        </Style>


        <!--<Style x:Key="MajorHorizontalTimeRulerItemStyle" TargetType="local:TimeRulerItem"></Style>-->


    </UserControl.Resources>


    <Grid DataContext="{StaticResource ViewModel}">
        <Grid.Resources>
            <ItemsPanelTemplate x:Key="GroupHeaderSelectTemplate">
                
            </ItemsPanelTemplate>
            <!--<DataTemplate x:Key="GroupHeaderSelectTemplate">
                <TextBlock Text="{Binding Path=Appointment.Resources.ResourceName}"></TextBlock>
            </DataTemplate>-->
        </Grid.Resources>
        <Grid.RowDefinitions>
            <RowDefinition Height="32" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="225" />
            <ColumnDefinition />
        </Grid.ColumnDefinitions>
        <Border Grid.RowSpan="2" Grid.ColumnSpan="2"></Border>
        <!--telerikQuickStart:ThemeAwareBackgroundBehavior.IsEnabled="True" />-->


        <Border Background="#FF212121" Grid.RowSpan="2" />


        <Border Background="{StaticResource MainBackground}" Grid.ColumnSpan="2">
            <TextBlock Text="Grouping and Filtering"  FontFamily="Segoe UI"
HorizontalAlignment="Left" Foreground="#FFE5E2E2" Margin="13 0 0 0" FontSize="16" TextWrapping="Wrap"
VerticalAlignment="Center" />
        </Border>


        <StackPanel Grid.Row="1" Orientation="Vertical">
            <Border Background="{StaticResource SubHeadingBackground}" Height="32">
                <TextBlock Text="Select a Layer" TextWrapping="Wrap" FontSize="13" Foreground="#FFEBE9E9"
FontFamily="Segoe UI" VerticalAlignment="Center" Margin="13 0 0 0" />
            </Border>
            <Border Background="{StaticResource MainBackground}" Height="32">
                <CheckBox IsChecked="{Binding EnableGrouping, Mode=TwoWay}" Content="Enable Grouping"
Foreground="#FFA9A9A9" FontWeight="Normal"
Margin="13 0 0 0" VerticalAlignment="Center" />
            </Border>
            <!--<Border BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="{TemplateBinding BorderBrush}" Background="{TemplateBinding Background}" Visibility="Collapsed"></Border>-->


            <ItemsControl Name="lstResources" ItemsSource="{Binding}">
                <ItemsControl.ItemTemplate>
                    <DataTemplate>
                        <Border Style="{StaticResource SelectionOptionStyle}">
                            <StackPanel Orientation="Horizontal" Margin="5">
                                <!--<Image Source="../../Images/Scheduler/GroupingAndFiltering/architecture.png" Stretch="UniformToFill" Width="24" Height="13" Margin="10 5 0 5" />-->
                                <CheckBox IsChecked="{Binding IsFilter, Mode=OneWay}" Content="{Binding Path=ResourceName}" IsEnabled="{Binding EnableGrouping}"
 Foreground="#FFA9A9A9" Click="CheckBox_Checked" VerticalAlignment="Center" Margin="10" Padding="10 0 0 0"/>
                            </StackPanel>
                        </Border>
                    </DataTemplate>
                </ItemsControl.ItemTemplate>
            </ItemsControl>
        </StackPanel>


        <scheduleView:RadScheduleView Grid.Column="1" Grid.Row="1" SnapAppointments="True"
GroupDescriptionsSource="{Binding GroupDescriptions}" GroupHeaderContentTemplateSelector="{Binding GroupHeaderSelectTemplate}"
ActiveViewDefinitionIndex="1" x:Name="RadView">
            <scheduleView:RadScheduleView.ViewDefinitions>
                <scheduleView:DayViewDefinition GroupFilter="{Binding GroupFilter}" Orientation="Horizontal" />
                <scheduleView:WeekViewDefinition GroupFilter="{Binding GroupFilter}" Orientation="Horizontal" />
                <scheduleView:MonthViewDefinition GroupFilter="{Binding GroupFilter}"  StretchGroupHeaders="False"/>
                <scheduleView:TimelineViewDefinition GroupFilter="{Binding GroupFilter}" />
            </scheduleView:RadScheduleView.ViewDefinitions>
            <scheduleView:RadScheduleView.ResourceTypesSource>
                <scheduleView:ResourceTypeCollection>
                    <scheduleView:ResourceType Name="Category">
                        <!--<scheduleView:Resource ResourceName="Business Layer" />
                        <scheduleView:Resource ResourceName="Data layer" />
                        <scheduleView:Resource ResourceName="Presentation Layer" />
                        <scheduleView:Resource ResourceName="Best Practices" />
                        <scheduleView:Resource ResourceName="Architecture" />-->
                    </scheduleView:ResourceType>
                </scheduleView:ResourceTypeCollection>
            </scheduleView:RadScheduleView.ResourceTypesSource>
        </scheduleView:RadScheduleView>


    </Grid>
</UserControl>


regards,
sekhar.

[Pana]

Hi,

To change the background you can use SpecialSlots. In the attached example a SpecialSlots collection is set and a custom StyleSelector is switching styles for the different custom Slots.

To edit the timeruler you can edit the TimeRulerItemTemplateSelector and TimeRulerItemStyleSelectors. I have added the complete RadScheduleView style and moved the required resources in the MainPage of the project. The major and minor horizontal time ruler items have changed data and control templates.

Best wishes,
Pana
the Telerik team

[sravan]

Thank you very much for your reply 

sane as scheduler view

how can i change the background color of a particular day like sunday saturdays and holidays with different colors.of scheduler control
 please can you help me in this part.  i struck in this point.

[Pana]

Hi,

I do not understand the "sane as scheduler view" part. You want this for RadScheduler and not RadScheduleView? Or I ma mistaken.

The Background colors are added by adding Slot in the SpecialSlots collection. In the code behind the collection is created and set to the scheduleview. You can just set Start and End on the slot as a single occurence appointment or use a recurrence pattern as it would be useful to mark sundays for example.

Greetings,
Pana
the Telerik team

[sravan]

Thank you for your reply. initially we thought of working with scheduler control but later we shifted to scheduleview control.

any way 

now i am able to change the change the background color of the sunday by looking at your example download given but i am unable to apply resource grouping on that.

is there any way to achieve both gackground coloring and resource grouping


Regards,
sekhar.

[Pana]

Hello,

The Slot has Resources. You have to add all resources in the resources of the Slot to make it visible just like you would add all resources in an Appointment to make it visible in all groups.

Regards,
Pana
the Telerik team

[sravan]

HI Pana,

Thanks for your reply it is working now.


Regards,
sekhar.

[sravan]

Hi 

How to remove the vertical lines and time slots header in timeline view. please help me on this.


Regards
sekhar.

[Pana]

Hello,

You can edit the TimeRulerItemStyleSelector and set empty control template for the ticks in timeline view. I have created a small example for you that removes the horizontal ticks (fortunately only timeline is horizontal and day and week are vertical). If you want to change the orientation of the views you can extend the default selector or ScheduleViewStyleSelector and create your own that will have custom logic.

All the best,
Pana
the Telerik team

[sravan]

Hi 

Is it possible to add the text to cells of the scheduleview control other than by adding booking.
if so please let me know the possibility

means i want to display text on the background of the slot. not by adding booking

if it is sunday i want to display the day as sudnay on the background on the day

Regards,
sekhar.

[Pana]

Hello,

Please check the attached project. You can create a collection of custom Slot implementations and create a custom template for the highlight items that render these special slots. You can add some text and display it in background of the RadScheduleView. Note that although this will allow you to add text at the background appointments will still show over the text so you will have to take care about the positioning of the Text. For example in month view it would be best to display the text at the bottom of the cells.

Please check the attached project for reference.

Regards,
Pana
the Telerik team

[Paul]

The project above this post does not seem to work with the latest 2011 Q2 release. The text is never displayed on the background when using Text="{Binding Text}". If you replace the Text="{Binding Text}" with any text say Text="Hello" then it shows.
Is this a bug?

[Dani]

Hi Paul,

Changes have been made to the RadScheduleView control since Q1 2011. Please, try applying a string format specifier to display the needed day of week string. For example:

<TextBlock Margin="4 2" VerticalAlignment="Bottom" Text="{Binding Start, StringFormat=dddd}" FontWeight="Bold"/>

I would suggest that you upgrade to a more recent version of the assemblies.

I hope this helps.

Regards,
Dani
the Telerik team

[Sravan]

Hi Team,

I am also facing the same problem

I am using RadControls for Silverlight Q2 2011 SP1 but when like to show some text on the slot dynamically it is not showing.

though i apply StringFormat no luck

please find the below line of my code

<Style TargetType="scheduleView:HighlightItem">
                    <Setter Property="Background" Value="Transparent" />
                    <Setter Property="VerticalAlignment" Value="Top" />
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="scheduleView:HighlightItem">
                                <Grid Height="25" Width="Auto" ShowGridLines="False" Background="Silver">
                                    <Grid.ColumnDefinitions>
                                        <ColumnDefinition></ColumnDefinition>
                                    </Grid.ColumnDefinitions>
                                    <Grid.RowDefinitions>
                                        <RowDefinition></RowDefinition>
                                    </Grid.RowDefinitions>
                                    <ProgressBar Width="Auto" Value="{Binding Effort,StringFormat='hh'}" Background="Black">


                                    </ProgressBar>
                                    <TextBlock Margin="4 2" VerticalAlignment="Center" Grid.Row="0" Grid.Column="0" HorizontalAlignment="Center" Text="{Binding EffortHours,StringFormat='hh'}" FontWeight="Bold"/>
                                </Grid>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>

[Ajay]

Hi Team,

I am also facing the same problem when i try to bind the text to a textblock in using special slot selector template.

I am trying to bind the text to a text block placed in the template control of special slot style selector.

it was working fine when i was using "Silverlight Q1 2011 SP1 Demos"  but when i upgraded to the "Silverlight Q2 2011 SP1 " i am facing this problem

one of the solutions that is provided to have the text bind is "StringFormat" .i implemented event that too. but it is still not working.
It is working fine when we bind predefined Properties like Start , End but it is not working for custom properties.

Please can you help on this. This is an urgent requirement.
 
find the below piece of code that i am using to apply the style.

public class SpecialSlotStyleSelector : ScheduleViewStyleSelector
    {
        public Style SundayStyle { get; set; }
        public Style SaturdayStyle { get; set; }
        public Style WorkingHourStyle { get; set; }
        public Style HolidayHourStyle { get; set; }


        public override Style SelectStyle(object item, DependencyObject container, ViewDefinitionBase activeViewDeifinition)
        {
            if (item is SundayOccurence)
            {
                return this.SundayStyle;
            }
            else if (item is SaturdayOccurence)
            {
                return this.SaturdayStyle;
            }
            else if (item is WorkingHourOccurence)
            {
                var wSlot = ((WorkingHourOccurence)item);
                WorkingHourOccurence itemT = (WorkingHourOccurence)item;
                var allText = container.Descendents<TextBlock>(x => x.Name.Equals("txtEffort")).SingleOrDefault();
                var allProgressBars = container.Descendents<ProgressBar>(p => p.Name.Equals("pbEffort")).SingleOrDefault();
                if (allText != null)
                {
                    allText.Text = wSlot.EffortHours;
                }
                if (allProgressBars != null)
                {
                    allProgressBars.Value = wSlot.Effort;
                }
                //if (allText == null)
                //{
                //    Style sty = new Style();
                //    sty.BasedOn = this.WorkingHourStyle;
                //    sty.TargetType = typeof(HighlightItem);


                //    Setter background = new Setter();
                //    background.Property = HighlightItem.BackgroundProperty;
                //    background.Value = Colors.Transparent;
                //    sty.Setters.Add(background);


                //    Setter align = new Setter();
                //    align.Property = HighlightItem.VerticalAlignmentProperty;
                //    align.Value = VerticalAlignment.Top;
                //    sty.Setters.Add(align);


                //    Grid grd = new Grid();
                //    grd.RowDefinitions.Add(new RowDefinition());
                //    grd.ColumnDefinitions.Add(new ColumnDefinition());
                //    TextBlock txtEffort = new TextBlock() { Text = wSlot.EffortHours, Name = "txtEffort" };
                //    Grid.SetRow(txtEffort, 0);
                //    Grid.SetColumn(txtEffort, 0);
                //    ProgressBar pb = new ProgressBar() { Value = wSlot.Effort, Name = "pbEffort" };
                //    Grid.SetRow(pb, 0);
                //    Grid.SetColumn(pb, 0);


                //    grd.Children.Add(txtEffort);
                //    grd.Children.Add(pb);


                //    ContentControl cc = new ContentControl();
                //    cc.Content = grd;


                //    Setter templateProperty = new Setter();
                //    templateProperty.Property = HighlightItem.TemplateProperty;
                //    templateProperty.Value = cc;
                //    sty.Setters.Add(templateProperty);                   


                //    return sty;
                //}
                return this.WorkingHourStyle;


            }
            else if (item is HolidayOccurence)
            {
                return this.HolidayHourStyle;
            }
            return base.SelectStyle(item, container, activeViewDeifinition);
        }


        void SpecialSlotStyleSelector_StyleSelectionCompleted(object item, DependencyObject container)
        {
            var wSlot = ((WorkingHourOccurence)item);
            WorkingHourOccurence itemT = (WorkingHourOccurence)item;
            var allText = container.Descendents<TextBlock>(x => x.Name.Equals("txtEffort")).SingleOrDefault();
            var allProgressBars = container.Descendents<ProgressBar>(p => p.Name.Equals("pbEffort")).SingleOrDefault();
            if (allText != null)
            {
                allText.Text = wSlot.EffortHours;
            }
            if (allProgressBars != null)
            {
                allProgressBars.Value = wSlot.Effort;
            }
        }
    }


    public class HolidayOccurence : Slot
    {
        private HolidayOccurence holiDayOcc = null;
        public override Slot Copy()
        {
            holiDayOcc = new HolidayOccurence();
            holiDayOcc.Start = this.Start;
            holiDayOcc.End = this.End;
            holiDayOcc.RecurrencePattern = this.RecurrencePattern.Copy();
            holiDayOcc.Resources.AddRange(this.Resources);


            return holiDayOcc;
        }
    }


    public class SundayOccurence : Slot
    {
        public override Slot Copy()
        {
            SundayOccurence sundayOcc = new SundayOccurence();
            sundayOcc.Start = this.Start;
            sundayOcc.End = this.End;
            sundayOcc.RecurrencePattern = this.RecurrencePattern.Copy();
            sundayOcc.Resources.AddRange(this.Resources);
            return sundayOcc;
        }
    }
    public class SaturdayOccurence : Slot
    {
        public override Slot Copy()
        {
            SaturdayOccurence saturdayOcc = new SaturdayOccurence();
            saturdayOcc.Start = this.Start;
            saturdayOcc.End = this.End;
            saturdayOcc.RecurrencePattern = this.RecurrencePattern.Copy();
            saturdayOcc.Resources.AddRange(this.Resources);
            return saturdayOcc;
        }
    }
    public class WorkingHourOccurence : Slot
    {
        public float Effort
        {
            get;
            set;
        }


        public string EffortHours
        {
            get;
            set;
        }


        public override Slot Copy()
        {
            WorkingHourOccurence workingDayOcc = new WorkingHourOccurence();
            workingDayOcc.Start = this.Start;
            workingDayOcc.End = this.End;
            workingDayOcc.Effort = this.Effort;
            workingDayOcc.EffortHours = this.EffortHours;
            //workingDayOcc.RecurrencePattern = this.RecurrencePattern.Copy();
            workingDayOcc.Resources.AddRange(this.Resources);
            return workingDayOcc;
        }
    }

Regards,
Ajay.

[Dani]

Hello Ajay, Sravan

Between Q1 and Q2 release changes to the DataContext of the Slot were made.

Please, try binding to your custom properties using Slot.EffortHours.

Let me know if the problems persists.


Dani
the Telerik team

[Sravan]

Hi Team,

Thanks for the reply.

This solved my problem.


Regards,
sekhar.