Android View部分消失效果實現

我們經常會有需求就是view消失的效果，這裡我們說的消失往往是全部消失，我們可能採用乙個alpha動畫，在指定的時間內消失掉view，出現則實現相反的動畫。我們一般都採用如下的實現：

採用tween動畫實現：

private void alphatween
() 複製**

或者採用屬性動畫實現：

private void alphaob
() 複製**

也可能採用xml來實現。

但是這裡我們需要的不是上面的效果，你是在逗我？？不是上面的效果，你說這麼多。我們需求如下，這裡我們用兩個圖來展示：

左邊是原始，右邊是處理後的。可以看到從下到上越來越淡，頂部就已經像消失了一樣。說道這裡很多人肯定會聯想到的濾鏡效果。但是這裡實現的方式簡單的多。

這裡我們寫乙個demo來實現這個效果。既然是在對view進行處理，那這裡我們就先對一張進行處理。之後在擴充套件。

既然我們需要將變淡消失，肯定是需要合成了什麼效果。那android裡面一般合成我們都採用什麼方式吶？

android裡面我們可以採用xfermode來實現的合成，比如我們可以實現各種各樣的頭像，例如圓形頭像。那這裡我們需要採用哪種mode？

這裡先draw是dest，後draw是src，我們需要的是將dest露出，同時將src產生的效果合成到dest上，那這裡我們需要用的是dst_in效果。

上面圖示表示一方是全透明的，其實還需要結合mode定義來完全理解該效果，mode的計算方式如下：

public enum mode     /**
* @hide
*/public final int nativeint;
}複製**

從效果圖上我們可以看到，消失的效果，不是整塊消失，而是部分效果，就是效果是有乙個漸變的過程。那這裡我們需要合成的效果應該是乙個漸變效果的。比如從全透明到全不透明。

我們已經分析了全部需要的效果，那就最終寫**來看看最後的效果。

public class fadingpic extends view     public fadingpic(context context, @nullable attributeset attrs)     public fadingpic(context context, @nullable attributeset attrs, int defstyleattr)     private void init(context context, attributeset attrs)     @override
protected void onmeasure(int widthmeasurespec, int heightmeasurespec)     @override
protected void ondraw(canvas c) 
}複製**

我們直接操作了本地的一張。先draw出原圖，在draw出合成後效果圖。

1，定義了xfermode為porterduff.mode.dst_in 2，給paint設定乙個線性漸變的shader，透明圖從全透明到全不透明，平鋪模式為clamp 3，這裡一定要在新的layer中進行操作，否則只是疊加效果

實現2上面我們採用在新的layer進行操作，如果不在新的layer只是疊加效果，那不採用layer是否有方式可以實現？當然是可以的。這裡我們改變一下當前的**再新建立乙個bitmap:

package com.demo.opengl.widget;import android.content.context;import android.graphics.bitmap;import android.graphics.bitmapfactory;import android.graphics.canvas;import android.graphics.lineargradient;import android.graphics.paint;import android.graphics.porterduff;import android.graphics.porterduffxfermode;import android.graphics.shader;import android.support.annotation.nullable;import android.util.attributeset;import android.view.view;import com.demo.opengl.r;/**
* created by hzsunyj on 2017/8/9.
init(context, null);
}    public fadingpic(context context, @nullable attributeset attrs)     public fadingpic(context context, @nullable attributeset attrs, int defstyleattr)     private void init(context context, attributeset attrs)     @override
protected void onmeasure(int widthmeasurespec, int heightmeasurespec)     @override
protected void ondraw(canvas c) 
}複製**

這裡大部分**是相同的，只是現將效果合成到乙個新的bitmap，最後再將bitmap draw到螢幕上。

到這裡也許你會問，這個需求沒什麼用啊！哪有這樣需求。那這裡我們就舉個栗子。比如我們有乙個列表頁，當最上的條目滾動消失的時候，不是硬生生的消失，而是比較自然的消失。

比如上面，我們向上滾動頂部就有乙個明顯的被切掉的效果。不太友好。那我們可以處理成如下效果：

頂部乙個漸變消失的效果。不會顯的太突兀。

之前我們實現了的部分消失效果，那這裡我們怎麼處理，比如這個recyclerview，是針對每一行來進行處理？這樣是不是很麻煩，又這種bind狀態，還有各種重用，感覺問題比較多。前面的的方式根本不能重用啊！！

那這裡我們怎麼實現吶？我們是否可以不對item實現效果，而是針對整個recyclerview來實現？

public class fadingrecyclerview extends recyclerview     public fadingrecyclerview(context context, @nullable attributeset attrs)     public fadingrecyclerview(context context, @nullable attributeset attrs, int defstyle)     private void init(context context, attributeset attrs)     @override
protected void onsizechanged(int w, int h, int oldw, int oldh)     @override
public void draw(canvas c) 
}複製**

我們重寫了recyclerview，在draw函式中合成了效果，這裡recyclerview是乙個viewgroup，需要複寫draw函式，而不是ondraw。

前面我們說過，如果不在新的layer裡面合成只會產生疊加效果，那這個疊加效果有什麼用吶？我們可以來實現倒影效果，他也是階梯漸變的，那這裡我們就來實現一下倒影效果。主要的區別為是否在新的layer裡面實現。

public class fadingpic extends view     public fadingpic(context context, @nullable attributeset attrs)     public fadingpic(context context, @nullable attributeset attrs, int defstyleattr)     private void init(context context, attributeset attrs)     @override
protected void onmeasure(int widthmeasurespec, int heightmeasurespec)     @override
protected void ondraw(canvas c) 
}複製**

如果有人有更簡單的方式，可以****。

網易雲免費體驗館，0成本體驗20+款雲產品！

Android View部分消失效果實現

Android View部分消失效果實現

android view介紹隨心

android view繪製過程

Android View部分消失效果實現

Android View部分消失效果實現

android view介紹 隨心

android view繪製過程

相關推薦

android view介紹隨心