Android Studio精彩案例(一)《ActionBar和 ViewPager版仿网易新闻客户端》
转载本专栏文章,请注明出处,尊重原创 。文章博客地址:道龙的博客
为了能更好的分享高质量的文章,所以开设了此专栏。文章代码都以Android Studio亲测运行,读者朋友可在后面直接下载源码。该专栏是基于Android Studio的精彩案例和一些中高级知识的心得,以及在公司实际开发中遇到的问题等。同时为了保证文章的条理性、高质量性,本专栏的文章更新频率可能比较慢,想看基础性文章可参见博主其它专栏的文章。喜欢我的朋友可以关注我,期待朋友们的关注和指正,大家一起交流学习技术,共同进步。
本篇文章是根据以前一位博主一篇《Android 开源框架ActionBarSherlock 和 ViewPager 仿网易新闻客户端》地址:http://blog.csdn.net/xiaanming/article/details/9971721 的修改版。那篇文章的代码逻辑是有问题的,也是在eclipse中开发的,但实际放到eclipse中并不能运行。所以本人对此做了优化,同时防到AS中运行,又做了一些改进,比如AS使用ActionBarSherlock 并不能很好的运行(这个还要待证原因,知道的朋友也可留言解决),调试错误调了一天也未果。想了想还是使用原生的ActionBar吧,也可以 实现完全相同的效果。想象谷歌自己的API,使用起来肯定不会出现问题的了~ 接下来就来模仿网易新闻客户端吧。
咱先来看看网易新闻客户端长得啥样子:
PS:这个页面是可以通过很多技术手段来完成它的。今天这篇是使用ActionBar+ViewPage+Fragment罢了。
那么就让咱们慢慢来把这个框架搭建起来吧~
首先,我们需要新建一个AS工程,并添加入对应的V7包依赖。AS默认就添加好的
我们看看主要代码的编写:
1.先看布局文件,里面一个ViewPager,非常简单
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@android:color/white"> <android.support.v4.view.ViewPager android:id="@+id/viewPager" android:layout_width="fill_parent" android:layout_height="wrap_content" /> </RelativeLayout>
2.MainActivity代码,点击ActionBar的Tab,ViewPager切换不同的Fragment,滑动ViewPager,选中相对应的ActiionBar Tab
public class MainActivity extends AppCompatActivity implements ActionBar.TabListener, ViewPager.OnPageChangeListener { /** * 顶部Tab的title */ private String[] mTabTitles; /** * ViewPager对象的引用 */ private ViewPager mViewPager; /** * 装载Fragment的容器,我们的每一个界面都是一个Fragment */ private List<Fragment> mFragmentList = new ArrayList<Fragment>(); /** * ActionBar对象的引用 */ private ActionBar mActionBar; private ActionBar.Tab tab; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); mViewPager = (ViewPager) findViewById(R.id.viewPager); initActionBar(); // 设置监听 mViewPager.setOnPageChangeListener((ViewPager.OnPageChangeListener) this); } private void initActionBar() { /************ 初始化actionBar组件 ******************/ // 获取Action实例我们使用getSupportActionBar()方法 mActionBar = getSupportActionBar(); // 隐藏Title mActionBar.setDisplayShowTitleEnabled(false); // 隐藏Home logo mActionBar.setDisplayShowHomeEnabled(false); // 设置ActionBar的导航模式为Tab mActionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS); // 从资源文件在获取Tab的title mTabTitles = getResources().getStringArray(R.array.tab_title); // 为ActionBar添加Tab并设置TabListener for (int i = 0; i < mTabTitles.length; i++) { tab = mActionBar.newTab(); tab.setText(mTabTitles[i]);// 设置tab名称 tab.setTabListener(this);// 设置tab的监听器 mActionBar.addTab(tab, i);// 添加tab,根据位置 } // 将Fragment加入到List中,并将Tab的title传递给Fragment for (int i = 0; i < mTabTitles.length; i++) { Fragment fragment = new ItemFragment(); //向fragment传递数据的方法 Bundle args = new Bundle(); args.putString("arg", mTabTitles[i]); fragment.setArguments(args);// 向fragment传递参数,使用fragment.setArguments(args);数据不会丢失 mFragmentList.add(fragment);//fragment集合 } // 设置Adapter,设置Adapter一定保证有数据源,Adapter绑定数据完毕 mViewPager.setAdapter(new TabPagerAdapter(getSupportFragmentManager(), mFragmentList)); } @Override public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) { } @Override public void onPageSelected(int position) { // 滑动ViewPager的时候设置相对应的ActionBar Tab被选中 mActionBar.setSelectedNavigationItem(position); } @Override public void onPageScrollStateChanged(int state) { } @Override public void onTabSelected(ActionBar.Tab tab, FragmentTransaction ft) { // 点击ActionBar Tab的时候切换不同的Fragment界面 mViewPager.setCurrentItem(tab.getPosition());//参数:当前tab的位置 } @Override public void onTabUnselected(ActionBar.Tab tab, FragmentTransaction ft) { } @Override public void onTabReselected(ActionBar.Tab tab, FragmentTransaction ft) { } }
我们使用ActionBar的时候不再是继承Activity,而是继承ActionBarActivity,或者他的父类AppCompatActivity类,我们不能随便设置Activity的theme,以后我们要全屏显示的时候直接设置android:theme="@android:style/Theme.Black.NoTitleBar",我们使用ActionBar就不能这样设置了,并且不能随便设置他的Theme,必须是Theme.Sherlock.Light,或者是他们的子样式,不然就会出java.lang.IllegalStateException异常,所以为了自定义ActionBar的Tab,我们必须修改其style。在清单文件,你需要修改掉。
3.ViewPager的适配器TabPagerAdapter,因为我们用到Fragment,所以我们继承FragmentStatePagerAdapter而不是PagerAdapter
public class TabPagerAdapter extends FragmentStatePagerAdapter { private List<Fragment> list; public TabPagerAdapter(FragmentManager fm, List<Fragment> list) { super(fm); this.list = list; } @Override public Fragment getItem(int arg0) { return list.get(arg0); } @Override public int getCount() { return list.size(); } }
4.ItemFragment 可以直接继承Fragment,里面的的布局比较简单,一个TextView用来显示从Activity传递过来的ActionBar Tab的title
public class ItemFragment extends Fragment { @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { View contextView = inflater.inflate(R.layout.fragment_item, container, false); TextView mTextView = (TextView) contextView.findViewById(R.id.textview); Bundle mBundle = getArguments(); String title = mBundle.getString("arg"); mTextView.setText(title); return contextView; } }
然后我们将上面的Activity的theme设置成android:theme="@style/Theme.Sherlock.Light" 运行项目看看效果:
我们可以看到,核心的效果其实已经做出来了。感兴趣的朋友可以下载源码自己修改一下样式~在这个Fragment流行的时代,使用这样方式也是不错的选择嘛~赶快下载跑起来吧~~
喜欢我的朋友可以关注我。
源码下载地址:点击打开链接
也可以打开微信搜索公众号 Android程序员开发指南 或者手机扫描下方二维码 在公众号阅读更多Android文章。
微信公众号图片: