Is it possible to achieve this UI requirement using SfCalendar control

[ahraza]

Hi,

I went through the documentation for SfCalendar control but haven't seen anything that indicates that it is possible to achieve this UI requirement using this control.

Please find jpeg file attached.

I need to be able to show multiple "information tags" per each date, as seen in 1st March in the picture. Is it possible?

Thank you.

Adil

Attachment: calendarui_726b5feb.zip

[Mugundhan Saravanan]

Hi Adil,

Thanks for contacting Syncfusion Support.

We have prepared the sample based on your requirement using Custom view by handling the MonthCellLoaded Event. Now you can add two or more information on any date. Please find the sample from the below link.

Sample:  http://www.syncfusion.com/downloads/support/directtrac/general/ze/calendarsample-405422433  

Please let us know if you have any other query.

Regards,
Mugundhan S. 

[ahraza]

Hi Mugundhan,

How do i achieve this with databinding? There is a datasource property on the calendar. how can i use that to achieve this requirement?

Thanks.

[Mugundhan Saravanan]

Hi Adil,

Thanks for your update.

We can use CellBindingContext property for DataBinding. We can create a sample of customize the month cell of sfcalendar with custom object. Please find the sample from the following link.

Sample: http://www.syncfusion.com/downloads/support/directtrac/general/ze/Calendar_sample-97835500    
 If you have any concern, please contact us.

Please refer the knowledge base for SfCalendar from the following link.

Link:  https://www.syncfusion.com/kb/xamarin.forms/sfcalendar  

Regards,
Mugundhan S. 

[ahraza]

Thanks Mugundhan,

Is there any way to customize the month hearder and days header to achieve the required view in the first attachment?

I can't find any docs around customizing the display of the days header (i.e. full name days - Saturday, Sunday, Monday ....) and center align the text.

I was able to change the background colors etc though.

Best Regards,
Adil

[Mugundhan Saravanan]

Hi Adil,

Thanks for your update.

We can Customize the month header by using HeaderView setting and Customize the days by using CustomDayLabel property. We have modified the last updated sample using these properties. Please find the sample from the following link.

Link: http://www.syncfusion.com/downloads/support/directtrac/general/ze/Calendar_sample-1441410542  

please let us know if you have any consern about this.

Regards,
Mugundhan S.
 

[ahraza]

Hi Mugundhan,

When i run your last sample, this is the out put i get. (attached) The day names are still 3 letters. I see you have this code:

protected override void OnAppearing()

        {

            base.OnAppearing();

            List<string> day = new List<string>();

            day.Add("Sunday");

            day.Add("Monday");

            day.Add("Tuesday");

            day.Add("Wednesday");

            day.Add("Thursday");

            day.Add("Friday");

            day.Add("Saturday");

            calendar.CustomDayLabels = day;

        }

but does not seem to take any effect.

Regards,
Adil

Attachment: Capture_dc71b644.zip

[ahraza]

Ok this one is sorted. Thanks

[Vinnalan Aravazhi]

Hi Adil,

Thanks for the update.

We are glad to know that you have achieved your requirement. Please let us know if you have any other queries.

Regards,
Vinnalan K A.