天天看點

Android實用視圖動畫及工具系列之八:帶頭部的Viewpaper,結合頭部的Fragment切換效果 聲明

實作效果

Android實用視圖動畫及工具系列之八:帶頭部的Viewpaper,結合頭部的Fragment切換效果 聲明

功能說明

如果需要在Viewpaper中增加一個頭部,讓頭部在Viewpaper在向下滑動時隐藏,向上滑動時推出,這種情況Android的原生控件便無法滿足我們想要的需求,于是我們自己來編寫個可隐藏頭部的滑動控件,在ScrollableHeader項目中自定義了一個ScrollableLayout布局,布局通過監聽滾動條的滑動事件達到隐藏顯示頭部的目的 。

Android實用視圖動畫及工具系列之八:帶頭部的Viewpaper,結合頭部的Fragment切換效果 聲明

--------------------------------------------------------------------------------------------------------------------

Demo圖中結合了可定制标簽欄PagerSlidingTabStrip使用,如需了解看這篇Blog: http://blog.csdn.net/jaikydota163/article/details/52098875 --------------------------------------------------------------------------------------------------------------------

部署及使用

在Android Studio環境下:

一:添加項目依賴路徑

目前作者隻釋出項目到jcenter,是以需要在項目gradle中添加

allprojects {
    repositories {
        jcenter()
    }
}
           

然後在app gradle中添加依賴

dependencies {
    compile 'com.github.cpoopc:scrollablelayoutlib:1.0.1'
}
           

二:布局和具體運用

使用比較簡單,在布局檔案中添加如下,ScrollableLayout就是整個滾動條布局,ScrollableLayout的第一個子Viewgroup即可添加頭布局:

<com.cpoopc.scrollablelayoutlib.ScrollableLayout
        android:id="@+id/scrollableLayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">
<-- header -->
  <-- header example -->
        <RelativeLayout
            android:id="@+id/rl_head"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="#cdcdcd">
        </RelativeLayout>
  <-- header example -->

<-- content View -->
  <-- content View example -->
        <com.astuetz.PagerSlidingTabStrip
            android:id="@+id/pagerStrip"
            android:layout_width="match_parent"
            android:layout_height="@dimen/tab_height"
            android:layout_alignParentBottom="true" />
        <android.support.v4.view.ViewPager
            android:id="@+id/viewpager"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />
  <-- content View example -->

    </com.cpoopc.scrollablelayoutlib.ScrollableLayout>
           

在Viewpaper添加的Fragment中繼承ScrollableHelper.ScrollableContainer并實作getScrollableView方法,返復原動的控件:

@Override
    public View getScrollableView() {
        return scrollView;
    }
           

設定目前container:

mScrollLayout.getHelper().setCurrentScrollableContainer(scrollableContainer)
           

結合PagerSlidingTabStrip使用如下:

final ArrayList<ScrollAbleFragment> fragmentList = new ArrayList<>();
        fragmentList.add(ListFragment.newInstance());
        fragmentList.add(ScrollViewFragment.newInstance());
        fragmentList.add(RecyclerViewFragment.newInstance());
        fragmentList.add(WebViewFragment.newInstance());

        List<String> titleList = new ArrayList<>();
        titleList.add("ListView");
        titleList.add("ScrollView");
        titleList.add("RecyclerView");
        titleList.add("WebView");
        viewPager.setAdapter(new MyFragmentPagerAdapter(getChildFragmentManager(), fragmentList, titleList));
        mScrollLayout.getHelper().setCurrentScrollableContainer(fragmentList.get(0));
        pagerSlidingTabStrip.setViewPager(viewPager);
        pagerSlidingTabStrip.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            @Override
            public void onPageScrolled(int i, float v, int i2) {

            }

            @Override
            public void onPageSelected(int i) {
                Log.e("onPageSelected", "page:" + i);
                /** 标注目前頁面 **/
                mScrollLayout.getHelper().setCurrentScrollableContainer(fragmentList.get(i));
            }

            @Override
            public void onPageScrollStateChanged(int i) {

            }
        });
        viewPager.setCurrentItem(0);
           

--------------------------------------------------------------------------------------------------------------------

更多詳細使用請看Demo,擷取源代碼及資源檔案: https://github.com/jaikydota/Android-ScrollableHeader

--------------------------------------------------------------------------------------------------------------------

聲明

歡迎轉載,但請保留文章原始出處

作者:Jaiky_傑哥 

出處:http://blog.csdn.net/jaikydota163/article/details/52098878