ios开发切图,iOS切图

在ios手机开发时需要的icon切图有哪几种规格

这两个一般用在大中尺寸足够了，应该都是给android的，现在又苹果的就当然给苹果的了，而480宽度对应的是HDPI，一般480*800的。

创新互联专业为企业提供东区网站建设、东区做网站、东区网站设计、东区网站制作等企业网站建设、网页设计与制作、东区企业网站模板建站服务，10年东区做网站经验，不只是建网站，更提供有价值的思路和整体网络服务。

每个DPI等级切一套图，可以保证这个像素密度下的图像显示清晰，有一些图片压缩后会看着变形，所以还是多干点活吧。

【iOS】iOS开发之使用Mac自动操作制作@1x@2x@3x图片（切图）

iOS开发中，会要求导入@1x、@2x和@3x：

使用@1x格式： iPhone3GS

使用@2x格式： iPhone 4，4S，5，5S，5C，SE，6，6S，7，8，XR

使用@3x格式： iPhone 6Plus、6sPlus、7Plus、8Plus、X、XS、XS Max

这样在开发过程中，将三种图片（比如分别为1.png、1@2x.png和1@3x.png）导入到工程图库中的时候可以自动被识别为1x、2x和3x大小的图片

可以利用Mac系统中自带的服务自己 制作一个快速生成@1x、@2x和@3x图片的功能

首先spotlight搜索Automator，然后按Enter打开

**新建文稿 **

选取文稿类型为 快速操作

在工作流程收到当前的后面选择图像文件

在左边窗口的“操作”下，选择“资源库”中的“文件和文件夹”，将右侧中的“给访达项目重新命名”拖入最右侧的大窗口中，（如果警告提示是否要增加一个“拷贝访达项目”操作，选择“不添加”），选择“添加文本”，在输入框中输入【@3x】

拖入“复制访达项目”

选择左侧“资源库”中的照片，将“缩放图像”拖入右侧窗口（如果警告提示是否要增加一个“拷贝访达项目”操作，选择“不添加”），并选择“按百分比”，输入【66】

再拖入“文件和文件夹”下的“给访达项目重新命名”，并选择【替换文本】，查找【“】，以【仅基本名称】；****再拖入“文件和文件夹”下的“给访达项目重新命名”，并选择【替换文本】，查找【@3x”的副本】，以【仅基本名称】，替换成【@2x】

拖入“复制访达项目”，选择左侧“资源库”中的照片，将“缩放图像”拖入右侧窗口（如果警告提示是否要增加一个“拷贝访达项目”操作，选择“不添加”），并选择“按百分比”，输入【50】

再拖入“文件和文件夹”下的“给访达项目重新命名”，并选择【替换文本】，查找【“】，以【仅基本名称】，再拖入“文件和文件夹”下的“给访达项目重新命名”，并选择【替换文本】，查找【@2x”的副本】，以【仅基本名称】

然后保存，将“快速操作”存储为“制作@2x@3x图片”

每次使用的时候，只需选中图片，选择访达 - 服务 - 制作@2x@3x图片，****就会自动生成三个图片：1.png、1@2x.png和1@3x.png

最终效果～

UI设计规范一iOS字体和切图及规范

我个人设计时按照iOS设计尺寸 iPhone6（750px*1334px）来进行页面的设计。在iOS开发中iPhone4、5、6、7是共用一套字体规范。在设计中按iPhone6设计版尺寸（750px*1334px）中适合的字体大小来定义。（开发过程中具体的问题需再具体分析）

在iOS中默认字体分为三类：

第一类： STHeiti-Light.ttc和STHeiti-Medium.ttc代表的是中文字体，常用的方正黑体简体（不能商用）和微软雅黑（不能商用），也可以是冬青黑体简体（暂不详版权）和思源雅黑（免费）。

第二类： _H_Helvetica.ttc和_H_HelveticaNeue.ttc代表的是英文以及数字字体，常用的字体Helvetica

第三类： LockClock.ttf代表的是锁屏时间字体

中文字体： Mac下黑体、微软雅黑、华文黑体、方正黑体简体、思源雅黑、冬青黑体简体等（，看个人习惯，具体设计需求也可以是不常见字体）

英文字体： HelveticaNeue , Arial Bold(Regular)(具体设计需求也可以是不常见字体），在选用不常见字体要在后面切图中：相关的字体要有图片形式导出.png图片，以及如有需要要有文字的字体包，当然还有使用版权的许可。

文件包命名规则是：项目名字＋切图＋作者名字＋日期

例如：蚂蚁金服基金3.5.8.5版本迭代-H5页面设计_切图_李笑_20170321

文件包压缩一直采用.zip格式

文件包要包括：image，效果图＋标注图，切图简单说明（word等文件）。

打开如下图：

在image中切图文件和切图命名中：

···不要出现大写，

···不要有中文、特殊符号以及空格，

···字母必须是小写字母，

···同类切图大小一致（后续文章单独整理切图方法和常见问题）

···iOS切图文件要有二倍像素适配（750px*1334px）iphone6，iphone7和三倍像素适配（1242px*2208px）iphone6 plus，iphone7 plus。需要在名字后面分别加 @2x 和 @3x。具体命名方法是：

模块_类别_功能_状态_@2x／@3x.png  （状态会有：点击状态，点击压下状态，禁用状态，选中状态等）

如：me_bg_nologin@3x.png和me_bg_nologin @2x.png

···iphone4：640X960

···iphone5：640X1136

···iphone6/7：750X1334

···iphone6/7：1242X2208

iPhone图标尺寸及整理如下：

后续会不断的整理和添加修正，欢迎批评指正

如果有用请分享给需要的朋友们

谢谢~

iOS、Android 开发单位换算及 UI 切图要求

在移动端 UI 设计中，经常会用到的单位有 4 种：px、pt、dp 和 sp，很多人分辨不清这几种单位及其换算关系，以及 iOS 和 Android 的切图要求，我在这里做下简单的介绍，希望大家读完后能有所收获（如有错误，欢迎纠正）。

px 即 pixel，像素点，电子屏幕上组成图像的最基本单位，在描述屏幕分辨率时也会使用该单位。1px 表示一个像素，例如 iPhone 8 的尺寸为 750px × 1334px，表示在该手机屏幕上，水平方向每行有 750 个像素点，垂直方向每列有 1334 个像素点。

pt 即 point，有两个含义：一是印刷行业常用单位，是一个标准长度单位，绝对大小，1pt = 1/72 英寸 = 0.35mm；二是 iOS 开发用的基本单位，当设计师以 1 倍尺寸进行设计 (375pt × 667pt) 并给出标注稿时，开发人员无需除以 2 便可直接使用。

dp 是安卓开发用的基准单位，在 dpi (屏幕像素密度，即每英寸包含的像素点) 为 160 的屏幕为上，1dp = 1px。为了简单起见，Android 把屏幕密度分为了 5 种：mdpi、hdpi、xhdpi、xxhdpi、xxxhdpi，下文会详细介绍其换算关系。

在安卓系统里，sp 与 dp 类似，不同的是 sp 可以根据用户的字体大小首选项进行缩放，而 dp 则不会。 尽量使用 dp 作为空间大小单位，sp 作为文字相关大小单位，例如：新闻类和短信类等大篇幅文本，推荐使用 sp 为单位。

在 iOS 开发中，不同机型的 iPhone 设备需要用到不同倍率的切图，下表格为各 iPhone 机型显示屏参数对比：

这里再简单了解下两个概念，ppi 和 dpi。

ppi (iOS)：即 pixel per inch，屏幕像素密度，表示每英寸所包含的像素点，该值越高，屏幕越细腻。

dpi (iOS) ：开发像素密度，表示每英寸所包含的开发像素点。

在 iOS 开发中，规定以 ppi = 163，dpi = 163 作为开发基准，

当 ppi = 163，dpi = 163 时，则 1pt = 1px；

当 ppi = 326，dpi = 163 时，则 1pt = 2px；

当 ppi = 401，dpi = 154 时，则 1pt = 2.6px ≈ 3px。

(为什么 iPhone 8+/7+/6+ 的开发基准是154？可能要问问苹果了...)

依此类推，得出换算公式一：

若有小数，四舍五入即可。

在 iOS 开发中，目前只需要 @2x 和 @3x 两种切图，所以导出 2 倍和 3 倍的 png 图片即可。导出前注意检查切图是否存在半像素、毛边等情况，保证对齐像素，这样才能有效避免上线后页面上的 icon 出现虚边的问题，提高细节质量。

另外补充一点：从整体开发尺寸看，iPhone 8 是 375 × 667 pt (@2x)，而 iPhone X 是 375 × 812 pt (@3x)，同样的宽度，一个用 @2x 图，一个用 @3x 图，iPhone X 表现出了更高的清晰度，如图 2-1 所示。

在 Android 开发中，因为机型参差不齐，需要用屏幕密度来区分设计。

注意，这里的 dpi (Android) 和上文的 dpi (iOS) 是不同的概念，dpi (iOS) 是开发像素密度，而 dpi (Android) 即 dot per inch，表示屏幕像素密度 ，类似 iOS 开发里的 ppi。

Android 中，规定以 dpi = 160 为开发基准，

当 dpi = 160，基准dpi = 160，1dp = 1px；

当 dpi = 240，基准dpi = 160，1dp = 1.5px；

当 dpi = 320，基准dpi = 160，1dp = 2px。

依此类推，得出换算公式二：

在设计图标时，对于 5 种主流的屏幕像素密度 (mdpi、hdpi、xhdpi、xxhdpi、xxxhdpi) 应按照 2:3:4:6:8 的比例进行缩放，如图 3-1 所示。

例如，一个启动图标的尺寸为 48 × 48 dp，这表示在 mdpi 的屏幕上其实际尺寸应为 48 × 48 px；在 hdpi 的屏幕上其实际大小是 mdpi 的 1.5 倍 (72 × 72 px)；在 xhdpi 的屏幕上其实际大小是 mdpi 的 2 倍 (96 × 96 px)，依此类推。

在某些况行下，还需要提供一种特殊的切图： 点九图 (上图所示)。点九图是 Android 开发中用到的一种特殊格式的图片，文件名以 “.9.png” 结尾。

这种图片能告诉程序，图像哪一部分可以被拉升，哪一部分不能被拉升需要保持原有比列。运用点九图可以保证图片在不模糊变形的前提下做到自适应，比如对话框背景图片就会用到点九图。

--

以上是全部内容，感谢你的阅读！

End