Theming Questions

[Chris]

Hi, 

I am currently integrating the calendar control into a new Xamarin Forms application and a few questions have raised from this (see attached image):

• My first issue is the white line on the right hand side of the image. How can I remove this?
• My next issue is the text colour in the calendar days - the weekend text colour is fine, but my issue is with the theme properties - to me SfCalendarWeekDayTextColor should be the same colour as  SfCalendarWeekEndTextColor but isn't. How do I make this so? <Color x:Key="SfCalendarWeekDayTextColor">#CCCCCC</Color><Color x:Key="SfCalendarWeekEndTextColor">#CCCCCC</Color>
• My final question is probably not anything to do with the control specifically but my main app colours are defined in App.Xaml and the theming for the calendar is defined in my contentpage. I'm unsure on how to set the global values defined in my App.xaml to the Syncfusion calendar as I'm having to duplicate the values. Ie:
  

App.Xaml

<ResourceDictionary>

            <Color x:Key="Background">#344A62</Color>

            <Color x:Key="TextColour">#CCCCCC</Color>

</ResourceDictionary>

CalendarPage.xaml

    <ContentPage.Resources>

        <ResourceDictionary>

            <ResourceDictionary.MergedDictionaries>

                <syncTheme:LightTheme />

                <syncfusion:SfCalendarStyles />

                <ResourceDictionary>

                    <Color x:Key="SfCalendarCurrentMonthBackgroundColor">#344A62</Color>

                    <Color x:Key="SfCalendarWeekEndBackgroundColor">#344A62</Color>

                    <Color x:Key="SfCalendarBlackoutColor">#344A62</Color>

                    <Color x:Key="SfCalendarDayHeaderBackgroundColor">#344A62</Color>

                    <Color x:Key="SfCalendarHeaderBackgroundColor">#344A62</Color>

                    <Color x:Key="SfCalendarInlineTextColor">#CCCCCC</Color>

                    <Color x:Key="SfCalendarDateSelectionColor">#CCCCCC</Color>

                    <Color x:Key="SfCalendarDayHeaderTextColor">#CCCCCC</Color>

                    <Color x:Key="SfCalendarHeaderTextColor">#CCCCCC</Color>

                    <Color x:Key="SfCalendarYearViewDateTextColor">#CCCCCC</Color>

                    <Color x:Key="SfCalendarWeekDayTextColor">#CCCCCC</Color>

                    <Color x:Key="SfCalendarWeekEndTextColor">#CCCCCC</Color>

                    <Color x:Key="SfCalendarPreviousMonthTextColor">#CCCCCC</Color>

                </ResourceDictionary>

            </ResourceDictionary.MergedDictionaries>

        </ResourceDictionary>

    </ContentPage.Resources>

Many thanks 

Chris

Attachment: syncfusion_calendar_fd09ed31.zip

[SaiGanesh Sakthivel]

Hi Chris, 

 

Thank you for the update. 

 

Query 1: white line on the right hand side of the image.  

Above issue is raised because of the layout framework. Default layout framework take value in “Integer” type while custom theme will be in “Double”. In order to overcome this , we should use “<Color x:Key="SfCalendarBackgroundColor">#344A62Color>”. 

 

Query 2: Text colour in the calendar days - the weekend text colour is fine, but my issue is with the theme properties - to me SfCalendarWeekDayTextColor should be the same colour as  SfCalendarWeekEndTextColor but isn't. 

SfCalendarWeekDayTextColor is deprecated in Calender. In order to change the WeekDayTextColor you can use the key : “SfCalendarCurrentMonthTextColor” and “SfCalendarPreviousMonthTextColor” 

 

Query 3: how to set the global values defined in my App.xaml to the Syncfusion calendar as I'm having to duplicate the values. 

You can set the global values defined in my App.Xaml as given procedure below, 

<Application.Resources> 

        <Color x:Key="SfCalendarBackgroundColor">#344A62Color> 

        <Color x:Key="SfCalendarCurrentMonthTextColor">#CCCCCCColor> 

Application.Resources 

 

We have attached the tested sample for your reference. Please find the sample from the following link, 

Sample :  https://www.syncfusion.com/downloads/support/directtrac/general/ze/CalendarQuerry-712188033

 

Regards, 

SaiGanesh Sakthivel 

 

[Chris]

Fantastic. Thank you so much, this answers all my questions.

[SaiGanesh Sakthivel]

Hi Chris,  

 

Thanks for the update. 

 

Please get in touch with us if you need any further assistance. 

  

Regards,  

SaiGanesh Sakthivel