不廢話先看效果圖

scroll.gif

大概效果就是這樣 toolbar和懸浮按鈕隨著viewpager的滾動改變透明度實現(xiàn)淡入淡出的效果

首先設(shè)置viewpager的翻頁監(jiān)聽器

viewPager.addOnPageChangeListener()
里面重寫三個方法
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {}
public void onPageSelected(int position){}
public void onPageScrollStateChanged(int state) {}
本文主要用到第一個方法onPageScrolled()
本方法 傳入3個參數(shù)int position, float positionOffset, int positionOffsetPixels
position:當前頁面，即點擊滑動的頁面
positionOffset:當前頁面偏移的百分比
positionOffsetPixels :當前頁面偏移的像素位置

我們?yōu)榱酥庇^一點定義了一個浮點變量aFloat代表viewpager滾動的位置
float aFloat = positionOffset + (float) position;
比如說本例中有3個頁面aFloat值就會在0~2之間變化
如圖log中顯示的1.3幾就表示第二個頁面到第三個之間

設(shè)置控件透明度：

控件實例.getBackground().setAlpha()
得到控件的背景后用setAlpha()方法設(shè)置透明度，其中setAlpha() 傳入0-255的int形參數(shù)，255代表不透明，0代表全透明。

判斷滾動位置大于1后，就可以隨著positionOffset 值來調(diào)整透明度
toolbar.getBackground().setAlpha((int) (255f - positionOffset * 255f)); floatingActionButton.getBackground().setAlpha((int) (255f - positionOffset * 255f));

然而你會發(fā)現(xiàn)幾個問題：

• 搜索框edittext并不會隨著背景變淡很難看
  

  image.png
  
  于是我們簡單粗暴設(shè)置它的可見性
  editText.setVisibility(View.INVISIBLE);

• 雖然搜索框完全透明看不到，但仍可執(zhí)行操作
  這時我們還是需要設(shè)置可見性
  if(aFloat == 2){
  floatingbutton.setVisibility(View.INVISIBLE);
  }
  當然設(shè)置不可見后在滑動回去時還要設(shè)置回可見哦否則該顯示的顯示不出來

• 光知道位置還不夠，還需要知道是向左還是向右滑動
  這里我們在監(jiān)聽器外面定義一個浮點變量aFloat_first來代表上一次調(diào)用監(jiān)聽方法時的位置來跟本次的比對得到滑動方向
  (aFloat - aFloat_first) > 0表示向右滑動
  (aFloat - aFloat_first) < 0向左

下面貼上監(jiān)聽器全部代碼

private void setPager() {
        viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
                //aFloat代表viewpager滾動位置
                float aFloat = positionOffset + (float) position;
                Log.d(TAG, "onPageScrolled: " + aFloat);
                //解決在 我的 頁面向右快速滑透明度較高的問題（快速滑動會導(dǎo)致不能實時監(jiān)測aFloat）

                if (aFloat > 1) {
                    //設(shè)置透明度
                    editText.getBackground().setAlpha((int) (255f - positionOffset * 255f));
                    toolbar.getBackground().setAlpha((int) (255f - positionOffset * 255f));
                    floatingActionButton.getBackground().setAlpha((int) (255f - positionOffset * 255f));
                    if (aFloat > 1.7 && aFloat < 1.9 && (aFloat - aFloat_first) > 0) {
                        editText.setVisibility(View.INVISIBLE);
                    }
                    if (aFloat > 1.7 && aFloat < 1.9 && (aFloat - aFloat_first) < 0) {
                        editText.setVisibility(View.VISIBLE);
                    }
                    if (aFloat == 2) {
                        toolbar.setVisibility(View.INVISIBLE);
                        floatingActionButton.setVisibility(View.INVISIBLE);
                    }
                }
                if ( aFloat < 2 && aFloat > 1) {
                    if (toolbar.getVisibility() == View.INVISIBLE) {
                        toolbar.setVisibility(View.VISIBLE);
                        editText.setVisibility(View.INVISIBLE);
                        floatingActionButton.setVisibility(View.VISIBLE);
                    }
                }
                aFloat_first = aFloat;


            }

            @Override
            public void onPageSelected(int position) {

                //監(jiān)聽頁卡位置，實現(xiàn)當前頁卡圖標變色
                if (position==0){
                    found_imgbtn.setImageResource(R.drawable.find_press_icon)；
                    lost_imgbtn.setImageResource(R.drawable.find_icon);
                    me_imgbtn.setImageResource(R.drawable.me_icon);
                }if (position==1){
                    found_imgbtn.setImageResource(R.drawable.find_icon);
                    lost_imgbtn.setImageResource(R.drawable.find_press_icon);
                    me_imgbtn.setImageResource(R.drawable.me_icon);
                }if (position==2){
                    found_imgbtn.setImageResource(R.drawable.find_icon);                    lost_imgbtn.setImageResource(R.drawable.find_icon);
                    me_imgbtn.setImageResource(R.drawable.me_press_icon);
                }
            }

            @Override
            public void onPageScrollStateChanged(int state) {
            }
        });```

####okok that`s all