Upgrade to .NET MAUI

[matt-goldman]

Important

This PR is being kept for reference until April 2024 (see #451).

Do not merge this PR or delete this branch; delete both on 1st April 2024.

---

Tasks

• Spike QR code scanning feasibility within MAUI framework #310
• Write migration roadmap

Tasks

Preview Give feedback

1. Test latest .NET 8 preview #427
   +0
   

Android

• Animation is not visible when it's bound
• Layout of popup pages is off; should match prod
• Crown icon is missing for the top leader on the Leaderboard (existing bug in Xamarin.Forms)
• Star icons are missing for some items in the All Time list on the Leaderboard
• Poor scrolling on the Leaderboard page
• Search and filter issues on the Leaderboard page
• Splash screen is incorrect on Android 12+
• The picture is blurry on the Login page
• Carousel is jerky (.NET 8 prev.6). Re: in Debug I can see that GC is triggered when the user swipes; that causes the delays. Works fine in Release on a relatively old phone - Samsung Note 8. 🐛UI | PeoplePage | Carousel swipes trigger GC and cause delays #431
• Carousel is changing height (.NET 8 prev.6)
• Carousel: an image placeholder is not displayed when the image is downloading
• Input box underline (.NET 8 prev.6)
• Check if we can enable Animation. Re: still disabled for OnBoardingPage.
• Clipped or missing icons
• Skills do not have right margin
• Last achievement issue
• ProfilePage: CarouselView with a CollectionView inside it is too sensitive Vertical Scrolling is hard/Practically unusable for a CollectionView inside a CarouselView dotnet/maui#6412
• App crashes when you scan a QR code; happens only in Release.
• App crashes on the People page; Release mode only. Solution can be found here [regression/8.0.0-preview.6.8686] [Android] BitmapFactory.DecodeStreamAsync crashes the app on .NET 8-preview.6 in Release mode dotnet/maui#16514
• Gray scale transformation is not working as FFImageLoading does not support MAUI. Re: used the recently released FFImageLoading.Compat package.
• Achievements are not perfect circles. That's because we are using Frame, not Button. But buttons have problems with the BackgroundColor in the Release mode. Re: not relevant anymore as we changed the shape of buttons to rounded rectangular.

iOS

• Beta: tab icons are missing and have incorrect color
• Beta: missing right padding on the Skill Bars (PeoplePage)
• Changing tabs in leaderboard freezes while lists are updated
• Animation is not visible ([BUG] SKLottieView not working in Popup mono/SkiaSharp.Extended#142). Re: On the ScanResultPage we use the workaround mentioned in the issue. On the OnBoardingPage we display an image as the workaround doesn't work there (probably because it's inside a carousel).
• Corner radius is off; shapes should be circular
• Layout of profile stats is off; margins should be calculated against the center of the circle
• Flyout ellipsis is in the middle of the screen; should be on the left
• App icon is incorrect; should match prod
• Splash screen is incorrect; should match prod
• Scanner is not working; should be able to scan a QR code
• Icons are blurry
• Tab icons are blurry ([RC1] - iOS FontImageSource in AppShell TabBar Pixelation dotnet/maui#6043) Workaround - switched to SVG icons
• Selected tab icon is not highlighted; should be highlighted red ((Un)SelectedTabColor do not work for TabbedPage icons (FontImageSource) on iOS dotnet/maui#12250)
• FlyoutPage layout is off; should match prod
• Join Us item on the FlyoutPage is missing
• Cannot close popups, e.g. Edit Profile Picture, SSW Events, About SSW; should be able to close by tapping on the overlay
• Link icon size is off on SSW Events and About SSW popups; should match prod
• Rewards progress bar is missing on the Profile page
• Layout of Leaderboard list items is off; should match prod
• Leaderboard page is super slow, sometimes the app freezes; performance should be comparable to Android
• Some images on the PeoplePage have huge sizes; should match prod
• Skill bars are grey on the PeoplePage; should be red
• Search and filter issues on the Leaderboard page
• Layout of the Search input field is off
• Some icons are cropped (e.g. achievements or "scroll up" on the Leaderboard page) [regression/8.0.0] [iOS] Border appears to be offsetting content incorrectly dotnet/maui#15183
• Recent Activity items change heights when you scroll (fix: temporary fixed the height)
• App crashes when the user scans a legit qr code
• Scanner is not working if the ScanResult popup is dismissed by tapping on the overlay and not on the Ok button. Fix by making the popup modal or by properly handling all actions which close the popup.
• App crashes when you scan a QR code; happens only in Release.
• App crashes on start; Release mode only
• Achievements are not perfect circles. That's because we are using Frame, not Button. But buttons have problems with the BackgroundColor in the Release mode. Re: not relevant anymore as we changed the shape of buttons to rounded rectangular.
• LeaderboardPage: big gap on the right side. Reported by @bradystroud

Before merging:

• Address TODOs
• Remove not relevant comments
• Remove not targeted platforms (Tizen, Windows, Mac)
• Remove MauiPage.xaml
• Update nuget packages
• Test scanning/achievements functionality

[AntPolkanov]

Fixed #408

[AntPolkanov]

Fixed #437