Glide — 圖片大小調(diào)整 & 縮放
在前幾篇文章中,你已經(jīng)學(xué)習(xí)了從各種源中加載圖片,并且使用不同形式的占位圖。如果你不知道圖片的大小的影響,這篇文章里介紹的大小調(diào)整和縮放是相當(dāng)重要的。
Glide 系列概覽
- 入門(mén)簡(jiǎn)介
- 高級(jí)加載
- 適配器(ListView, GridView)
- 占位圖& 淡入淡出動(dòng)畫(huà)
- 圖片大小 & 縮放
- 播放GIF & 視頻
- 緩存基礎(chǔ)
- 請(qǐng)求優(yōu)先級(jí)
- 縮略圖
- 回調(diào):定制view中使用SimpleTarget和ViewTarget
- 通知欄和桌面小控件的圖片加載
- 異常: 調(diào)試和報(bào)錯(cuò)處理
- 自定義變換
- 用animate()定制動(dòng)畫(huà)
- 整合網(wǎng)絡(luò)協(xié)議棧
- 用Modules定制Glide
- Glide Module 案例: 接受自簽名HTTPS證書(shū)
- Glide Module 案例: 自定義緩存
- Glide Module 案例: 通過(guò)加載自定義大小圖片優(yōu)化
- 動(dòng)態(tài)使用 Model Loaders
- 如何旋轉(zhuǎn)圖片
- 系列綜述
resize(x, y)調(diào)整圖片大小
理想情況下,你的服務(wù)器或者API能夠返回給你恰好所需分辨率的圖片,這是在網(wǎng)絡(luò)帶寬、內(nèi)存消耗和圖片質(zhì)量下的完美方案。
跟Picasso比起來(lái),Glide在內(nèi)存上占用更優(yōu)化。Glide在緩存和內(nèi)存里自動(dòng)限制圖片的大小去適配ImageView的尺寸。Picasso也有同樣的能力,但需要調(diào)用fit()方法。用Glide時(shí),如果圖片不需要自動(dòng)適配ImageView,調(diào)用override(horizontalSize, verticalSize),它會(huì)在將圖片顯示在ImageView之前調(diào)整圖片的大小。
Glide
.with(context)
.load(UsageExampleListViewAdapter.eatFoodyImages[0])
.override(600, 200) // resizes the image to these dimensions (in pixel). does not respect aspect ratio
.into(imageViewResize);
這個(gè)設(shè)置可能也是有利于沒(méi)有明確目標(biāo),但已知尺寸的視圖上。例如,如果app想要預(yù)先緩存在splash屏幕上,還沒(méi)法測(cè)量出ImageVIews具體寬高。但,如果你已經(jīng)知道圖片應(yīng)當(dāng)為多大,使用override可以提供一個(gè)指定的大小的圖片。
縮放圖片
現(xiàn)在,對(duì)于任何圖像的任何處理,調(diào)整圖像的大小可能會(huì)扭曲長(zhǎng)寬比,丑化圖片的顯示。在大多數(shù)情況下,你希望防止這種事情發(fā)升。Glide提供了變換去處理圖片顯示,通過(guò)設(shè)置centerCrop 和 fitCenter,可以得到兩個(gè)不同的效果。
CenterCrop
CenterCrop()會(huì)縮放圖片讓圖片充滿整個(gè)ImageView的邊框,然后裁掉超出的部分。ImageVIew會(huì)被完全填充滿,但是圖片可能不能完全顯示出。
Glide
.with(context)
.load(UsageExampleListViewAdapter.eatFoodyImages[0])
.override(600, 200) // resizes the image to these dimensions (in pixel)
.centerCrop() // this cropping technique scales the image so that it fills the requested bounds and then crops the extra.
.into(imageViewResizeCenterCrop);
FitCenter
fitCenter()會(huì)縮放圖片讓兩邊都相等或小于ImageView的所需求的邊框。圖片會(huì)被完整顯示,可能不能完全填充整個(gè)ImageView。
Glide
.with(context)
.load(UsageExampleListViewAdapter.eatFoodyImages[0])
.override(600, 200)
.fitCenter()
.into(imageViewResizeFitCenter);
我們會(huì)在隨后的文章中介紹除了centerCrop() 和 fitCenter()以外的自定義變換方法。
展望
這篇文章中,你已經(jīng)學(xué)會(huì)了如何調(diào)整要顯示的圖片的尺寸。這對(duì)于創(chuàng)建出色應(yīng)用非常有幫助。在我們進(jìn)入更高級(jí)的Glide主題之前,我們后面將會(huì)學(xué)習(xí)一個(gè)Glide獨(dú)有的功能:播放Gif和視頻。