社交应用动态九宫格图片的规则

这里主要以微信和QQ空间为作为研究对象,得到的结论如下。

QQ空间里的动态

iOS设备,以iPhone6为分界

iPhone6及以上分辨率的设备:

  • 当宽且高同时 > 512px时,判断 宽/高的比例值:大于 2时,以高度为基准,缩小到512px,宽度等比缩、小于等于 2时,以宽度为基准,缩小到512px,高度等比缩
  • 当宽、高其中一边小于512px,直接下原图;

iPhone6以下的设备(5s、SE、4s),判断条件同上,只是将512px改为200px

Android规则同上,只是以1280分辨率为分界

 

QQ空间是尽量平铺占满宽度,二张图片时平分宽度,三张时也平分宽度,均占一行,四张时像四个象限一样,上、下各占一行,五张是上三张下二张,六张时上、下各三张,七、八、九张就铺第三行了。

 

 

微信朋友圈

未对屏幕进行区分,但对只上传一张图片进行了特殊的处理,二张或二张以上的图片宽 x 高以150为阀值,二边都大小150时,以较小的一边为基准进行等比缩放。

当图片为三张时,3、5位置对调,排成一行:1、2、3,二张时排一行:1、2,格子大小提前就已经占好位置。

 

单张图片,如果0.5 < = 宽 / 高 <= 2 时,被限定在1 - 4格子的范围大小(包括间距)

 

单张图片,宽 / 高 > 2的图片(如全景图),最多占三栏,高最多占一栏(包括间距大小)

 

宽 / 高 < 0.5(如微博长图),高最多占二栏,宽度最小占二栏1/3(包括间距)

image

 

 

朋友圈与QQ空间的区别在于,大小一张图片的时候,微信是按事先定义好的格子大小放图片,而QQ空间则是按平分屏幕宽度来算的。从使用角度来讲,二者的主要区别在于QQ空间更加突出图片这个属性,我的iPhone6 Plus一屏如果某条动态有9张图片,那基本上我只能看全一条动态,而朋友圈,我一屏至少可以看到二条均带9张图片的动态,图片占幅不算特别大,而且可以看得清部分的文字,看上去感觉更加和谐一些。

 

上述的规则可能存在不准确的地方,是通过反复测试、抓包方式来推断出来的,微信因为使用的是ipv6,而且图片貌似是动态CDN,有权限的验证,请求图片时并没有直接返回图片,而是一个类似二进制的文件,这样做的目的估计是出于产品隐私性的考虑吧,毕竟微信是面向熟人的,如果图片的规则能被破解或者url能直接主动,势必会让使用微信的用户觉得我发的图片并不是真正的私密(不安全),不过动态CDN成本比静态CDN高出不少。

 

这里先贴出部分能抓到的微信请求的url

// 视频封面 320 x 240
http://vweixinthumb.tc.qq.com/150/20250/snsvideodownload?filekey=30270201010420301e02020096040253480410600248dca5d9c581e27fbd5111a9349b0202151b0400&bizid=1023&hy=SH&fileparam=302c020101042530230204816d4328020458059a8502024f1a02031e8d7e02030f424002042f5e320a0201000400

// 个人头像 132 x 132
http://wx.qlogo.cn/mmhead/ver_1/UGuDguTdib0mHzgxB0I5SegibWXM5w3wuIOEVWygIOrLPcL5E50SAtFuq0ia9ichPMWmadEOTfTmzr0LF8hIjE4zJw/132

// 视频封面 320 x 240 = 4 : 3
http://vweixinthumb.tc.qq.com/150/20250/snsvideodownload?filekey=30270201010420301e02020096040253480410f1f2401a6c62f09ececa00c6cf099f3902023b9b0400&bizid=1023&hy=SH&fileparam=302c0201010425302302046cfba775020458048d5402024f1a02031e8d7d02030f424002041260320a0201000400

// 9张图片中的一张 150 x 200 = 3 : 4
http://140.207.234.29/mmsns/kiaXicXJs2M4d4Cj5yoIFEcPBQlNiaos8DGA33icYyhcYPrf1S90BSnHj6JC7YnTrotyjibXOrmkgmOo/150?tp=wxpc&length=2208&width=1242

// 150 x 150
http://140.207.234.29/mmsns/czSFWUxMIFicELY0FicKp8mAKEPgR7TMGwSLE8Ue2TTB6N5nfhrNSAE0Hn0UcVicJYlSzN24Sy4C6I/150?tp=wxpc&length=2208&width=1242

// 某条消息 150 x 68
http://140.207.234.32/mmsns/kqodNCVWpEuNZC3Qicgqw0YBlwXlhO9agvRaiaTDoOUnSibRFtNf9KDS57dYp0to1Z2RM0tQicYZCZg/150?tp=wxpc&length=2208&width=1242

// 群头像 139 x 139
http://223.167.86.100/mmcrhead/Q3auHgzwzM4SzCRNKrGw4Qr3iarHic17WGvuJm6o8lQcicludw8LPmW3Jb783SgFZqNLTYfJFHjkJdy65ppUwNM1w/0

// 自己的朋友圈封面 640 x 640
http://140.207.234.31/mmsns/4376ae1e0cf0ccced233def9ad1560d0dec29d64941ab85a818b17f43e6dadabcba7fb71e9dd2494fdead4b0db253944831124813608c824/0?tp=wxpc&length=2208&width=1242

// 225 x 150
http://140.207.234.31/mmsns/LwcbhAmMnZCGOvDT3GV29UDibiaoSiauzPfTJ0C8LIwERqxsFUTgtxq8PN9zuXeuLwyWBdajS83l5I/150?tp=wxpc&length=2208&width=1242

//默认图像 70 x 70
http://mmsns.qpic.cn/mmsns/iaxNB5XaibCeLTYWIUGCYm7cS1kFxTx4ibUSEBZJ6VnOdXPDItJ9PaGRg/0

// 个人头像96 x 96
http://wx.qlogo.cn/mmhead/PiajxSqBRaEJACUXXpRJhrQaSa2ic9EY4C3H5jC8eGP050nUlNSa05sw/96

// 广告334 x 200
http://mmbiz.qpic.cn/mmbiz/m79YxykhR1vKicdfyicOTQlWl2zkZRftMjw0lQvclPfEo5t7wkDGLNh2Vgxjr50fxlp9tE3Nb6LwO98Sh2UfREHg/640?wxfrom=5&wx_lazy=1

// 6张图片 150 x 203
http://140.207.234.30/mmsns/y5RpFDuUObyB1wvAlG2ib2rGwXictXHPzFsFo1UYrzD9BYKmHoeEibxCPzicxQ9OibHdljqMmJSFrFXM/150?tp=wxpc&length=2208&width=1242

// 200 x 150
http://140.207.234.30/mmsns/y5RpFDuUObyB1wvAlG2ib2licuKrosSWmHVxbjfzdEk30iaKbSHft9U5W5ZHqQbHhq7wpz72NtCgQ8/150?tp=wxpc&length=2208&width=1242

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/542391.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

splunk中 如何隐藏input_翻糖制作中,如何避免裂缝,如何隐藏裂缝,如何防粘?...

翻糖蛋糕 因精致的样子和栩栩如生的各种造型深得人们的喜爱&#xff0c;它不仅满足了人们对蛋糕口味及装饰日益多样化的需求&#xff0c;同时也在动手制作的过程中&#xff0c;享受到美食与生活的无穷乐趣。不过裂缝&#xff0c;不平整&#xff0c;干燥对翻糖作品来说无疑是噩梦…

wpf中groupbox有什么用_展示设计中的标摊是什么 用的什么材料

经常听从事展示设计的工作人员说起标摊&#xff0c;那什么是标摊呢&#xff1f;顾名思义&#xff0c;标摊就是通用标准的国际展会摊位的缩写。但是不少人看到干巴巴的词语还是不能理解。那么这篇文章从用途、材料等方面来详细介绍标摊究竟是什么。 标摊的主要材质是什么一般来说…

ActiveX: 如何用.inf和.ocx文件生成cab文件

ActiveX: 如何用.inf和.ocx文件生成cab文件 转载于:https://www.cnblogs.com/time-is-life/p/5977962.html

操作系统中的处理机调度调度_操作系统中的多处理器调度

操作系统中的处理机调度调度多处理器操作系统 (Multiprocessor Operating system) A multiprocessor system consists of several processors which share memory. In the multiprocessor, there is more than one processor in the system. The reason we use multiprocessor …

sed 替换_sed命令批量替换文件内容

“ 开发人员有时会大批量替换文件内容&#xff0c;sed命令是一个很好用的工具。”01—暴力替换方式近期有个临时任务,将系统中所有"帐"替换为"账",那"帐"和"账"有啥区别呢;1、账的部首是贝&#xff1b;帐的部首是巾。2、账是关于货币、…

android 模仿uc标签页,模仿UCweb菜单 - 白羽雕弓 - 博客园

UCWeb的菜单看起来不错&#xff0c;自己想模仿做一个&#xff0c;苦恼一直没有思路google了几天&#xff0c;终于找到一个帖子 http://www.eoeandroid.com/viewthread.php?tid28824按照上面提供的思路实现了1、保留menu按键作用2、用popupwindow作为菜单显示容器3、用GridVie…

android webview 监听js,Android webview与js的数据交互

项目要用到Webview和js交互&#xff0c;查了查以前的项目感觉还是有必要整理下的。简单描述下项目中用到的地方&#xff0c;比如说在web页需要用到登录的地方点击登录跳转到APP原生登录界面去登录&#xff0c;点击web页的拨打电话弹出原生dialog询问是否拨打&#xff0c;点击we…

android web通讯录,Android手机开发之通讯录

Android手机开发——通讯录实现增加、查询、修改、删除的功能&#xff0c;输入联系人信息&#xff0c;点击“添加”按钮&#xff0c;可以添加联系人信息到数据库&#xff1b;点击“查询”按钮&#xff0c;会发现添加的联系人信息显示在界面中&#xff1b;重新输入联系人电话&am…

有关UITableView--cell复用问题

近来用Tableview做了一个九宫格。过程中碰到了两个cell复用问题。 问题一&#xff1a; 在cell中为button添加addTarget点击事件时&#xff0c;出现后面的cell会重叠它前面cell的事件。代码如下&#xff1a; C代码 static NSString *CellWithIdentifier "DiscoverHomeTab…

JavaScript基础之Number对象和Math对象

2019独角兽企业重金招聘Python工程师标准>>> //Math对象//属性float Math.E; //返回自然对数的底数e&#xff0c;约2.718float Math.LN2; //返回2的自然对数&#xff0c;约0.693float Math.LN10; //返回10的自然对数&#xff0c;约2.302fl…

My linux

为什么80%的码农都做不了架构师&#xff1f;>>> 1.linux 命令方式修改机器名称 # hostname newHostName # vi /etc/sysconfig/network 修改或增加配置&#xff1a;hostnamenewHostName # vi /etc/hosts 修改对应的本地HOST映射 xx.xxx.xxx.xxx newHostName 2.Redha…

狂神说es笔记_人教版七上英语Unit5电子课本音频+课堂笔记+课后同步习题

1人教 七上英语Unit5单词七年级英语上册Unit 5单词默写1做&#xff1b;干(助动词)__________2做&#xff0c;干(助动词第三人称单数形式)__________3有__________4网球__________5球__________6乒乓球______7球棒&#xff1b;球拍__________8(英式)足球____________________9排…

先进技术android,React Native实战(JavaScript开发iOS和Android应用)/计算机科学先进技术译丛...

导语内容提要本书作者Nader Dabit是AWS Mobile开发人员、React Native Training创始人和React Native Radio播客主持人。本书旨在帮助iOS、Android和Web开发人员学习使用React Native框架&#xff0c;构建高质量的iOS和Android应用程序。书中介绍了React Native入门基础知识&am…

开发类似vs的黑色风格_传闻:2020年《使命召唤》将是《黑色行动》重启作品

据可信度较高的消息源透露&#xff0c;2020 年的《使命召唤》将是《黑色行动》的重启作。而据之前的报道&#xff0c;《黑色行动》开发商 Treyarch 正在开发今年的《使命召唤》&#xff0c; Sledgehammer Games 和 Raven Software 负责辅助工作。该项目代号为“宙斯”&#xff…

微信小程序 开发 微信开发者工具 快捷键

微信小程序已经跑起来了.快捷键设置找了好久没找到,完全凭感觉.图贴出来.大家看看. 我现在用的是0.10.101100的版本,后续版本更新快捷键也应该不会有什么变化. 现在貌似不能修改.如果有同学找到修改的方法,麻烦告诉我.谢谢. 微信小程序代码编辑快捷键 常用快捷键 格式调整 Ctrl…

android9有深色模式吗,深色模式还是黑色模式?微信把所有人都搞懵了

原标题&#xff1a;深色模式还是黑色模式&#xff1f;微信把所有人都搞懵了前一阵子&#xff0c;微信正式加入了对“深色模式”的支持&#xff0c;这也是除了Windows Phone 版本以外微信第一次从系统层面支持深色模式。虽然这次更新离WWDC上的演示已经过去了9个月&#xff0c;但…

html页面foot,HTML tfoot用法及代码示例

HTML中的标记用于提供页脚内容组。此标记在带有标题和正文的HTML表中使用&#xff0c;称为“thead”和“tbody”。 标记是表的子标记&#xff0c;是和的父标记。用法: // Table footer contents... 属性&#xff1a;标记包含HTML4.1支持但HTML5不支持的许多属性。align:设置文本…

迭代器 java_Java设计模式8:迭代器模式

迭代器模式迭代器模式又叫做游标(Cursor)模式&#xff0c;其作用是提供一种方法访问一个容器元素中的各个对象&#xff0c;而又不暴露该对象的内部细节。迭代器模式结构迭代器模式由以下角色组成&#xff1a;1、迭代器角色负责定义访问和遍历元素的接口2、具体迭代器角色实现迭…

网易 html5,别再想不开做H5了

写这篇文章的时候网易哒哒《饲养手册》H5刷屏了&#xff0c;但我们依旧不建议品牌做H5。H5作为大众传播工具的时代&#xff0c;已经过去了。尽管去年有很多H5曾经刷屏过&#xff0c;但在当时我们就一直跟朋友说&#xff0c;不要再尝试H5了&#xff0c;性价比根本算不过来&#…

flex 修改生成html,CSS Flex –动画教程

如果一张图片胜过千言万语 —— 那么动画呢&#xff1f; Flex 无法通过文字或静态图像有效地完全解释。为了巩固你对flex的了解&#xff0c;我制作了这些动画演示。注意 overflow: hidden 行为类型是默认值&#xff0c;因为 flex-wrap 还未设置。为了获得更好的想法&#xff0c…