I was able to find a solution to my problem but I'm not sure if there is an easier way to get my expected output. I already have a Dependency Service called IPlatformOpertations that handles platform specific code (ex:// playing sounds or checking if the app is in the foreground) so my approach was to add a "GetSafeArea" method to my dependency service that would get all the safe area thicknesses I plan to use. Next, In my App.xaml.cs, I created 3 static Thickness Properties called SafeTop, SafeBottom, and SafeArea, then in my BaseViewModel class, I added 3 properties that's values are linked (via "{ get; } =" or "=>") to each of the App.xaml.cs Safe Area Thickness Properties.
Every view model in my project inherits from the BaseViewModel class so I can then get access SafeTop, SafeBottom, and SafeArea anywhere in my application. If I only want to use the top safe area, I can bind my padding to SafeTop. If I only want to use the bottom safe area, I can bind my padding to SafeBottom. And, if I want to use both, I can bind my padding to SafeArea.
After doing this, I noticed that there is an additional issue with the fullscreen SfPopupLayout.PopupView on iOS. A tiny piece of the screen doesn't get filled in at the top of the devices display. The application is being ran on an iOS 14 PRO MAX - iOS 16.2 emulator. View the attachment below.
Attachment:
SfPopupSafeAreaIssue_1db8afa3.zip