【iOS】Tab Bar 的 Item 按钮的像素大小要求

根据苹果官方人机界面指南(Human Interface Guidelines)可以得知:

iOS系统会根据设备和方向显示两种标签栏:常规(Regular)紧凑(Compact),所以在设置自定义Tab Bar Item的时候也应该包含常规和紧凑两种不同的尺寸

根据图形是圆形、方形、宽形、高形,像素也有不同的要求:

如果图标是圆形的,应该提供:25pt@2x、25pt@3x、18pt@2x、18pt@3x

如果图标是方形的,应该提供:23pt@2x、23pt@3x、17pt@2x、17pt@3x

如果图标是宽形的,应该提供:31pt@2x、31pt@3x、23pt@2x、23pt@3x

如果图标是高形的,应该提供:28pt@2x、28pt@3x、20pt@2x、20pt@3x

以下是完整表格~

【iOS】Image图片属性之Render As Template Image

把图片设置成Render as Template Image,系统会忽略图像的颜色信息,并根据图像中的alpha值创建图像模板,图像中alpha值 < 1.0的部分被视为完全透明,alpha值 = 1.0的部分为Image Tint的颜色,默认Default为蓝色

假设原图为:

将其设置为Render as Template Image,并且将Tab Bar Item设置为该图片,则Tab Bar的Item会变为这样:

如果将Tab BarImage Tint设置为红色,则Tab Bar的Item会变为这样:

【iOS】Scale Fill、Aspect Fit 和 Aspect Fill 的区别(Content Mode)

ImageView –  Content Mode中Scale FillAspect Fit Aspect Fill 的区别

Scale Fill:缩放(改变图片比例)以填满整个Image View

Aspect Fit:保持图片原比例,尽可能让图片全部显示出来,Image View 剩下空出来的部分是透明的

Aspect Fill:保持图片原比例,填满整个Image View(图片可能会被裁剪掉)

图片示例(只好牺牲这只可爱的小喵咪啦~):

Scale Fill

 Aspect Fit

Aspect Fill


UIViewContentModeScaleToFillScales the content to fit the size of itself by changing the aspect ratio of the content if necessary.

UIViewContentModeScaleAspectFitScales the content to fit the size of the view by maintaining the aspect ratio. Any remaining area of the view’s bounds is transparent.

UIViewContentModeScaleAspectFillScales the content to fill the size of the view. Some portion of the content may be clipped to fill the view’s bounds.

【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打开

Snip20160127_93

新建文稿 

Snip20160127_94

选取文稿类型为 快速操作

Snip20160127_95

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

Snip20160127_108

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

拖入复制访达项目

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

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

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

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

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

 

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

最终效果~

 

【iOS】TouchDown、TouchDownRepeat 和 TouchCancel 的区别

TouchDown:在控件窗口内单点触摸按下

TouchDownRepeat:在控件窗口内多点触摸按下(即点触计数大于1)

TouchCancel:在控件窗口内因为系统事件将当前所有触摸取消(如手机被锁屏、有电话呼入)


[依据] 来自Apple官方文档 UIControlEvents

UIControlEventTouchDown:A touch-down event in the control.

UIControlEventTouchDownRepeatA repeated touch-down event in the control; for this event the value of the UITouch tapCount method is greater than one.

UIControlEventTouchCancel:A system event canceling the current touches for the control.

【iOS】Touch Drag Inside 和 Touch Drag Outside、Touch Drag Enter、Touch Drag Exit的区别

Touch Drag Inside:手指在控件窗口内拖动

Touch Drag Outside:手指在控件窗口外拖动

Touch Drag Enter:手指从控件窗口外部拖动到内部

Touch Drag Exit:手指从控件窗口内部拖动到外部


[依据] 来自Apple官方文档 UIControlEvents

UIControlEventTouchDragInside:An event where a finger is dragged inside the bounds of the control.

UIControlEventTouchDragOutside:An event where a finger is dragged just outside the bounds of the control.

UIControlEventTouchDragEnter:An event where a finger is dragged into the bounds of the control.

UIControlEventTouchDragExit:An event where a finger is dragged from within a control to outside its bounds.