Open ramonB1996 opened 3 years ago
I resolved this by using a 'space character' as BadgeText
. So " "
will work to display an empty notification dot.
However, I still think the other ways should work aswell, so leaving this open for now.
I resolved this by using a 'space character' as
BadgeText
. So" "
will work to display an empty notification dot.However, I still think the other ways should work aswell, so leaving this open for now.
I can get the badgetextcolor always white to go away with your hack using the empty space " "
. But this ends up making the badge look oblong on Android in my experience.
Hi @StephanRaab,
Sorry for the late reply, but you are right regarding this problem. What I do is use a IValueConverter
in my page to make the BadgeText
different on each platform:
public class NotificationStateToBadgeTextConverter : IValueConverter
{
private const string DefaultAndroidNotificationBadgeText = "o";
private const string DefaultIOSNotificationBadgeText = " ";
public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
{
if (!(value is bool))
{
throw new InvalidOperationException($"{nameof(value)} must be a boolean.");
}
if (targetType != typeof(string))
{
throw new InvalidOperationException("The target must be a string.");
}
if ((bool)value)
{
if (Device.RuntimePlatform == Device.Android)
{
return DefaultAndroidNotificationBadgeText;
}
if (Device.RuntimePlatform == Device.iOS)
{
return DefaultIOSNotificationBadgeText;
}
}
return string.Empty;
}
public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
{
throw new NotImplementedException();
}
}
Then I use it in my page like so:
tabbadge:TabBadge.BadgeText="{Binding ShowNotification, Converter={StaticResource NotificationStateToBadgeTextConverter}}"
Maybe you can get it working that way, I think it looks less bad on Android for me this way. Maybe try different 'letters' as the BadgeText
on Android, have not tried them all myself.
First of all; Thank you for this Plugin!
I am now trying to create a notification-dot (on a tab of a tabbedpage) which is shown after fetching some data. The dot should not have any text in it, but should display with the specified
BadgeColor
. I tried this in 2 ways:BadgeText
and setting theBadgeTextColor
toTransparent
.BadgeText
and setting theBadgeTextColor
the same as theBadgeColor
.Both work perfectly on Android and both fail on iOS for me.
Settings:
I am also using MVVMCross, not entirely sure if that changes anything.
The weird part is, that this will suddenly work after reloading the View by using XAML Hot Reload.
Do you have any ideas what could cause this issue? If you need any extra info, feel free to ask.
Thanks in advance,
Ramon
EDIT: I initiate the badge in my XAML and not via code-behind. I am using DynamicResources for the colors of the
BadgetTextColor
andBadgeColor
.EDIT 2: I found that the following works:
<mvx:MvxTabbedPage.Children> <mvx:MvxContentPage Title="Tab1" tabbadge:TabBadge.BadgeColor="Red" tabbadge:TabBadge.BadgeTextColor="Red" tabbadge:TabBadge.BadgeText="!" /> </mvx:MvxTabbedPage.Children>
However, I would like to navigate to the views and have this code in the child-view itself, so I can use the associated ViewModel