Question

我正在使用自定义TabbedRenderer在iOS标签上工作，在渲染器页面中我正在调整大小＆amp;设置图标。但是对于第一个选项卡图标没有调整大小，所有选项卡的其余部分设置图标都很好。

public class CustomTabRenderer_iOS : TabbedRenderer
{
  public override void ViewWillLayoutSubviews()
   {
      base.ViewWillLayoutSubviews();

      foreach (var item in TabBar.Items)
       {

        item.Image = GetTabIcon(item.Title);                                   
       }
   }

  private UIImage GetTabIcon(string title)
  {
      UITabBarItem item = null;
      switch (title)
      {
        case "Dairy":
        item = new UITabBarItem("Dairy", UIImage.FromFile("dairy"), 0);
        break;
        case "My kid":
        item = new UITabBarItem("My kid",UIImage.FromFile("kid"),0);
        break;
        case "Events":
        item = new UITabBarItem("Events", UIImage.FromFile("events"), 0);

        break;
        case "About":
        item = new UITabBarItem("About", UIImage.FromFile("about"), 0);
        break;
      }
      var img = (item != null) ? UIImage.FromImage(item.SelectedImage.CGImage, item.SelectedImage.CurrentScale, item.SelectedImage.Orientation) : new UIImage();

      var imgR = ResizeImage(img, 20, 20);
      return imgR;
  }

     public UIImage ResizeImage(UIImage sourceImage, float width, float height)
        {
           UIGraphics.BeginImageContext(new SizeF(width, height));
           sourceImage.Draw(new RectangleF(0, 0, width, height));
           var resultImage = UIGraphics.GetImageFromCurrentImageContext();
           UIGraphics.EndImageContext();
           return resultImage;
        }
}

以下是PCL项目的TabbedPage

<Shared:MyTabbedPage xmlns="http://xamarin.com/schemas/2014/forms" 
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:local="clr-namespace:edTheSIS"    
    x:Class="edTheSIS.ParentDashboard"
    xmlns:Shared="clr-namespace:edTheSIS.Shared;assembly=edTheSIS">
<local:DairyTabPage Icon="dairy" HeightRequest="10" WidthRequest="10" ></local:DairyTabPage>
  <local:MykidTab   Icon="kid" ></local:MykidTab>
  <local:Events   Icon="events"></local:Events>
  <local:About  Icon="about"></local:About>
</Shared:MyTabbedPage>

见下面的截图

下面的第二个截图

Answer 1

根据iOS Human Interface Guidelines，图片的尺寸应如下表中所示为标签栏。

如果您相应地调整图标大小，它们应始终显示正确。没有理由在代码中重新调整大小。

如果您仍想使用代码调整图标大小，请更新此类ViewWillLayoutSubviews方法，同时设置SelectedImage属性：

public override void ViewWillLayoutSubviews()
{
   base.ViewWillLayoutSubviews();

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

Answer 2

iOS 上的标签栏图标大小可以通过UITabBarItem.ImageInset在自定义TabbedRenderer

中进行设置

[assembly: ExportRenderer(typeof(TabbedPage), typeof(CustomTabbedPageRenderer))]
namespace AppNameSpace.iOS.Renderers
{
    class CustomTabbedPageRenderer : TabbedRenderer
    {
        public override void ViewDidLayoutSubviews()
        {
            base.ViewDidLayoutSubviews();

            if (Element is TabbedPage)
                if (TabBar?.Items != null)
                    foreach (var item in TabBar.Items)
                        item.ImageInsets = new UIEdgeInsets(16, 16, 16, 16);
        }
    }
}

第一个选项卡图标未调整iOS TabbedRenderer的大小

2 个答案: