如何在 Xamarin.Forms iOS 自定义渲染器中使用 Apple 系统图标作为选项卡图标？

Question

我偶然发现了这个指南：

https://developer.apple.com/ios/human-interface-guidelines/graphics/system-icons/

我想使用其中的一些图标。有没有办法做到这一点，还是我必须搜索我自己的类似图标 png 并使用它们？

请注意，如果我应该这样做，我可以使用自定义渲染器。我是 Xamarin 的新手，如果有任何关于如何做到这一点的建议，我将不胜感激。

这是我的自定义渲染器的示例。但是我还是不明白如何使用系统图标：

    private void OnTabBarReselected(object sender, UITabBarSelectionEventArgs e)
    {
        //PhrasesFrameRendererClass frame = new PhrasesFrameRendererClass();
        var tabs = Element as TabbedPage;
        var playTab = tabs.Children[0];
        if (TabBar.SelectedItem.Title == "Play")
        {
            if (tabs != null)
            {
                playTab.Title = "Pause";
                playTab.Icon = "pause.png";
                playTab.Icon =  UITabBarSystemItem.Featured;
            }
            AS.runCardTimer = true;
        }
        else if (TabBar.SelectedItem.Title == "Pause")
        {
            if (tabs != null)
            {
                playTab.Title = "Play";
                playTab.Icon = "play.png";
                AS.phrasesFrame.SetTimerLabel("paused");
            }
            AS.runCardTimer = false;
        }

    }

这是我分配图标的方式。如果可能的话，我也想在自定义渲染器中这样做：

    public MainPage()
    {
        InitializeComponent();

        var phrasesPage = new NavigationPage(new PhrasesPage())
        {
            Title = "Pause",
            Icon = "pause.png"
        };
        var settingsPage = new NavigationPage(new SettingsPage())
        {
            Title = "Settings",
            Icon = "settings.png"
        };
        var aboutPage = new NavigationPage(new AboutPage())
        {
            Title = "About",
            Icon = "info.png"
        };
        var categoriesPage = new NavigationPage(new CategoryGroupPage())
        {
            Title = "Cards",
            Icon = "tab.png"
        };

        Children.Add(phrasesPage);
        Children.Add(categoriesPage);
        Children.Add(settingsPage);
        Children.Add(aboutPage);
    }

Answer 1

您的页面需要一个自定义渲染器。在我的示例中，它是 CustomTabsPage 类。您不能只使用系统图标来创建 UIImage。我们需要使用 UITabBarItem。问题是 UITabBarItem 不允许更改标题和图像/图标。但我们可以从中复制一张图片。

using ButtonRendererDemo;
using ButtonRendererDemo.iOS;
using Xamarin.Forms;
using Xamarin.Forms.Platform.iOS;

[assembly: ExportRenderer(typeof(CustomTabsPage), typeof(CustomTabsPageRenderer))]
namespace ButtonRendererDemo.iOS
{
    public class CustomTabsPageRenderer : TabbedRenderer
    {

         #region Sytem Image with custom title

        public override void ViewWillAppear(bool animated)
        {
            base.ViewWillAppear(animated);

            foreach (var item in TabBar.Items)
            {
                item.Image = GetTabIcon(item.Title);
            }
        }

        private UIImage GetTabIcon(string title)
        {
            UITabBarItem item = null;

            switch (title)
            {
                case "Profile":
                    item = new UITabBarItem(UITabBarSystemItem.Search, 0);
                    break;
                case "Settings":
                    item = new UITabBarItem(UITabBarSystemItem.Bookmarks, 0);
                    break;
            }

            var img = (item != null) ? UIImage.FromImage(item.SelectedImage.CGImage, item.SelectedImage.CurrentScale, item.SelectedImage.Orientation) : new UIImage();
            return img;
        }

        #endregion
    }
}