2

I am creating an application where I need to implement a badge counter above the icon in ToolbarItem. I am creating a dependancy service for IOS and Android. I reference this URL.

After implementing this I am getting a perfect result in Android, but when I try to run it on an IOS device I'm not able to use that. In that

var rightButtonItems = vc?.ParentViewController?.NavigationItem?.RightBarButtonItems;

always returns null so I am not able to use and set badge counter above the application.

I am using .Net standard class library. I have the same issue as here.

My code:

Badge.xaml

<ContentPage.ToolbarItems>
    <ToolbarItem Icon="notification" Name="MenuItem1" Order="Primary" Priority="0" Text="Notification" Clicked="ToolbarItem_Clicked"/>
</ContentPage.ToolbarItems>

Badge.xaml.cs

private void ToolbarItem_Clicked(object sender, EventArgs e)
{
    Navigation.PushAsync(new Notification());
}
private void ContentPage_Appearing(object sender, EventArgs e)
{
    base.OnAppearing();
    ViewModel.AppearingCommand?.Execute(null);
    if (ToolbarItems.Count > 0)
        DependencyService.Get<IToolbarItemBadgeService>().SetBadge(this, ToolbarItems.First(), "4", Color.Red, Color.White);
}

IToolbarItemBadgeService.cs(In shared project)

public interface IToolbarItemBadgeService
{
    void SetBadge(Page page, ToolbarItem item, string value, Color backgroundColor, Color textColor);
}

ToolbarItemBadgeService.cs(In iOS project)

[assembly: Dependency(typeof(ToolbarItemBadgeService))]
namespace CustomerServiceApp.iOS
{
    public class ToolbarItemBadgeService :  IToolbarItemBadgeService
    {

        public void SetBadge(Page page, ToolbarItem item, string value, Color backgroundColor, Color textColor)
        {
            Device.BeginInvokeOnMainThread(() =>
            {
                var renderer = Platform.GetRenderer(page);
                if (renderer == null)
                {
                    renderer = Platform.CreateRenderer(page);
                    Platform.SetRenderer(page, renderer);
                }
                var vc = renderer.ViewController;
                var rightButtonItems = vc?.ParentViewController?.NavigationItem?.RightBarButtonItems;//Here i get null in rightButtonItems
                // If we can't find the button where it typically is check the child view controllers
                // as this is where MasterDetailPages are kept
                if (rightButtonItems == null && vc.ChildViewControllerForHomeIndicatorAutoHidden != null)//vc.ChildViewControllerForHomeIndicatorAutoHidden is also return null
                    foreach (var uiObject in vc.ChildViewControllerForHomeIndicatorAutoHidden)
                    {
                        string uiObjectType = uiObject.GetType().ToString();
                        if (uiObjectType.Contains("FormsNav"))
                        {
                            UIKit.UINavigationBar navobj = (UIKit.UINavigationBar)uiObject;

                            if (navobj.Items != null)
                                foreach (UIKit.UINavigationItem navitem in navobj.Items)
                                {
                                    if (navitem.RightBarButtonItems != null)
                                    {
                                        rightButtonItems = navitem.RightBarButtonItems;
                                        break;
                                    }
                                }
                        }
                    }
                var idx = page.ToolbarItems.IndexOf(item);
                if (rightButtonItems != null && rightButtonItems.Length > idx)
                {
                    var barItem = rightButtonItems[idx];
                    if (barItem != null)
                    {
                        barItem.UpdateBadge(value, backgroundColor.ToUIColor(), textColor.ToUIColor());
                    }
                }
            });
        }
    }
}

I want this as a sample output and also mention as current status of that. Can anyone look into this and suggest me what should I have to do in that?

Cindy Meister
  • 25,071
  • 21
  • 34
  • 43
Deep Soni
  • 431
  • 4
  • 24
  • From your shared article, there is no problem. https://i.stack.imgur.com/jE96N.png What you have achieve now by reference article.You can share a image. – Junior Jiang Jun 26 '19 at 09:25
  • You can check out LelieCorrea's implementation of this https://github.com/LeslieCorrea/Xamarin-Forms-Shopping-Cart/blob/master/ShoppingCarts/ShoppingCarts/ContentView/CustomNavigationBar.xaml – Saamer Jun 26 '19 at 15:55
  • @Saamer Thanks for the reply. I try that but it doesn't work on the iOS platform. Can you please give any other reference for achieving that on the iOS platform also. – Deep Soni Jun 27 '19 at 04:35
  • @JuniorJiang-MSFT I don't get your point. Can you please explain in brief? – Deep Soni Jun 27 '19 at 04:36
  • @DeepSoni First I need to know whether badge is shown in ios now.If shown , please show a image about it. – Junior Jiang Jun 27 '19 at 05:22
  • @JuniorJiang-MSFT In question I clearly mention what I need in badge please go through image. – Deep Soni Jun 29 '19 at 07:39
  • @DeepSoni From my shared image, you can modify badge's position where you want.You explained two problems in question, and not understanding which problem is . – Junior Jiang Jul 01 '19 at 01:20
  • @JuniorJiang-MSFT My concern is how to set badge above the `ToolbarItem Icon` in Xamarin.Forms? – Deep Soni Jul 04 '19 at 13:05
  • @DeepSoni Sorry for mistaking your point. If `rightButtonItems` return null , you can check if using `NavigationPage` be root page for this page . – Junior Jiang Jul 05 '19 at 01:26
  • @DeepSoni Did you find any solution for your issue? I am facing same problem right now. RightBarButtonItems returns null always. Can you please share your solution. – Gaurang Makwana Oct 31 '19 at 16:27
  • @GaurangMakwana Sorry, still not getting any proper solution for that and also if you find any related blogs or answer then please let me know. – Deep Soni Nov 01 '19 at 04:43
  • Sample Demo: https://drive.google.com/file/d/1c-AfysNr3hnrnb2yplkuewUSMoCFv9-j/view?usp=sharing @DeepSoni When you click on `Second Tab` badge is not working. Can you please look into it and let me know if you have any solution. – Gaurang Makwana Nov 03 '19 at 16:54
  • @GaurangMakwana Sure Let me check and get back to you. – Deep Soni Nov 04 '19 at 08:12
  • @GaurangMakwana You have created a Tabbed page inside that there is also a tabbed page in the second one named as `` and display inner page so values do not get over there and badge value is not showing. – Deep Soni Nov 04 '19 at 08:28

0 Answers0