Glide的图像centerCrop处理-长短边适配
Glide的圖像適配Imageview提供了兩種寫好的模式centerCrop,fitCenter。
在看代碼時出現了一些疑惑,就是TransformationUtils這個類中的centerCrop方法,看代碼
這個方法就是將bitmap裁剪成一個指定大小的bitmap。這個方法里面的解析網上有了,整體看下來好像也沒什么問題,就是在計算縮放值的時候,有點不懂了
if (toCrop.getWidth() * height > width * toCrop.getHeight()) { //為什么這個判斷條件下是用高去做縮放scale = (float) height / (float) toCrop.getHeight();dx = (width - toCrop.getWidth() * scale) * 0.5f;} else {scale = (float) width / (float) toCrop.getWidth();dy = (height - toCrop.getHeight() * scale) * 0.5f;}在toCrop.getWidth() * height > width * toCrop.getHeight()這個條件下為什么是用高計算縮放值。
這里我們簡化下,我們拿到的需要裁剪的一張圖大小的寬為tW,高為tH,需要適配的圖像寬高是W,H。
那么上面的公式就變成tW *H > W * tH。在這個條件下用高縮放,想了好久沒明白,不知所云。
這樣寫肯定是有理由的,找了好久終于找到答案了,就是這么一段話
關于長短邊:“長邊”是指原尺寸與目標尺寸的比值大的那條邊,“短邊”同理。例如,原圖400x200,縮放為 800x100,由于 400/800=0.5,200/100=2,0.5 < 2,所以在這個縮放中 200 那條是長邊,400 那條是短邊。
就是圖像處理的長短邊問題,上面用的就是短邊去適配,所以上面的公式轉換下就是tW / W > tH/H,看到這里再結合長短邊的概念就明白了,這里需要注意的是短邊是打了引號的,并不是長度的短,而是在比值中的“短”。
弄明白這個條件的意思,問題又來了,為什么用短邊去計算縮放大小,
是因為用短邊去適配的縮放值肯定要小于長邊的縮放值,這樣能保證,要裁剪的圖片的短邊跟目標圖的邊大小一樣,而長邊的縮放之后不會小于目標邊的長度。
舉個例子,要裁剪的圖大小18 * 8,目標圖的大小6 * 4 ,(18/6 =3 ) > (8/4 = 2),這個時候應該用短邊8去適配,也就是8縮小成4,長邊18頁就變成9,也就變成了一個9 * 4的圖像然后這樣按centerCrop去裁剪成6 * 4就不會留白了。畫個圖就明白了
上圖的1.5就是centerCrop方法里面的dx表示平移的偏移量,也就是
最后調用 canvas.drawBitmap(toCrop, m, paint);就能畫出一個裁剪后的的目標圖了,整個方法就做了兩件事,先縮放原圖,然后裁剪繪制,這里也不是真正的裁剪,只是在繪制的時候先偏移了一定的長度,導致繪制的區域超出了,我們只能看見在目標區bitmap內的圖像,類似裁剪的意思。
這里主要是要意識到圖片處理的長短邊適配的概念。隨便了解下centCrop的過程及原理。
寫完之后才發覺時間飛逝~,一天又沒了
總結
以上是生活随笔為你收集整理的Glide的图像centerCrop处理-长短边适配的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 又一个基于 Esbuild 的神器!es
- 下一篇: 前端学习(3045):vue+eleme