标签栏图标大小答案

【问题标题】：Tab Bar Icon Size标签栏图标大小
【发布时间】：2018-09-04 15:26:16
【问题描述】：

苹果says:

根据设备和方向，系统会显示常规或紧凑的标签栏。您的应用应包含两种尺寸的自定义标签栏图标。

不幸的是，他们没有说明你什么时候得到的。

我也可能包含这两种尺寸的图像，但系统会自动在它们之间切换（如何？）还是我必须自己做？

【问题讨论】：

【解决方案1】：

您不应该自己执行此操作，系统会自动执行此操作。

例如：如果您为标签栏项目使用圆形图标，您应该为纵向模式创建以下尺寸：

对于横向模式：

将此图标添加到 Assets.xcassets 或某处后，您可以从情节提要中选择 Tab Bar Item 图标：

选择标签栏项目，然后在属性检查器中，为图像字段选择纵向图像，为横向字段选择横向图像。

之后系统会为你做所有事情。

【讨论】：

【解决方案2】：

TLDR：您可以通过将 Width Class 设置为 Any & Compact，为 Asset Catalog 中的常规或紧凑标签栏指定不同的图标。

是的，根据人机界面指南Custom Icons - Tab Bar Icon Size，您应该包括两种图标尺寸

纵向时，标签栏图标显示在标签标题上方¹。在横向模式下，图标和标题并排显示。

¹⁾ 这仅适用于 iPhone。在适用于全屏应用的 iPad 上，图标和标题在纵向和横向上并排显示。

根据设备和方向，系统会显示常规或紧凑的标签栏。您的应用应包含两种尺寸的自定义标签栏图标。

指南正在谈论Size Classes。在这种情况下，常规或紧凑标签栏表示常规或紧凑宽度尺寸类的标签栏。

您可以在资产目录中为不同尺寸类别指定不同的图像。只需在属性检查器中为您的标签栏图标图像集设置 Width class 为 Any & Compact：

在任意宽度部分为常规尺寸类设置较大的图像，在紧凑宽度部分为紧凑尺寸类设置较小的图像。

然后系统会根据尺寸等级（设备、方向、多任务配置）自动显示正确的图像。

您可以在人机界面指南Custom Icons - Tab Bar Icon Size 中找到正确的图标大小。

例如，对于圆形字形，图标应该是：

对于方形字形，图标应为：

宽字形和高字形还有其他尺寸。

在上面的屏幕截图中，我在属性检查器中使用了 Scale 设置为 Single Scale 的 PDF 图像。系统会自动生成 1x、2x 和 3x PNG。

【讨论】：

【解决方案3】：

不幸的是，紧凑/常规状态不仅取决于方向或应用窗口大小，还取决于设备。

您可以找到针对不同设备的常规/紧凑尺寸细分here。您应该寻找第二个值（例如紧凑宽度、常规高度）。

只要方向/应用程序窗口发生变化，两种类型的图标就会自动发生变化。

【讨论】：