We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Rearranging the appointments in day and week / work week view

Dear Sir/Madam,

I am trying to implement the appointments view (using SfSchedule) as proof of concept for one of my clients. The following is the XAML code snippet;

<syncfusion:SfSchedule Grid.Row="0" Grid.Column="0" Grid.RowSpan="2" TimeMode="TwentyFourHours"
                               AllowEditing="False" TimeInterval="FifteenMin" ShowAllDay="False"
                               NonWorkingDays="Sunday,Saturday" ScheduleType="{Binding Path=SelectedAppointmentView}"
                               Visibility="{Binding Path=ShowScheduler, Converter={StaticResource VisibleIfTrue}}"
                               ItemsSource="{Binding Path=AllAppointments}" EnableAutoFormat="True"
                               >
            <syncfusion:SfSchedule.CollapsedHours>
                <syncfusion:ScheduleCollapsedHour StartHour="1" EndHour="7"></syncfusion:ScheduleCollapsedHour>
                <syncfusion:ScheduleCollapsedHour StartHour="18" EndHour="24"></syncfusion:ScheduleCollapsedHour>
            </syncfusion:SfSchedule.CollapsedHours>
            <syncfusion:SfSchedule.AppointmentMapping>
                <syncfusion:ScheduleAppointmentMapping SubjectMapping="CardCode" StartTimeMapping="AppDate" 
                                                       EndTimeMapping="AppEndDateTime" NotesMapping="CardName"></syncfusion:ScheduleAppointmentMapping>
            </syncfusion:SfSchedule.AppointmentMapping>
            <syncfusion:SfSchedule.AppointmentTemplate>
                <DataTemplate>
                    <Grid>
                        <Rectangle Fill="White" Stroke="Black"
                                   StrokeThickness="2">
                        </Rectangle>
                        <StackPanel Orientation="Horizontal">
                            <Rectangle Fill="Firebrick"
                                       Width="10">
                            </Rectangle>
                            <StackPanel Margin="5,1,1,1">
                                <TextBlock HorizontalAlignment="Left"
                                       VerticalAlignment="Center" FontSize="12" FontWeight="Bold"
                                       Text="{Binding Path=CardCode}"
                                       FontStyle="Normal">
                                </TextBlock>
                                <TextBlock HorizontalAlignment="Left"
                                       VerticalAlignment="Center" FontSize="11"
                                       Text="{Binding Path=CardName}"
                                       FontStyle="Normal">
                                </TextBlock>
                            </StackPanel>
                        </StackPanel>
                    </Grid>
                </DataTemplate>
            </syncfusion:SfSchedule.AppointmentTemplate>
        </syncfusion:SfSchedule>

My problem is, the appointments for a time interval can be more than 3. For example, there can be 10 appointments between 09:00 and 10:00 for the same time and day. The day view and week / workweek view looks clumsy as all the 10 appointments are arranged side by side and the useful information about the appointment is not shown in the overview. My client wants to see the information CardCode (Customer Number) and CardName (Customer Name) listed for these 10 appointments. My idea was to show them one below the other for this interval.

Can you please help me in suggesting a way to show the information for all the appointment at the same time.

I am also attaching the screenshot of the existing design for your reference.

Thank you very much in advance!

With kind regards,
Krishna Kumar N

PS: I will be on vacation for a week. So please excuse me if my responses are delayed.

Attachment: SfSchedule_Appointments_c647ac58.zip

1 Reply

JM Jeyasri M Syncfusion Team November 2, 2016 10:31 AM UTC

Hi Krishna, 
 
Thanks for using Syncfusion products. 
 
Based on the implementation of SfSchedule appointments will be arranged based on the Timeslots (start and end time) which is similar as like in outlook calendar. You can use SfSchedule Day or TimeLine view to show the more information of all the appointments at the same time. 
 
In order to view more information about appointments in week view you can Enable the SfSchedule AppointmentTooltipVisibility feature which is used to display appointment details in all views.  
 
 Please find the below code snippet. 
 
Code Snippet: 
 
        
 <Schedule:SfSchedule Name="schedule" ScheduleType="Week" AppointmentTooltipVisibility="Visible"/> 
 
 
Regards, 
Jeyasri M. 


Loader.
Live Chat Icon For mobile
Up arrow icon