这篇博客是对慕课网上看到的视频里学习到的知识的一些记录,让自己能够加深理解。视频地址:http://www.imooc.com/learn/1116
在这个视频中,目标是实现类似微信的主界面之间的切换,示例图如下:
ViewPager可以实现一个能够左右滑动切换的控件。
首先在布局中使用ViewPager控件,定义一些基本属性即可。
<android.support.v4.view.ViewPager android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="1" android:id="@+id/vp_main"> </android.support.v4.view.ViewPager>
然后先创建一个自定义的Fragment,然后再在MainActivity中使用FragmentPagerAdapter来填充ViewPager中的内容,
FragmentPagerAdapter与其他的Adapter的使用类似。
顺带一提这里也可以使用:FragmentStatePagerAdapter
FragmentStatePagerAdapter与FragmentPagerAdapter的区别:
在每个界面之间来回滑动时,当超出缓存区时
FragmentPagerAdapter会调用onDestroyView(Fragment没有被销毁)
而FragmentStatePagerAdapter会调用onDestroyView和onDestroy(Fragment被销毁)
可能会出现的问题有:当使用的Fragment特别多时,使用FragmentPagerAdapter会让内存变得很大,
所以具体的使用根据项目的不同来选择。
private void initViewPagerAdapter() { //解除缓存的界面数量限制 mVpMain.setOffscreenPageLimit(mTitles.size()); mVpMain.setAdapter(new FragmentPagerAdapter(getSupportFragmentManager()) { @Override public Fragment getItem(int i) { TabFragment fragment = TabFragment.newInstance(mTitles.get(i)); return fragment; } @Override public int getCount() { return mTitles.size(); } @NonNull @Override public Object instantiateItem(@NonNull ViewGroup container, int position) { TabFragment fragment = (TabFragment) super.instantiateItem(container, position); mFragment.put(position, fragment); return fragment; } @Override public void destroyItem(@NonNull ViewGroup container, int position, @NonNull Object object) { mFragment.remove(position); super.destroyItem(container, position, object); } });
其中newInstance方法是TabFragment中的方法,将当前的页面对应的标题传给TabFragment,之后TabFragment类得到这个标题再显示在页面上
这样写的好处是:当Activity被停掉之后再次启动时,显示的内容能够还原。
public static TabFragment newInstance(String title){ Bundle bundle = new Bundle(); bundle.putString(BUNDLE_KEY_TITLE, title); TabFragment tabFragment = new TabFragment(); tabFragment.setArguments(bundle); return tabFragment; }
屏幕下方的四个按钮使用4个自己定义的TabView来实现,难点在于,如何实现这个TabView在切换到当前页面与没有切换时改变颜色
先在TabView中创建一个方法,使得这个View在收到传入的值是0的时候,显示成未被选中的样子,而在传入的值是1时,显示成
被选中的样子。
public void setProgress(float progress) { //progress传入0的时候全黑(mIvIcon显示中) //progress传入1的时候全绿(mIvIconSelect显示中)
//mIvIcon和mIvIconSelect代表选中与未选中的图片样式
mIvIcon.setAlpha(1 - progress); mIvIconSelect.setAlpha(progress); }
下面这个自动生成的方法中有一个参数,positionOffset,当从左往右滑动时,这个参数会逐渐由0变1,从右往左滑时,会从1变0
于是在这个方法中写入以下代码,使得从第一个转到第二个时,第一个的参数由1变0,第二个的参数由0变1,第二个转到第一个时
第一个的参数由0变1,第二个的参数由1变0,这样就能实现颜色的转换
@Override public void onPageScrolled(int position, float positionOffset, int positionOffsetPixel) { if(positionOffset > 0) { TabView left = mTabs.get(position); TabView right = mTabs.get(position + 1); left.setProgress(1 - positionOffset); right.setProgress(positionOffset); } }
这样,切换的操作就能完成了。