图片拉伸Slices

引言

  今天使用图片的时候发现, 有了图片的拉伸需求, 就专门对xcode中的图片拉伸做了一些研究, 记录下来, 也希望能帮到你.

场景

  我们在开发过程中有时候会遇到一些需要部分拉伸的图片, 什么叫部分拉伸的图片呢? 就是如果出现了UIImageView和我们的UIImage大小不一致时我们希望通过缩放或者拉伸某个特定的区域来适应UIImageView的大小, 典型的就是微信聊天界面的对话框的气泡.

下面我这里只讲一些基础的

• 图下图所示操作

  
  
  

  图1.1
• 下面是介绍其中slices和center属性
  
  

  图1.2
  
    拉伸的方向有三种Horizontal、Vertical及HorizontalandVertical, Horizontal就是水平方向拉伸, left和right是Horizontal下的属性; 如果我们选择的是Vertical那么这里的left和right会变成top和bottom; 同理, 如果我们选择的是HorizontalandVertical, 那么下面就是left、right、top、bottom. （可以自己动手试下）
    center属性下有两个元素tiles和stretches表示平铺和拉伸模式.
• 下面开始实战(这里我只讲Horizontal的情况, 其他两种类似)
  
  

  图1.3
  
  出现下图所示
  
  

  图1.4

图上已经说的很明白1和4分别是头部和尾部保留区, 就是你所展示的图片是以1为头4为尾, 2是拉伸的区域, 不论是平铺模式还是拉伸模式, 都是操作2这个区域的, 3区域是直接裁剪调的区域.
而这些区域是如何界定的呢? 区域1和4实际上就是图1.2中的left和right, 而2的宽度就是图1.2中的width属性, 而3的宽度就是图片的宽度 - left - right - width所剩下的区域.
下面是效果图

图1.5

源码地址
https://github.com/autmaple/SliceTest

如果觉得有帮助, 点个赞哦...