ios启动图标规范

ios启动图标规范,第1张

注意:iOS所有图标的圆角效果由系统生成,给到的图标本身不能是圆角的。

1. 桌面图标 (app icon)

for iPhone6 plus(@3x) : 180 x 180for iPhone 6/5s/5/4s/4(@2x) : 120 x 120

2. 系统搜索框图标 (Spotlight search results icon)

iPhone6 plus(@3x) : 120 x 120

iPhone6/5s/5/4s/4(@2x) : 80 x 80

3. 系统设置图标 (Settings icon)

iPhone6 plus(@3x) : 87 x 87for

iPhone6/5s/5/4s/4(@2x) : 58 x 58

4. 启动图片 (launch image)

for iPhoen5s/5(@2x) : 640 x 1136

for iPhoen4s/4(@2x) : 640 x 960

iPhone6/iPhone6 plus 建议使用 launch file 或 storyboard ;如果依然想使用图片,尺寸数值为:

for iPhone 6(@2x) : 750 x 1334

for iPhone 6 plus (@3x) : 1242 x 2208

/////////////////////////////////////////////////////////////////

1、应用程序图标(应用程序所需的图标)

为App Store

启动影像

Spotlight搜索结果图标

设置图标

工具栏和导航栏图标

标签栏图标

默认报刊亭盖为App Store图标

网页剪辑图标

/////////////////////////////////////////////////////////////////

1、图标尺寸

app store:

1024*1024  160(retina屏)

512*512  80(普通屏)

主屏幕

144*144  18(retina屏)

57*57  9(普通屏幕)

iphone设置与搜索

58*58  10(retina屏幕)

29*29  5(普通屏幕)

图标按照最大1024*1024来设计,之后按照每个比例缩小到每个尺寸,再进行调整。提交没有高光和直角阴影的方形即可。

2、按钮和图片

可点击的按钮和图片不能小于88px*88px,如果小于,请以透明空白区域填充。单独存在的部件尺寸必须是偶数尺寸。充分考虑每个按钮的四个状态:默认(default)、按下(highlighted)、选中(selected)、不可点击(disabled)

3、

标签栏高度:20pt

导航栏高度:44pt

导航栏图标约22pt

标签栏高度49pt

标签栏图标约60pt

工具栏高度88pt

4、图标命名规范

模块_类别_功能_状态·png

/////////////////////////////////////////////////////////////////

我会把App内的图标分成四类进行规范设计:第一类顶部栏内的图标;第二类底部导航栏内的图标;第三类内容区域的图标;第四类d窗、浮层内的图标。

1.顶部栏内的图标

在设计顶部栏内的图标时应注意,图标的高度不能超过顶部栏高度的一半。以750x1334 px的尺寸为例,顶部栏高度为88 px,图标不能超过顶部栏的一半就是44 px, 但为了页面的美观感与整体性,图标的高度最好与顶部栏标题的字高度保持一直,一般图标的高度控制在32-36 px左右。

2.底部导航栏内的图标

底部导航栏内不仅只有图标,一般每个图标下都会有对应的文字,这种情况就比较复杂,因为你需要把图标距上间距、图标与文字间距、文字距下间距等因素考虑进去。图标与文字上下间距一般控制在20 px左右,文字大小在20 px左右,图标与文字间距控制在14 px范围内,最终图标的大小在40-44 px左右。 和顶部栏的原则一样,底部导航栏的图标不能超过其高度的一半,若底部导航栏高度为98 px,图标不要超过48 px, 再加上底部导航栏的文字48 px高的图标也不太合适,所以以我的经验之谈,最佳高度是44 px。

3.内容区域的图标

其实仔细研究就会发现,App里的图标分为两种,一种是可点击的,一种是起修饰作用的不能点击的。可点击的图标往往比起修饰作用的图标大。我在做内容区域的图标时为了使整体的App看上去比较统一,图标的大小范围和顶部栏、底部导航栏的图标上下不超过2-4个像素,基本和文字的高度一致。可点击图标范围在32-36 px左右, 不可点击图标范围在24-28 px左右。

/////////////////////////////////////////////////////////////////

iphone4、5、6状态栏、导航栏、标签栏大小分别为:40px,88px,98px

1、首先,点击打开桌面上的设置图标,进入设置页面。

2、然后点击设置页面中的控制中心。

3、在控制中心中,点击自定控制。

4、自定义控制中有很多小工具,点击如图所示的+图标能将这些小工具添加进来。

5、如图所示,添加了这个屏幕录制的小工具,想要删减一些工具点击如图所示图标即可。

6、这样上拉工具栏可以看到就能自定义工具栏图标了。


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/6390494.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-03-21
下一篇 2023-03-21

发表评论

登录后才能评论

评论列表(0条)

保存