高仿微信主UI

---

之前在Android组件：Fragment切换后保存状态 一文中讲到了Fragment切换后，是如何保存原来的状态的，最重要的就是用add方法取代现在各种教程常见的replace方法。然而我发现有不少App都貌似采用ViewPager + Fragment来做主UI的。于是在Android组件：Fragment切换后保存状态 的基础上加入了ViewPager，看了下微信界面，要高仿就尽力模仿到最像，所以也把ActionBar也修改成微信的样子。

先上一张效果图：

布局

---

我知道微信这个主UI肯定没我想得那么简单，而实现上面这个效果用了四个主要的元素。

1. ActionBar
2. Fragment
3. ViewPager
4. 姑且认为是button吧

---

1.ActionBar

---

这一块还是蛮简单的，就是在res/menu，写一个menu.xml文件就OK了。需要注意的是：如果手机又实体菜单按键的，最常见就是三星啦，可以调用一个方法来让Menu显示在ActionBar上。

    private void getOverflowMenu() {
        try {
            ViewConfiguration config = ViewConfiguration.get(this);
            Field menuKeyField = ViewConfiguration.class
                    .getDeclaredField("sHasPermanentMenuKey");
            if (menuKeyField != null) {
                menuKeyField.setAccessible(true);
                menuKeyField.setBoolean(config, false);
            }
        } catch (Exception e) {
            e.printStackTrace();
        }
    }

另外也要注意一下版本之间的问题，例如高版本的Activity就不必继承ActionBarActivity了。

---

2.Fragment

---

这一块视乎不是重点，大家如果不熟悉Fragment可以参考我之前写的两篇关于Fragment的文章 - -

---

3.ViewPager

---

我们知道ViewPager的使用步骤是：

1. 写一个ArrayList，里面的元素是加载布局文件后的View，如` View view1 = View.inflate(MainActivity.this, R.layout.tab1, null);
2. 写一个Adater继承PagerAdapter，然后重写几个重要的方法
3. 然后viewPager.setAdapter就完事了

但是，我们要加载的是Fragment，这该怎么办呢？其实更加简单，我们只需要把Adapter改为继承FragmentPagerAdapter 就可以了

    private class MyPagerAdapter extends FragmentPagerAdapter {

        public MyPagerAdapter(FragmentManager fm) {
            super(fm);
            // TODO Auto-generated constructor stub
        }

        @Override
        public Fragment getItem(int arg0) {
            // TODO Auto-generated method stub
            return list.get(arg0);
        }

        @Override
        public int getCount() {
            // TODO Auto-generated method stub
            return list.size();
        }

    }

其中的List元素，由View变成了Fragment..

---

4.Button

---

这个Button的使用比第一篇还要简单，因为我们只需要这样就可以了：

    public void onClick(View arg0) {
        switch (arg0.getId()) {
        ...
        case R.id.tongxunlu_layout:
            viewPager.setCurrentItem(1, true);
            break;
        ...
        }
    }

---

总结

---

FragmentPagerAdapter 貌似不能起到切换后自动保存状态的作用，但可以在Fragment里面来操作，来达到这个功能吧。

---

CSDN下载源码