Calendar - Swipe Left/Right?

1 Answer 38 Views
Calendar
Keith
Top achievements
Rank 2
Veteran
Keith asked on 19 Apr 2022, 03:39 PM
It appears that the calendar swipes up/down in monthly view, if not also in others..  How can we make it swipe left/right and change the buttons accordingly?

1 Answer, 1 is accepted

Sort by
0
Accepted
Didi
Telerik team
answered on 20 Apr 2022, 11:46 AM | edited on 26 Apr 2022, 07:54 AM

Hi Keith,

I have edited this answer. I have researched in details the native navigation control and found that you can hide the up/down buttons by setting 

the Calendar.NavigationArrowsVisibility="Collapsed". 


Then you have to use the Calendar Header using the HeaderContentTemplate property. Then add two buttons inside the template for right/left navigation.  You need to implement the custom logic needed to navigate through the calendar when left/right buttons are clicked. You can change the calendar display date when navigating left/right.

<telerikInput:RadCalendar DisplayMode="MonthView"
                            NavigationArrowsVisibility="Collapsed"
                            x:Name="radCalendar">
    <telerikInput:RadCalendar.HeaderContentTemplate>
        <DataTemplate>
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="*"/>
                </Grid.ColumnDefinitions>
                <StackPanel>
                    <Button Content="Left"/>
                </StackPanel>
                <TextBlock Text="Header" Grid.Column="1"/>
                <StackPanel Grid.Column="2">
                    <Button Content="Right"/>
                </StackPanel>
            </Grid>
        </DataTemplate>
    </telerikInput:RadCalendar.HeaderContentTemplate>
</telerikInput:RadCalendar>

Regards,
Didi
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

Keith
Top achievements
Rank 2
Veteran
commented on 26 Apr 2022, 02:10 PM

Thank you for your reply.  My colleague has been digging into that portion of it.  I believe he has posted another question about how that Template gets rendered.
Didi
Telerik team
commented on 26 Apr 2022, 02:24 PM

Hi Keith, 

We have this question about UWP Calendar Header Template https://www.telerik.com/forums/calendar-control-not-loading-header-content-template. I couldn't reproduce the behavior with the header template visualization.

I have researched the Calendar Navigation control while answering this forum question. The Navigation control is not described in the Telerik UWP Calendar documentation. I can assure you that the documentation will be updated accordingly. 
Tags
Calendar
Asked by
Keith
Top achievements
Rank 2
Veteran
Answers by
Didi
Telerik team
Share this question
or