主页面：
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/activity_main" android:layout_width="match_parent" android:layout_height="match_parent" tools:context="com.suikajy.fragmentpageadapter.MainActivity"> <android.support.v4.view.ViewPager android:id="@+id/vp_main" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_above="@+id/ll_navigation"></android.support.v4.view.ViewPager> <LinearLayout android:id="@+id/ll_navigation" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" android:layout_alignParentBottom="true" android:orientation="horizontal"> <include android:id="@+id/n1" layout="@layout/navigation_item" android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1" /> <include android:id="@+id/n2" layout="@layout/navigation_item" android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1"/> <include android:id="@+id/n3" layout="@layout/navigation_item" android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1"/> <include android:id="@+id/n4" layout="@layout/navigation_item" android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1"/> </LinearLayout> </RelativeLayout> Fragment就是一个TextView , Java部分用的是可传参Fragment的模式(见鸿扬大神博客) . 底部导航的图标界面(include中的) , 采用两个ImageView重合的方式 , 控制透明度实现渐变 : <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:gravity="center" android:orientation="vertical"> <ImageView android:id="@+id/iv_unable" android:layout_width="20dp" android:layout_height="20dp" android:alpha="1" android:src="@drawable/shape_unable" /> //图标就是一个绿色 , 一个灰色 的shape圆形文件 <ImageView android:id="@+id/iv_enable" android:layout_width="20dp" android:layout_height="20dp" android:layout_marginTop="-20dp" android:alpha="0" android:src="@drawable/shape_enable" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="微信" android:id="@+id/tv_navigation"/> </LinearLayout> MainActivity : package com.suikajy.fragmentpageadapter; import android.support.v4.app.Fragment; import android.support.v4.app.FragmentManager; import android.support.v4.app.FragmentPagerAdapter; import android.support.v4.view.ViewPager; import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.view.View; import android.widget.ImageView; import android.widget.TextView; import java.util.ArrayList; import java.util.List; public class MainActivity extends AppCompatActivity { private List<Fragment> fragments; private MyAdapter myAdapter; private ViewPager vp; private List<NaviViewHolder> selectorList = new ArrayList<>(); @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); initFragment(); initNavigation(); vp = (ViewPager) findViewById(R.id.vp_main); setViewPager(); } private void initNavigation() { int[] navs = new int[]{R.id.n1, R.id.n2, R.id.n3, R.id.n4}; for (int i = 0; i < navs.length; i++) { View view = findViewById(navs[i]); ImageView enable = (ImageView) view.findViewById(R.id.iv_enable); ImageView unable = (ImageView) view.findViewById(R.id.iv_unable); TextView textView = (TextView) view.findViewById(R.id.tv_navigation); NaviViewHolder selector = new NaviViewHolder(enable, unable, textView); selectorList.add(selector); } } private void setViewPager() { vp.setAdapter(myAdapter); vp.addOnPageChangeListener(new ViewPager.SimpleOnPageChangeListener() { { selectorList.get(0).getEnable().setAlpha(1f); selectorList.get(0).getUnable().setAlpha(0f); } @Override public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) { if (positionOffset != 0 && positionOffsetPixels != 0) {//每次滑动结束都会调用一次onPageScrolled,并且第2,3个参数都是0,这会影响计算,故屏蔽 selectorList.get(position).getEnable().setAlpha(1f - positionOffset); selectorList.get(position).getUnable().setAlpha(positionOffset); selectorList.get(position + 1).getEnable().setAlpha(positionOffset); selectorList.get(position + 1).getUnable().setAlpha(1f - positionOffset); } } }); } private void initFragment() { fragments = new ArrayList<>(); for (int i = 0; i < 4; i++) { fragments.add(ContentFragment.getContentFragment(i + "")); } myAdapter = new MyAdapter(getSupportFragmentManager(), fragments); } static class MyAdapter extends FragmentPagerAdapter { final List<Fragment> fragments; public MyAdapter(FragmentManager fm, List<Fragment> fragments) { super(fm); this.fragments = fragments; } @Override public Fragment getItem(int position) { return fragments.get(position); } @Override public int getCount() { return fragments.size(); } } static class NaviViewHolder { private ImageView enable; private ImageView unable; private TextView textView; public NaviViewHolder(ImageView enable, ImageView unable, TextView textView) { this.enable = enable; this.unable = unable; this.textView = textView; } public ImageView getEnable() { return enable; } public ImageView getUnable() { return unable; } public TextView getTextView() { return textView; } } } 总结 : 主要是根据ViewPager的滑动监听事件 , 获取滑动百分比 , 然后设置透明度onPageScrolled(int position, float positionOffset, int positionOffsetPixels) (滑动过程无关向哪个方向滑动, 都是两个Page) : 参数一 指代滑动过程中左侧的Page的position参数二 指代滑动过程中右侧的Page区域占屏幕宽度的百分比参数三 指代滑动过程中右侧的Page区域站屏幕宽度的像素数量 include其实就是一个View标签 , 或者可以当一个可分离出去的ViewGroup也可以
