【快捷指令案例】图片49宫格

前言

还在为制作网格图到处找App吗，还在为制作网格图烦恼吗，从现在开始不用烦恼了，快捷指令可以很快做到，这里记录从0到1实践过程，末尾附快捷口令。

设计思路

• 选取照片并将照片调整为方形（为了好看）
• 提供4、9宫格功能菜单方便制作对应网格图
• 使用嵌套循环计算宫格块裁剪坐标
• 保存宫格切图及预览网格图

实现

1.选取图片并调整为方形

• 使用【选择照片】工具选取一张照片
• 从照片获取照片宽度，使用【设定变量】将照片宽度赋值给“照片宽度”变量
• 判断选取的图片宽高是否一致
• 一致：使用【设定变量**】**将选取的照片赋值给变量“方形图片”
• 不一致：使用【调整图像大小】将选取的照片大小调整为“照片宽度 X 照片宽度”

2.网格切图

以4宫格为例，使用【计算】得到4宫格每个切图的宽度并存入变量“图片Item宽度”

使用嵌套分别循环√4次

• row=循环行次数下标*图片Item宽度

• col=循环列次数下标*图片Item宽度

• 裁剪坐标**（row, col, 图片Item宽度， 图片Item宽度）**

9宫格规则相同

切图成功后，我们就可以得到如下的宫格切图

3.保存功能

为宫格切图提供3种保存模式

• 仅保留宫格切图：只保留宫格对应裁剪的图片

• 仅保留网格图：只保留宫格裁剪图片的网格拼接图

• 保留宫格切图和网格图：保留宫格对应裁剪的图片和宫格裁剪图片的网格拼接图

仅保留宫格切图，使用【存储到相簿】将切图列表保存到【最近项目】

仅保留网格图，使用【拼接图像】将切图列表保存为网格拼图，使用【存储到相簿】将拼接后的图像保存到【最近项目】

保留宫格切图和网格图，就是将前面二个功能的操作都保存下来。

预览效果

快捷指令口令

见原文：【快捷指令案例】图片49宫格

本文同步自微信公众号 “程序员小溪” ，这里只是同步，想看及时消息请移步我的公众号，不定时更新我的学习经验。