摘要:毛玻璃效果相信很多朋友都眼紅很久了,隔壁系統(tǒng)對高斯模糊早就大范圍使用了,咱們卻絲毫不為所動(dòng),于是就只能靠廣大開發(fā)者咯。
毛玻璃效果相信很多朋友都眼紅很久了,
隔壁ios系統(tǒng)對高斯模糊早就大范圍使用了,
咱們Android卻絲毫不為所動(dòng),
于是就只能靠廣大開發(fā)者咯。
這是目前市面上性能最高的方案,
也不知道最初是哪位大神寫的,
我也只是拿來封裝一下,
變得更簡單、更好用,
加上了陰影遮罩的效果。
先來看看效果吧,
只是有一點(diǎn)要說明的,
CSDN要求圖片在2M以內(nèi),
于是我就把GIF壓縮了一下,
所以大家會(huì)看到有一個(gè)一個(gè)的點(diǎn)點(diǎn),
實(shí)際是沒有的,
效果很贊很平滑,
請放心使用。
話不多說,
下邊開啟干貨模式。
第一步:
把我項(xiàng)目里的工具類的包c(diǎn)opy到你的項(xiàng)目里
至于每個(gè)工具類是干什么用的,
我自認(rèn)注釋寫得比較完整,
大家伙兒可以下載下來細(xì)細(xì)研究。
第二步:
模糊圖片
很簡單,一句話:
UtilBitmap.blurImageView(this, iv_head_portrait, 25);
不難理解,
第一個(gè)參數(shù)是上下文;
第二個(gè)參數(shù)是要模糊的ImageView;
第三個(gè)參數(shù)是模糊等級(jí),值為 0~25。
塵少的一貫風(fēng)格,
就是這么簡單。
但是我個(gè)人認(rèn)為,
最需要高斯模糊的場景應(yīng)該是彈窗,
所以我特意封裝了一下彈窗的效果:
// 獲取截圖的Bitmap Bitmap bitmap = UtilScreenCapture.getDrawing(this); if (bitmap != null) { // 將截屏Bitma放入ImageView iv_popup_window_back.setImageBitmap(bitmap); // 將ImageView進(jìn)行高斯模糊【25是最高模糊等級(jí)】【0x77000000是蒙上一層顏色,此參數(shù)可不填】 UtilBitmap.blurImageView(this, iv_popup_window_back, 25, 0x77000000); } else { // 獲取的Bitmap為null時(shí),用半透明代替 iv_popup_window_back.setBackgroundColor(0x77000000); } // 打開彈窗 UtilAnim.showToUp(rl_popup_window, iv_popup_window_back);
這里唯一需要注意的, 就是「將ImageView進(jìn)行高斯模糊」的那一行。 可以發(fā)現(xiàn), 比直接模糊圖片多了個(gè)設(shè)置顏色的參數(shù), 其實(shí)從GIF上也能看得出來, 彈窗的背景模糊, 比直接模糊圖片多了層黑色遮罩, 這個(gè)顏色參數(shù)就是做這個(gè)用的, 這個(gè)參數(shù)傳什么顏色, 就會(huì)有什么顏色的遮罩。
至此就差不多了,
歡迎大家伙兒共同探討。
塵少老規(guī)矩,附源碼:
http://download.csdn.net/down...
如果覺得塵少的Demo還不錯(cuò)的話,
可以克隆我的Git倉庫,
各種酷炫效果收入囊中:
https://github.com/Bamboy1203...
手機(jī)掃碼下載App一睹為快:
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://systransis.cn/yun/74199.html
摘要:今天就來研究一下如何在上實(shí)現(xiàn)高斯模糊效果。平時(shí)我們對圖片縮小,必然會(huì)帶來很明顯的清晰度的損失,但高斯模糊本身的目的就是要實(shí)現(xiàn)模糊的效果,因此實(shí)際上的效果差別不大,幾乎可以忽略。 前言 從 iOS 7 開始 Apple 從 擬物化 過渡到了 扁平化 的設(shè)計(jì)風(fēng)格,同時(shí)也搭配使用了 毛玻璃風(fēng)格 當(dāng)做背景效果,不得不說十分驚艷,頗有當(dāng)時(shí)pc上 Widows Vista 和 OS X Yosem...
閱讀 2024·2021-11-15 11:38
閱讀 2058·2019-08-30 15:55
閱讀 2192·2019-08-30 15:52
閱讀 3176·2019-08-30 14:01
閱讀 2693·2019-08-30 12:47
閱讀 1158·2019-08-29 13:17
閱讀 1072·2019-08-26 13:55
閱讀 2640·2019-08-26 13:46