被朋友圈“大字玩法”刷爆后，我科普一下朋友圈圖片顯示規則！
昨天大字的玩法刷爆朋友圈，大字的技術并不復雜，主要技術就是畫布打印，利用ih5等第三方工具就可以搞定。
朋友圈圖片可以怎么玩？先科普下朋友圈圖片顯示規則吧。
朋友圈最多可以顯示9張圖片，賤賤之前也分享過九宮格圖片的玩法。當圖片數量為單張時，會顯示單圖縮略圖。當圖片數量超過1張時，則有規律的按方格排列。
當朋友圈僅發一張照片時，顯示的效果卻是不一樣的。賤賤從朋友圈隨便截了幾張圖，大家仔細對比下。
對比發現：
圖A是個豎圖，圖片高度很高，預覽時上下顯示不全；
圖B是個方圖，圖C是個橫圖，圖B圖C寬度一樣；
圖D是個橫圖，寬度比圖B圖C更寬。
昨天刷屏的大字也是個橫圖，就像微信聊天框一樣，有以假亂真的效果。圖片的寬度和上圖D一樣，水平方向幾乎充滿了屏幕寬度。
圖片怎么才可以顯示這么寬？
我們可以初步猜測和圖片的寬高比（寬度/高度）有關，寬高比越大可能圖片顯示的越寬。
為了驗證這個結論，賤賤找不同的圖片尺寸實驗一下（圖片模板的右上角和左下角為邊界檢測文字）：
圖片尺寸分別為：
900*900（1:1）
900*600（1.5:1）
900*450（2:1）
900*360（2.5:1）
900*320（2.8125:1）
900*300（3:1），900*270（3.3333:1）
900*225（4:1）
實驗發現：
假設圖片寬高比=x
當1≤x≤2.5時，圖片預覽時寬度一致，且縮略圖和原圖比例一致。ps：此處假設寬度值為W
當2.5<x≤3時，縮略圖和原圖比例發生改變，縮略圖寬度也是W，高度為W / 2.5（即縮略圖寬高比為2.5:1），縮略圖水平方向有隱藏，兩端顯示不完整；
當x＞3時，縮略圖和原圖比例發生改變，此處假設寬度值為M，M的值大于W，高度為M／3（即縮略圖寬高比為3:1），縮略圖水平方向有隱藏，兩端顯示不完整。
顯然，如果圖片想在水平方向最大程度伸展的話，寬高比應該大于3:1
朋友圈九宮格是個圖片控件，上面結論里的W和M是否存在某種數學關聯呢？
我們再添加兩個變量，假設4宮格寬度為Q，方格之間間隙為P
計算發現：
九宮格寬度等于M，即單圖最大伸展長度和九宮格寬度一樣
Q-W＝0.5P，即橫圖一般寬度比四宮格寬度少半個方格間隙
了解了單張橫圖的展示規則后，豎圖的原理也一樣，你會想出什么樣玩法呢？
本文系作者授權數英發表，內容為作者獨立觀點，不代表數英立場。
轉載請在文章開頭和結尾顯眼處標注：作者、出處和鏈接。不按規范轉載侵權必究。
轉載請在文章開頭和結尾顯眼處標注：作者、出處和鏈接。不按規范轉載侵權必究。
本文系作者授權數英發表，內容為作者獨立觀點，不代表數英立場。
未經授權嚴禁轉載，授權事宜請聯系作者本人，侵權必究。
未經授權嚴禁轉載，授權事宜請聯系作者本人，侵權必究。
本內容為作者獨立觀點，不代表數英立場。
本文禁止轉載，侵權必究。
本文禁止轉載，侵權必究。
本文系數英原創，未經允許不得轉載。
授權事宜請至數英微信公眾號(ID: digitaling) 后臺授權，侵權必究。
授權事宜請至數英微信公眾號(ID: digitaling) 后臺授權，侵權必究。
評論
評論
推薦評論
全部評論（1條）