iOS 图片拉伸之images.xcassets slicing

记录我得孤陋寡闻

当我们拿到一张切图用来展示时，大部分时候都是要被拉伸的，但是又要保证某些区域不被拉伸，除了纯代码控制拉伸区域，还可以借助于images.xcassets slicing，类似Android的 点9图。

前提：

此方法也有局限性，这里只介绍使用，实际应用需要灵活处理，酌情参考。

Show Slicing

1. 首先介绍图片切片，其功能区域如下:

1.1 Slicing

Show Overview

Show Slicing

1.2 Center (默认 Tiles)

• Tiles：平铺
• Stretches：拉伸

center

2. 我们点击图片上Start Slicing 开始图片切片，会发现有三个按钮，对应右下角Slicing -> Slices，即设置：横向拉伸，纵向拉伸，横向+纵向拉伸

Start Slicing

3. Horizontal

此处换深背景，方便介绍各区域
点击横向拉伸按钮后，Xcode会比较智能的将圆角区域排除拉伸区域，拉伸区域如下：

4. Vertical

同理，点击纵向拉伸按钮后，拉伸区域如下：

5. Horizontal and Vertical

如图一中，红圈区域是不支持拉伸区域，阴影部分可以被拉伸。

图一

错误示例：当图片如图二中有占满纵向的线，这样我们设置纵向拉伸就会导致图片的线变形，因为拉伸区域无法避开图片上的内容。

图二