iPhone应用程序图标 – 准确的半径？

我试图为我的iPhone应用程序创build图标，但不知道如何获得iPhone图标使用的确切半径。 我search了一个教程或模板，但找不到一个。

我敢肯定，我只是一个白痴，但你如何从你的Illustrator或Photoshop的图标完全正确的圆angular？

编辑：

Retina iPad的半径是多less？

Answer 1

你可以为你的应用制作四个图标（截至今天），它们都可以有不同的外观 – 不一定基于512×512的图像。

• 512×512图标的圆angular半径= 80 （iTunesArtwork）
• 1024×1024图标的拐angular半径= 180 （iTunesArtwork Retina ）
• 57×57图标的拐angular半径= 9 （iPhone / iPod Touch）
• 114×114图标的拐angular半径= 18 （iPhone / iPod Touch Retina ）
• 圆angular半径为72×72图标= 11 （iPad）
• 144×144图标的拐angular半径= 23 （iPad Retina ）

如果您创build了一组自定义图标，则可以在您的info.plist文件中将UIPrerenderedIcon选项设置为true，并且不会添加光泽效果，但会在其下方放置黑色背景，并且仍然围绕具有这些angular的图像边angular半径，所以如果任何图标上的拐angular半径大于边缘/拐angular处的黑angular。

编辑：从@ devin-g-rhode查看评论，你可以看到任何未来的图标大小应该有一个1:6.4的angular半径与图标大小的比例。 从https://stackoverflow.com/a/29550364/396005还有一个非常好的答案，它具有SDK中用于舍入图标angular的图像蒙版文件的位置;

要添加视网膜兼容文件，请使用相同的文件名并添加“@ 2x”。 因此，如果我有一个名为icon.png的72×72图标的文件，我还会在项目/目标中添加一个名为[e-mail]的114×114 PNG文件，Xcode会自动将其用作视网膜显示屏上的图标。 如果你做得对，你可以在应用程序目标的“摘要”页面上看到这个动作。 启动图像的作品也是一样的。 使用320×480的launch.png和640×960的[e-mail]。

Answer 2

在本文中尝试了一些答案之后，我咨询了Louie Mantia（前Apple，Square和Iconfactorydevise师），到目前为止，在这篇文章中的所有答案都是错误的（或者至less是不完整的）。 苹果从57px图标开始，半径为10，然后从那里放大或缩小。 因此，您可以使用10/57 x new size （例如10/57 x 114给出20，这是114px图标的正确半径）计算任意图标大小的半径。 以下是最常用的图标，适当的命名约定，像素尺寸和angular半径的列表。

1. Icon1024.png – 1024px – 179.649
2. Icon512.png – 512px – 89.825
3. Icon.png – 57px – 10
4. [e-mail] – 114px – 20
5. Icon-72.png – 72px – 12.632
6. [e-mail] – 144px – 25.263
7. Icon-Small.png – 29px – 5.088
8. [e-mail] – 58px – 10.175

另外，正如其他答案中所提到的，您实际上不想裁剪任何在二进制文件中使用的图像或提交给Apple。 这些都应该是方形的，没有透明度。 苹果会自动在适当的上下文中掩盖每个图标。

但是，了解上述内容对于应用程序UI中的图标使用非常重要，您必须在代码中应用遮罩或在Photoshop中预先渲染。 创build网站和其他宣传材料的图稿也很有帮助。

补充阅读：

Neven Mrgan在额外的图标大小和其他devise考虑： iOS应用程序图标大小

Bjango的Marc Edwards关于在Photoshop中创build圆angular的不同选项以及为什么它很重要： 圆形

苹果官方文档的图标大小和devise考虑： IconsImages

更新：

我在Photoshop CS6中做了一些testing，看起来像小数点后面的3位数字足够精确到完全相同的vector（至less在Photoshop中以3200％的缩放比例显示）。 Round Rect Tool有时会将input四舍五入到最接近的整数，但您可以看到90到89.825之间的显着差异。 圆形矩形工具几次没有收尾，实际上在小数点后显示了多个数字。 不知道那里发生了什么事情，但它肯定是使用和存储input更精确的数字。

无论如何，我已经更新了上面的列表，包括小数点后3位数字（在13之前！）。 在大多数情况下，可能很难区分一个透明的512像素半径的图标和一个被屏蔽的半径为89.825的图像，但圆angular的抗锯齿肯定会稍有不同，并且在某些情况下可能会更明显如果第二个更精确的掩码由苹果公司以代码或其他方式应用。

Answer 3

重要提示：iOS 7图标公式

随着即将发布的iOS 7，你会注意到“标准”图标半径已经增加。 所以试着做苹果和我build议的这个答案。

看起来，对于120像素的图标来说，在iOS 7上最能体现其形状的公式是以下超级椭圆：

 |x/120|^5 + |y/120|^5 = 1 

显然你可以改变所需的图标大小的120号码，以获得相应的function。

原版的

您应该提供一个具有90°angular的图像（避免裁剪图标的angular落非常重要，iOS应用程序会在应用angular圆angular蒙版时为您做这些）（ Apple文档 ）

最好的办法不是四舍五入你的图标的angular落。 如果您将图标设置为方形图标，则iOS会自动覆盖带有预定义蒙版的图标，以设置相应的圆angular。

如果您为图标手动设置圆angular，则可能会在此设备或该设备中看起来破损，因为舍入蒙版恰巧会从iOS版本稍微更改为另一个。 有时候，你的图标会稍微大一点，有时候（叹气）稍微小些。 使用方形图标可以使您摆脱这种负担，并且您将确保为您的应用程序提供总是最新的，好看的图标。

此方法适用于每个图标大小（iPhone / iPod / iPad /视网膜）以及iTunes图稿。 我遵循这个方法几次，如果你想我可以发布一个链接到一个使用本地方形图标的应用程序。

编辑

为了更好地理解这个答案，请参阅有关iOS图标的官方Apple文档 。 在这个页面中清楚地表明，当在iOS设备上显示时，方形图标会自动获取这些东西：

1. 圆angular
2. 投下阴影
3. 反光闪耀（除非你防止闪耀效果）

所以，只要画一个简单的方形图标并填充内容，就可以达到任何效果。 最后一个angular落的半径与其他答案相似，但这是不能保证的，因为这些数字不是iOS官方文档的一部分。 他们要求你画正方形的图标，所以……为什么不呢？

Answer 4

我看到很多“px”的讨论，但是没有人谈论你想要计算的固定数量的百分比

这里的关键比例是15.625％ 。 将上面提到的任何图像大小乘以0.15625，您将得到该大小的正确像素半径。

编辑 ：感谢@克里斯王子与iOS 8/9/10半径百分比： 22.37％

Answer 5

从dbarnard的答案有公式计算正确的半径，但因为你正在寻找模板，所有的掩码和覆盖可以在这个目录中find：

 /Applications/Xcode.app/Contents/Developer/Platforms/iPhoneSimulator.platform/Developer/SDKs/iPhoneSimulator5.1.sdk/System/Library/PrivateFrameworks/MobileIcons.framework 

（path是XCode的最新版本，旧版本可能在/ Developer /中）。

正如其他人已经指出，你不应该自己掩盖他们，但你可以使用这些来检查你的图标一旦被掩盖后将看起来如何。

（这一发现的信贷去Neven Mrgan IIRC）

Answer 6

57 x 57像素图标的拐angular半径为9像素。

Answer 7

如果不考虑笔画，57×57图标的确切半径实际上是10px。

我从iconreference获取这个信息。

Answer 8

正如其他人所说，你不想绕过你的angular落。 你想平板（没有图层或阿尔法）方形graphics。 苹果公司改变了他们用来在iOS7中四舍五入的面具，然后再在iOS8中使用的面具。 你可以在你的Xcode应用程序包中find这些面具。 每个新发布的SDK版本都会改​​变path。 所以，我会告诉你如何总能find它。

 find /Applications/Xcode.app/Contents/Developer/Platforms/iPhoneSimulator.platform/Developer/SDKs -name 'MobileIcons.framework' 

在这一刻，该命令find的path是/Applications/Xcode.app/Contents/Developer/Platforms/iPhoneSimulator.platform/Developer/SDKs/iPhoneSimulator.sdk/System/Library/PrivateFrameworks/MobileIcons.framework但是不要相信。 使用该命令自己find它。

该path指向一个包含这些文件的目录（同样，在这篇文章的时候）

 ./AppFolderBadgeIconMask-128_1only_.png ./AppFolderBadgeIconMask-16_1only_.png ./AppFolderBadgeIconMask-256_1only_.png ./AppFolderBadgeIconMask-32_1only_.png ./AppFolderBadgeIconMask-512_1only_.png ./AppFolderBadgeIconOverlay-128_1only_.png ./AppFolderBadgeIconOverlay-16_1only_.png ./AppFolderBadgeIconOverlay-256_1only_.png ./AppFolderBadgeIconOverlay-32_1only_.png ./AppFolderBadgeIconOverlay-512_1only_.png ./AppFolderBadgeIconShadow-128_1only_.png ./AppFolderBadgeIconShadow-16_1only_.png ./AppFolderBadgeIconShadow-256_1only_.png ./AppFolderBadgeIconShadow-32_1only_.png ./AppFolderBadgeIconShadow-512_1only_.png ./AppIconMask@2x~ipad.png ./AppIconMask@2x~iphone.png ./AppIconMask@3x~iphone.png ./AppIconMask~ipad.png ./AppIconMask~iphone.png ./CarAppIconMask.png ./CarNotificationAppIconMask.png ./DefaultIcon-20.png ./[e-mail] ./[e-mail] ./DefaultIcon-29.png ./[e-mail] ./[e-mail] ./DefaultIcon-40.png ./[e-mail] ./[e-mail] ./DefaultIcon-60@2x~iphone.png ./DefaultIcon-60@3x~iphone.png ./DefaultIcon-76@2x~ipad.png ./DefaultIcon-76~ipad.png ./DocumentBadgeMask-145.png ./[e-mail] ./DocumentBadgeMask-20.png ./[e-mail] ./[e-mail] ./DocumentBase-320@2x~ipad.png ./DocumentBase-320~ipad.png ./DocumentBase-48.png ./[e-mail] ./[e-mail] ./DocumentMask-320@2x~ipad.png ./DocumentMask-320~ipad.png ./DocumentMask-48.png ./[e-mail] ./[e-mail] ./[e-mail] ./[e-mail] ./[e-mail] ./[e-mail] ./[e-mail] ./[e-mail] ./[e-mail] ./[e-mail] ./[e-mail] ./[e-mail] ./[e-mail] ./[e-mail] ./NewsstandDefaultMagazine_1only_.png ./NewsstandDefaultNewspaper_1only_.png ./NewsstandMagazineGradientLeft@2x~ipad.png ./NewsstandMagazineGradientLeft@2x~iphone.png ./NewsstandMagazineGradientLeft~ipad.png ./NewsstandMagazineGradientLeft~iphone.png ./NewsstandMagazineGradientRight@2x~ipad.png ./NewsstandMagazineGradientRight@2x~iphone.png ./NewsstandMagazineGradientRight~ipad.png ./NewsstandMagazineGradientRight~iphone.png ./NewsstandMagazineSwitcherGradientLeft.png ./[e-mail] ./NewsstandNewspaperGradientBottom@2x~ipad.png ./NewsstandNewspaperGradientBottom@2x~iphone.png ./NewsstandNewspaperGradientBottom~ipad.png ./NewsstandNewspaperGradientBottom~iphone.png ./NewsstandNewspaperGradientLeft@2x~ipad.png ./NewsstandNewspaperGradientLeft@2x~iphone.png ./NewsstandNewspaperGradientLeft~ipad.png ./NewsstandNewspaperGradientLeft~iphone.png ./NewsstandNewspaperGradientRight@2x~ipad.png ./NewsstandNewspaperGradientRight@2x~iphone.png ./NewsstandNewspaperGradientRight~ipad.png ./NewsstandNewspaperGradientRight~iphone.png ./NewsstandNewspaperSwitcherGradientBottom.png ./[e-mail] ./NewsstandNewspaperSwitcherGradientLeft.png ./[e-mail] ./NewsstandNewspaperSwitcherGradientRight.png ./[e-mail] ./NewsstandThumbnailShadow@2x~ipad.png ./NewsstandThumbnailShadow@2x~iphone.png ./NewsstandThumbnailShadow~ipad.png ./NewsstandThumbnailShadow~iphone.png ./NotificationAppIconMask.png ./[e-mail] ./[e-mail] ./SpotlightAppIconMask.png ./[e-mail] ./[e-mail] ./TableIconMask.png ./[e-mail] ./[e-mail] ./TableIconOutline.png ./[e-mail] ./[e-mail] 

正如你所看到的，有很多不同的面具，但他们的名字很清楚。 这里是AppIconMask@3x~iphone.png图片：

你可以使用它来testing你的图标 ，看它是否会被掩盖后看起来不错。 但是， 不要绕过你的angular落 。 如果你这样做，当苹果再次改变这些面具，你会有文物。

Answer 9

所有以前对这个问题的答案现在都过时了。 自2015年5月以来，苹果公司要求您提供正方形的图标，而不是舍入：

保持图标angular落正方形。 系统会自动应用一个将图标边angular倒圆angular的蒙版。

https://developer.apple.com/ios/human-interface-guidelines/graphics/app-icon/

Answer 10

当用Photoshopdevise我的应用程序图标时，我发现没有整数圆angular半径恰好适合设备的面具。

我现在所做的是用Xcode创build一个空的项目，设置一个完全白色的PNG文件作为图标，并closures预设的斜面和光泽度。 然后，我运行该应用程序并截取主屏幕。 现在，您可以轻松地从该图像创build一个遮罩，您可以在Photoshop中使用该遮罩。 这将让你完美的圆angular。

Answer 11

iphone为你转angular，你需要的只是一个方形的57×57 png图标，你应该很好

Answer 12

有两个完全相冲突的答案 ，其中一个是160px @ 1024，另一个是180px @ 1024。 那么巫婆呢？

我跑了一些实验，我认为这是180px @ 1024所以drbarnard是正确的。

我从App Store下载了iTunes U图标，它的大小是175x175px，我在photoshop中将它放大到1024px，并在其上放置两个形状，一个半径为160px，另一个为180px。

正如你可以看到下面的形状（灰色细线）160px（第一个）是有点closures，而180px看起来很好。

这就是我现在在PhotoShop中所做的：

1. 我为主devise智能对象创build了一个尺寸为1026x1026px的canvas， 并带有一个180像素的蒙版。
2. 我复制主智能对象5次，并将其大小调整为1024像素，144像素，114像素，72像素和57像素。
3. 我在每个智能对象上放置了一个“新build基础切片”，并且根据它们的大小（例如图标-72px）重命名切片。
4. 当我保存的作品，我select“所有用户切片”和BANG！ 我有我的应用程序所需的所有图标。

Answer 13

我尝试了228px的半径，它工作:)

Answer 14

您不需要将angular落半径应用于应用图标，只需应用方形图标即可。 该设备将自动应用angular半径。

Answer 15

人们争论的angular落半径略有增加，但事实并非如此。

从这个博客 ：

苹果物理产品的一个“秘密”是它们避免相切（半径在一个点上遇到一条线），并用所谓的曲率连续性来制作曲面。

iOS上的图标不需要应用圆angular半径。 只要提供方形图标。