Fix Issue #1160

[cat0363]

When viewing the Snackbar on versions prior to iOS 14, the background color of the Snackbar is missing.
Therefore, I focused on the parts that make up the Snackbar. The Snackbar container before the fix was
implemented with RoundedStackView, which inherited from UIStackView.

In versions before iOS14, the background color of UIStackView, which is the inheritor of RoundedStackView,
does not work. As of iOS 14, the UIStackView background color works. See below for this.

https://stackoverflow.com/questions/54273884/how-to-set-background-color-of-uiview-inside-of-uistackview
https://www.tutorialspoint.com/how-to-change-the-background-color-of-uistackview
https://useyourloaf.com/blog/stack-view-background-color-in-ios-14/

With all that said, RoundedStackView works fine on iOS 14 and above, but not on iOS 13 and below.
Therefore, I abolished RoundedStackView, which inherited from UIStackView.
Instead, I added a new RoundedView that inherits from UIView. The implementation of RoundedView
is based on the implementation of RoundedStackView.

The big difference is that the inheritance source changed from UIStackView to UIView.
Also changed Snackbar's container from RoundedStackView to UIStackView.
This is to prevent the background color and corners from being drawn twice for each of the
RoundedStackView and the newly added RoundedView that inherits the UIStackView.
From the above, it is no longer necessary to draw the background color and corners with the Draw
method, so I changed from RoundedStackView to UIStackView.

The newly added background color and RoundedView for drawing corners are adjusted in size
using AutoresizingMask.

Below is an excerpt of the changes. See source code diffs for more information.

[AlertView.macios.cs]

    [MemberNotNull(nameof(Container))]
    void Initialize()
    {
        Container = new UIStackView()
        {
            Alignment = UIStackViewAlignment.Fill,
            Distribution = UIStackViewDistribution.EqualSpacing,
            Axis = UILayoutConstraintAxis.Horizontal,
            TranslatesAutoresizingMaskIntoConstraints = false
        };

        foreach (var view in Children)
        {
            Container.AddArrangedSubview(view);
        }

        TranslatesAutoresizingMaskIntoConstraints = false;
        AddSubview(Container);

        var subView = new RoundedView(
            VisualOptions.CornerRadius.X,
            VisualOptions.CornerRadius.Y,
            VisualOptions.CornerRadius.Width,
            VisualOptions.CornerRadius.Height)
        {
            BackgroundColor = VisualOptions.BackgroundColor,
            AutoresizingMask = UIViewAutoresizing.FlexibleHeight | UIViewAutoresizing.FlexibleWidth,
        };
        Subviews.First().InsertSubview(subView, atIndex: 0);
    }

[RoundedView.cs]

/// <summary>
/// A rounded <see cref="UIView"/>
/// </summary>
public class RoundedView : UIView
{
    /// <summary>
    /// Initialize <see cref="RoundedView"/>
    /// </summary>
    public RoundedView(NFloat leftPadding, NFloat topPadding, NFloat rightPadding, NFloat bottomPadding)
    {
        LeftPadding = leftPadding;
        TopPadding = topPadding;
        RightPadding = rightPadding;
        BottomPadding = bottomPadding;
    }

    /// <summary>
    /// Left Padding
    /// </summary>
    public NFloat LeftPadding { get; }

    /// <summary>
    /// Top Padding
    /// </summary>
    public NFloat TopPadding { get; }

    /// <summary>
    /// Right Padding
    /// </summary>
    public NFloat RightPadding { get; }

    /// <summary>
    /// Bottom Padding
    /// </summary>
    public NFloat BottomPadding { get; }

    /// <inheritdoc />
    public override void Draw(CGRect rect)
    {
        ClipsToBounds = true;

        var path = GetRoundedPath(rect, LeftPadding, TopPadding, RightPadding, BottomPadding);
        var maskLayer = new CAShapeLayer
        {
            Frame = rect,
            Path = path
        };

        Layer.Mask = maskLayer;
        Layer.MasksToBounds = true;
    }

    static CGPath? GetRoundedPath(CGRect rect, NFloat left, NFloat top, NFloat right, NFloat bottom)
    {
        var path = new UIBezierPath();
        path.MoveTo(new CGPoint(rect.Width - right, rect.Y));

        path.AddArc(new CGPoint(rect.X + rect.Width - right, rect.Y + right), right, (NFloat)(Math.PI * 1.5), (NFloat)Math.PI * 2, true);
        path.AddLineTo(new CGPoint(rect.Width, rect.Height - bottom));

        path.AddArc(new CGPoint(rect.X + rect.Width - bottom, rect.Y + rect.Height - bottom), bottom, 0, (NFloat)(Math.PI * .5), true);
        path.AddLineTo(new CGPoint(left, rect.Height));

        path.AddArc(new CGPoint(rect.X + left, rect.Y + rect.Height - left), left, (NFloat)(Math.PI * .5), (NFloat)Math.PI, true);
        path.AddLineTo(new CGPoint(rect.X, top));

        path.AddArc(new CGPoint(rect.X + top, rect.Y + top), top, (NFloat)Math.PI, (NFloat)(Math.PI * 1.5), true);

        path.ClosePath();

        return path.CGPath;
    }
}

Description of Change

Linked Issues

• Fixes [BUG] Snackbar background color not working on iOS 13.3.1. #1160

PR Checklist

• Has a linked Issue, and the Issue has been approved(bug) or Championed (feature/proposal)
• Has tests (if omitted, state reason in description)
• Has samples (if omitted, state reason in description)
• Rebased on top of main at time of PR
• Changes adhere to coding standard
• Documentation created or updated: https://github.com/MicrosoftDocs/CommunityToolkit/pull/XYZ

Additional information

Below are the results of running before iOS 14 and after iOS 14.

[Case 1 (iOS 13.3.1)]

[Case 2 (iOS 13.3.1)]

[Case 1 (iOS 16.4)]

[Case 2 (iOS 16.4)]

Case 1 and Case 2 are the execution results below.

[Case 1]

var snackbar = Snackbar.Make(
    "This is test message1." + Environment.NewLine + "This is test message2.",
    action: null,
    actionButtonText: string.Empty,
    duration: new TimeSpan(0, 0, 0, 0, 3500),
    visualOptions: new CommunityToolkit.Maui.Core.SnackbarOptions() {
        BackgroundColor = Colors.Red,
        TextColor = Colors.White,
        CornerRadius = new CornerRadius(20,5,10,0)
    },
    anchor: null
);

[Case 2]

var snackbar = Snackbar.Make(
    "This is test message1." + Environment.NewLine + "This is test message2.",
    action: null,
    actionButtonText: string.Empty,
    duration: new TimeSpan(0, 0, 0, 0, 3500),
    visualOptions: new CommunityToolkit.Maui.Core.SnackbarOptions() {
        BackgroundColor = Colors.Red,
        TextColor = Colors.White,
        CornerRadius = new CornerRadius(5)
    },
    anchor: null
);