app缩略图生成策略设计
来源:互联网 发布:设计本软件下载 编辑:程序博客网 时间:2024/06/06 16:33
问题
最近在开发app时遇到的问题之一,用户可以上传自定义样式的图片,也就是说宽高比不统一,用户相册原图是什么样的上传就是什么样的,只是在前端做了一次压缩,把大小从几M不等压缩控制在150K以内,但图片分辨率多种多样。这也是一般app上传功能的普遍做法,除了头像一般都不裁切。那么在处理缩略图的时候就不好处理了,因为不是固定尺寸,所以不能按照传统思路简单地设置固定分辨率的好小中大图。
参考
看了微信和今日头条的列表缩略图样式大体有了个概念,今日头条有两种缩略图样式:一种是大图占满整个item宽高比是16:9,一种是item显示三张小缩略图宽高比是3:2。
微信也有两种样式:一种是一张图片充满整个item,还有就是九宫格形式在item中填充网格图片,最多九张。
而闲的蛋疼的我对传一张图片的显示样式有了比较大的好奇心,于是乎,我分别截取了不同分辨率的图片用于展示:
900x900、900x600、900x450、900x300、900x225、900x100
展示如下
可以看出前四张只是高度相对应的缩减,这是正常比例缩放后展示嘛没毛病,第五张what?怎么高度不减反而拉长了呢,可见高度降到一定比例就固定了,开始拉伸宽度,而到900x225的比例时宽高正好都已经压缩到极限了,那么到了第六张900x100显示就和900x225显示的缩略图宽高比一样了~
话说不测不知道,朋友圈缩略图有这么深的门道。当然具体比例算法这次就不细究了,下面是六张不同尺寸的图用九宫格显示的样式。
显示的区域都是图片最中心区域(亲测),其实一张图的细节我不是很关心,因为我做的app主要涉及九宫格样式,那么核心思想是缩略图显示中间区域就可以了。
思路
我们这次只探讨九宫格缩略图的展示
九宫格缩略图核心思想是显示中心区域,那么有两种解决方案:
1. 后台拿到原图后截取出中心区域生成缩略图
2. 后台拿到原图后进行等比压缩,形成完整图片的缩略图(例如1920x1280的图片等比压缩5倍变为384x256),然后app端拿等比压缩图设置展示类型为centerCrop(截取中心区域)
相比之下我更倾向于第二种,因为后台现有工具类等比压缩是可以做的,中心截取相对比较麻烦,而app端展示类型则是现成的。
还有一个限制就是后台等比压缩后大小最好控制在20k以内,现在上传的图片大小在100k左右,所以应该比较好实现。
- app缩略图生成策略设计
- app的安全性设计策略
- 生成缩略图
- 生成缩略图
- 生成缩略图
- 生成缩略图
- 生成缩略图
- 生成缩略图
- 生成缩略图
- 生成缩略图
- 生成缩略图
- 生成缩略图
- 生成缩略图
- 生成缩略图
- 生成缩略图
- 生成缩略图
- 生成缩略图
- 生成缩略图
- freetype中FT_Set_Transform()和FT_Load_Char()分析(待续)
- iOS开发之
- 矩阵论01—矩阵的奇异值分解
- WebService
- iOS与H5的交互【WKWebView】
- app缩略图生成策略设计
- 深入浅出RxJava演变原理
- Android 性能优化——启动时间优化指南
- Java程序员应当知道的10个面向对象设计原则
- 排序和查找算法总结
- Android中循环获取图片资源Id并运用到GridView等的适配器之中
- 2016年第七届山东省ACM省赛题解
- 《Linux与shell脚本编程大全》笔记之shell命令补充
- SQL之case when then用法