Calendar view in maui causes crash on physical android device

[sfoslund]

Describe the bug
When including a CalendarView in a maui android app the app crashes, presumably because the calendar view is taking so long to load. My app is running fine (but noticeably slowly) on an android emulator but as soon as I install it on a physical device it crashes.

Expected behavior
Calendar view renders without crash

Steps to reproduce OR link to code
Repro project: https://github.com/sfoslund/DailyCheckinApp/blob/main/DailyCheckinApp/Views/CalendarView.xaml#L17

Xamarin Forms or .NET MAUI (If related to UI)
.NET MAUI

Device Info (Optional)
Device Model: Google Pixel 4A
Android Version: 12
IOS Version: N/a
Windows Version: N/a

[ME-MarvinE]

Testing

When ran from debug on a Huawei Mate 20 lite, start-up took on average18-19 seconds (Ran 4 times) and rendered this:

View Screenshot

However when not running with the debugger, start-up took on average 3-4 seconds (Ran 4 times) and crashed each time.

When ran from debug on a Samsung A52s, start-up took on average 9-10 seconds (Ran 4 times) and rendered this:

View Screenshot

However when not running with the debugger, start-up took on average 2 seconds (Ran 4 times) and crashed each time.

After some more testing, I found that the crash is caused by the Style property of the CalendarView, NavigationView, and DayView being set to static resources which I couldn't find anywhere in the project:

• Line 26: Style="{StaticResource DefaultCalendarViewStyle}"
• Line 34: Style="{StaticResource DefaultNavigationViewStyle}"
• Line 58: Style="{StaticResource DefaultDayViewStyle}"

Either remove these lines or define the resources somewhere in a parent view, such as in the ContentPage:

<ContentPage.Resources>
    <Style x:Key="DefaultCalendarViewStyle" TargetType="{x:Type xcViews:CalendarView}">
        <Setter Property="BackgroundColor" Value="#505050"/>
    </Style>

    <Style x:Key="DefaultNavigationViewStyle" TargetType="{x:Type xcViews:NavigationView}">
        <Setter Property="BackgroundColor" Value="Red"/>
    </Style>

    <Style x:Key="DefaultDayViewStyle" TargetType="{x:Type xcViews:DayView}">
        <Setter Property="CurrentMonthTextColor" Value="Green"/>
    </Style>
</ContentPage.Resources>

View Screenshot

Thanks for using the plugin!

[sfoslund]

@ME-MarvinE thanks for your quick and thorough response! I tried removing those lines from the app and I'm still seeing the crash, do you have any further recommendations for debugging this?

[ME-MarvinE]

It looks like I reverted my changes to the XAML to the original code but not the ViewModel. Now it only works if you don't remove the lines and define the styles.

If you suspect it is performance related, try to reduce the resources it uses to see if it still crashes.
Set the Calendar's AutoRows property to false
Set the Calendars Rows property to 1
Set the CalendarView's DayTemplate property to just be a simple Label with it's Text bound to DateTime.

If the app doesn't crash, then I don't think I can do anything about performance as I've tried to refine the XAML plenty of times, and may be due to MAUI issues such as:

dotnet/maui#6317
dotnet/maui#7237

If the app still crashes, then it probably isn't performance related, though you could go further by binding the Days property to a collection with only one day in it instead of using the Days property of the Calendar.

For debugging, what I do is:

• Try removing properties until the app doesn't crash.
• There are default values for the content of CalendarView's template properties internally. Try setting them to simple controls like a Label to see if it's something wrong with templating or one of the default controls.
• The CalendarView is made up of default controls: NavigationView, DaysView, and DayView (There is no control for DayNames). Try using them on their own to try to isolate the issue to a smaller scope with less code to test.
• Try using a Calendar with the default class CalendarDay as a generic parameter instead of your custom type.

[ME-MarvinE]

@sfoslund I missed some style references in ViewHabitsView:

Line 26: Style="{StaticResource DefaultCalendarViewStyle}"
Line 34: Style="{StaticResource DefaultNavigationViewStyle}"
Line 54: Style="{StaticResource DefaultDayViewStyle}"

If you haven't already, try removing those lines along with the ones previously mentioned:

* Line 26: `Style="{StaticResource DefaultCalendarViewStyle}"`

* Line 34: `Style="{StaticResource DefaultNavigationViewStyle}"`

* Line 58: `Style="{StaticResource DefaultDayViewStyle}"`

There were no crashes after I did that.

[sfoslund]

Now it only works if you don't remove the lines and define the styles.

I've tried defining the styles as well and that also doesn't make a difference for me.

I used VS's FindAll with 'solution' scope to find lines where I missed the undefined style references.

Yes, I noticed those as well and removed them in my original testing.

Thanks for those debugging tips! I will likely take a break from this project for a while and come back to it in a few weeks, but once I do I will update here if I find the issue.

[atamietti]

Hi Guys, This PR might fix it.

[ME-MarvinE]

@sfoslund Have you looked into this recently, are you still experiencing the issue?

[JianpingCAI]

I've found that it crashes if my .net maui app starts with a device in horizontal screen mode, but it does not crash in vertical screen mode. The issue can be reproduced on multiple Android devices, including physical and Emulators.

[JianpingCAI]

I've found that it crashes if my .net maui app starts with a device in horizontal screen mode, but it does not crash in vertical screen mode. The issue can be reproduced on multiple Android devices, including physical and Emulators.

It turns out that the above issue is not caused by XCalendar but might be a bug in .net MAUI.
In my xaml file, there is a layout defined as below, where the CalendarView as the last row of the grid takes too much space of the height, which causes the inferred height of the 3rd row to be a very large number (guess it is unsigned integer type), leading to Java.Lang.OutOfMemoryError.

<Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="auto" />
                <RowDefinition Height="auto" />
                <RowDefinition Height="*" />
                <RowDefinition Height="auto" />
            </Grid.RowDefinitions>