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

我确信我只是一个白痴,但你如何让圆角与你的图标从Illustrator或Photoshop完全正确?

编辑:

Retina iPad的半径是多少?


当前回答

有两个完全矛盾的答案,一个是160px@1024,另一个是180px@1024。女巫呢?

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

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

正如你可以看到下面的形状(细灰线)160px(第一个)是有点偏离,而一个180px看起来很好。

这是我现在在PhotoShop中所做的:

我创建一个大小为1026x1026px的画布,主蒙版为180px 设计智能对象。 我复制主智能对象5次,并将其大小调整为1024px, 144px, 114px, 72px和57px。 我在每个智能对象上放了一个“新建分层切片”,我根据它们的大小重命名切片(例如icon-72px)。 当我保存艺术品时,我选择“All User Slices”,然后BANG!我有 所有图标必须为我的应用程序。

其他回答

重要:iOS 7图标方程式

随着即将发布的iOS 7,你会注意到“标准”图标半径已经增加。所以试着按照苹果和我给出的答案去做吧。

对于120px的图标,在iOS 7上最能代表其形状的公式是下面的超椭圆:

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

显然,你可以改变120的数字与所需的图标大小,以获得相应的功能。

原始

你应该提供一个有90°角的图像(这很重要 避免裁剪图标的边角——ios会为你这样做 应用圆角蒙版) (苹果文档)

最好的方法是完全不要把图标的边角弄圆。如果你将图标设置为方形图标,iOS会自动用预定义的掩码覆盖图标,并设置适当的圆角。

如果你手动为图标设置圆角,它们在这个或那个设备上看起来可能会坏掉,因为在不同的iOS版本之间,圆角蒙版会有轻微的变化。有时候你的图标会稍微大一点,有时候(唉)稍微小一点。使用方形图标将使你摆脱这种负担,你将确保你的应用程序有一个最新的和好看的图标。

这种方法适用于各种图标大小(iPhone/iPod/iPad/retina),也适用于iTunes图像。我曾多次采用这种方法,如果你愿意,我可以发布一个使用原生方形图标的应用程序链接。

Edit

为了更好地理解这个答案,请参考苹果官方关于iOS图标的文档。在这个页面中,它清楚地说明了一个正方形图标将自动获得这些东西时,显示在iOS设备上:

圆角 阴影 反光(除非你防止反光效果)

所以,你可以实现任何你想要的效果,只需绘制一个普通的正方形图标,并在其中填充内容。最终的角半径将与这里的其他答案相似,但这永远无法保证,因为这些数字不是苹果iOS官方文档的一部分。他们让你画方形图标,所以…为什么不呢?

人们争论角半径会稍微增加,但事实并非如此。

来自这个博客:

苹果实体产品的一个“秘密”是它们避免了切线(半径在某一点与直线相交),并以所谓的曲率连续性来制作它们的表面。

你不需要在iOS的图标上应用圆角半径。只需要提供方形图标。但如果你还想知道怎么做,实际的形状被称为Squircle,下面是公式:

我看到很多关于“px”的讨论,但没有人谈论百分比,这是你想要计算的固定数字。

22.37%是这里的关键百分比。将上面提到的任何图像大小乘以0.2237,您将得到该尺寸的正确像素半径。

在iOS 8之前,苹果使用的舍入较少,为15.625%。

编辑:感谢chris Prince评论iOS 8/9/10的半径百分比:22.37%

dbarnard的答案有公式来计算正确的半径,但因为你是在寻找模板,所有的蒙版和覆盖都可以在这个目录中找到:

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

(路径是最新版本的XCode。对于旧版本,它可能在/Developer/)内部。

正如其他人所指出的,你不应该自己屏蔽它们,但你可以使用这些来检查你的图标在屏蔽后的样子。

(这一发现归功于Neven Mrgan IIRC)

WWDC 2022带来了好消息!

现在,Xcode 14根据单个输入图标1024x1024 pix(单个大小)自动生成所有所需的应用程序图标大小。然而,如果你需要一个老派的方法,从下拉菜单中选择所有大小。

所以,你现在要知道的是输入图标的半径是180像素。