标签栏图标大小

Question

Apple says：

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

不幸的是，他们没有具体说明你何时获得。

此外，我可能会为这两种尺寸包含这些图像，但是系统会自动切换它们（如何？）或者我必须自己做？

Answer 1

你不应该自己做这个，系统可以自动完成。

这是Apple人机界面指南，您可以在其中找到图标分辨率：https://developer.apple.com/ios/human-interface-guidelines/icons-and-images/custom-icons/

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

• 75px×75px（25pt×25pt @ 3x）
• 50px×50px（25pt×25pt @ 2x）
• 25px×25px（25pt×25pt @ 1x）

对于横向模式：

• 54px×54px（18pt×18pt @ 3x）
• 36px×36px（18pt×18pt @ 2x）
• 18px×18px（18pt×18pt @ 1x）

将此图标添加到Assets.xcassets或某处后，您可以从故事板中选择标签栏项目图标：

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

之后系统将为您完成所有事情。

Answer 2

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

您可以找到适用于不同设备的常规/紧凑尺寸故障here。您应该查找第二个值（例如，紧凑宽度，常规高度）。

一旦方向/应用程序窗口发生变化，就会自动在两种类型的图标之间进行更改。

Answer 3

TLDR：您可以通过将Width Class设置为Any＆Compact来为Asset Catalog中的常规或精简选项卡栏指定不同的图标。

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

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

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

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

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

您可以在资产目录中为不同的大小类指定不同的图像。只需在Attributes Inspector中为您设置Width类为Any & Compact标签栏图标图像集：

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

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

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

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

• 25x25 pt（50x50 px @ 2x）用于常规标签栏
• 18x18 pt（36x36 px @ 2x）用于紧凑型标签栏

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

• 23x23 pt（46x46 px @ 2x）用于常规标签栏
• 17x17 pt（34x34 px @ 2x）用于紧凑型标签栏

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

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