XamarinCommunityToolkit: [Bug] SnackBar visualisation problems

Description

XCT’s snack bar visualises strangely both on iOS and Android.

Android: Screenshot 2020-11-22 at 21 51 35

The colors are correct (peach background + white text), but the actual message is not shown and the snack bar is very tall.

iOS: Screenshot 2020-11-22 at 21 50 53

Message text is visible, but the colours and font are wrong (it doesn’t seem to honor any defaults on iOS).

Steps to Reproduce

This is how I set up the snack bar defaults, done once at startup of app in App.xaml.cs’s constructor:

SnackBarOptions.DefaultDuration = TimeSpan.FromSeconds((double)snackBarDuration);
SnackBarOptions.DefaultBackgroundColor = (Color)accentColor;
MessageOptions.DefaultForeground = (Color)navigationBarTextColor;
MessageOptions.DefaultFontSize = (OnPlatform<double>)baseFontSize;
MessageOptions.DefaultFontFamily = (string)snackBarFontFamily;
SnackBarActionOptions.DefaultBackgroundColor = (Color)accentColor;
SnackBarActionOptions.DefaultForegroundColor = (Color)navigationBarTextColor;
SnackBarActionOptions.DefaultFontSize = (OnPlatform<double>)baseFontSize;
SnackBarActionOptions.DefaultFontFamily = (string)snackBarFontFamily;

The values are read from a style dictionary, and are correctly fetched. Android seems to honor these values but not iOS.

The snack bar in the screenshots is shown via:

var snackBarOptions = new SnackBarOptions()
{
    MessageOptions = new MessageOptions()
    {
        Message = message
    },
    Actions = new SnackBarActionOptions[1]
    {
        new SnackBarActionOptions()
        {
            Text = "Go to Chat",
            Action = async () =>
            {
                // my action code here...
            }
        }
    }
};
await this.DisplaySnackBarAsync(snackBarOptions);

Expected Behavior

Default values should be honoured on all platforms, and message should be visible on Android.

Actual Behavior

Default values are not honoured on iOS, and message is not visible on Android. The snack bar’s height is also far too tall on Android (probably follow-up problem of the message not displaying properly?).

Basic Information

  • Version with issue: 1.0.0-preview1104
  • Last known good version: ?
  • IDE: VS For Mac 8.9 Preview
  • Affected Devices: iOS simulator, Android simulator

Pinging @VladislavAntonyuk as he’s been on point with these, feel free to ignore if it’s not relevant for you.

About this issue

  • Original URL
  • State: closed
  • Created 4 years ago
  • Comments: 24

Most upvoted comments

it should fix android as well.