Android仿淘宝tab返回

一、概述

               淘宝相信大家都在用过，不过不知道各位有没有仔细观察过淘宝的tab界面，尤其是返回的时候的逻辑。最近闲来无事，猛然发现淘宝的tab界面还真的挺好玩，废话不多说，接下来就开始我们的正题：

        首先，我们先来分析一下他的返回逻辑，仔细观察你会发现，他并不是你一点返回就会让你退，而是只有你在主界面的时候才会让你退出。当不在主界面时则会依次返回到你以前的界面，在主界面退出。如果重复点击同一个tab，则会把跳转到前一个相同tab，并把之后所有tab移除。

       好了，逻辑先分析到这里，大家可以打开手机淘宝慢慢体会。

二、代码实现

首先,我们先来实现tab界面，这里我们使用radiogroup+fragment的方式

我们先来编写5个Fragment，这里仅作演示，所以简单编写了几个

public class Fragment1 extends Fragment{    @Nullable    @Override    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {        TextView textView=new TextView(getActivity());        textView.setText("Fragment1");        return textView;    }}

   其他四个分别为：Fragment2，Fragment3，Fragment4，Fragment5，内容与上面代码一致，为了节省空间和时间，这里就不一    一列出

      接下里我们为fragment建立一个工厂类：

           

 
public class FragmentFactory {    private  static SparseArray<Fragment> fragmentList=new SparseArray<>();   //fragment集合，保证每个fragment只被 实例一次   public static Fragment getLocalFragment(int id) {      Fragment fragment =fragmentList.get(id);        if(fragment!=null)            return  fragment;      switch (id) {      case R.id.id_main_radio:         fragment = new Fragment1();         break;      case R.id.id_change_radio:         fragment = new Fragment2();         break;      case R.id.id_record_radio:         fragment = new Fragment3();         break;      case R.id.id_setting_radio:         fragment = new Fragment4();         break;      case R.id.id_shenqing_radio:         fragment = new Fragment5();         break;      }        fragmentList.put(id,fragment);          //保存此fragment，方便下次调用      return fragment;   }}

      接下来看main.xml的布局文件

   
  
<?xml version="1.0" encoding="utf-8"?>  <LinearLayout    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="vertical"    xmlns:android="http://schemas.android.com/apk/res/android">    <FrameLayout        android:id="@+id/frame"        android:layout_width="fill_parent"        android:layout_height="0dp"        android:layout_weight="1" />    <RelativeLayout        android:layout_width="match_parent"        android:layout_height="wrap_content" >        <RadioGroup            android:id="@+id/tabgroup"            android:layout_width="fill_parent"            android:layout_height="52dp"            android:layout_gravity="bottom"            android:orientation="horizontal" >            <RadioButton                android:id="@+id/id_main_radio"                style="@style/weibo_tab"                android:layout_width="fill_parent"                android:layout_height="fill_parent"                android:layout_weight="1"                android:checked="true"                android:drawableTop="@drawable/home"                android:text="首页" />            <RadioButton                android:id="@+id/id_change_radio"                style="@style/weibo_tab"                android:layout_width="fill_parent"                android:layout_height="fill_parent"                android:layout_weight="1"                android:drawableTop="@drawable/myservice"                android:text="我的服务" />            <RadioButton                android:id="@+id/id_shenqing_radio"                style="@style/weibo_tab"                android:layout_width="fill_parent"                android:layout_height="fill_parent"                android:layout_weight="1"                android:drawableTop="@drawable/myapply"                android:text="申请" />            <RadioButton                android:id="@+id/id_record_radio"                style="@style/weibo_tab"                android:layout_width="fill_parent"                android:layout_height="fill_parent"                android:layout_weight="1"                android:drawableTop="@drawable/cart"                android:text="购物车" />            <RadioButton                android:id="@+id/id_setting_radio"                style="@style/weibo_tab"                android:layout_width="fill_parent"                android:layout_height="fill_parent"                android:layout_weight="1"                android:drawableTop="@drawable/mine"                android:text="我" />        </RadioGroup>    </RelativeLayout></LinearLayout>

 style如下：

      
   <style name="weibo_tab">    <item name="android:layout_height">wrap_content</item>    <item name="android:layout_width">match_parent</item>    <item name="android:layout_weight">1</item>    <item name="android:gravity">center</item>    <item name="android:paddingTop">8dip</item>    <item name="android:background">@drawable/background</item>    <item name="android:paddingBottom">4dip</item>    <item name="android:button">@null</item>    <item name="android:textSize">12sp</item>    <item name="android:textColor">@drawable/radiotext</item>  </style>
   最后就是我们的重中之重了，也就是我们的MainActivity:
       
public class MainActivity extends FragmentActivity implements      OnCheckedChangeListener {   private static RadioGroup tab_group;   private FragmentManager fragmentManager;   public Context context;   private int[] radioIds;              //存放所有Radiobutton的id   private static Boolean isExit = false;   private boolean isBack;    //记录是都是返回，如果是返回则不调用onCheckedChanged   @Override   protected void onCreate(Bundle savedInstanceState) {      super.onCreate(savedInstanceState);      requestWindowFeature(Window.FEATURE_NO_TITLE);      setContentView(R.layout.main);      context = MainActivity.this;      initViews();        fragmentManager = getSupportFragmentManager();      FragmentTransaction transaction = fragmentManager.beginTransaction();        Fragment mainFragment=FragmentFactory.getLocalFragment(R.id.id_main_radio);      transaction.add(R.id.frame, mainFragment, R.id.id_main_radio + "");        transaction.addToBackStack(R.id.id_main_radio + "");    //放入栈底，保证每次都从首页退出      transaction.commit();        ActivityManager.getInstance().addActivity(this);   }   private void initViews() {      tab_group = (RadioGroup) findViewById(R.id.tabgroup);      tab_group.setOnCheckedChangeListener(this);      radioIds = new int[] { R.id.id_main_radio, R.id.id_change_radio,            R.id.id_shenqing_radio,R.id.id_record_radio, R.id.id_setting_radio };   }   @Override   public void onCheckedChanged(RadioGroup group, int checkedId) {      if(isBack){         isBack=false;          return;          }else {      tab_group.check(tab_group.getCheckedRadioButtonId());      FragmentTransaction transaction = fragmentManager.beginTransaction();            Fragment fragment1=fragmentManager.findFragmentByTag(checkedId + "");            if(fragment1==null){                //如果为空，则表明此fragment从来没有被点击过             fragment1 = FragmentFactory.getLocalFragment(checkedId);                transaction.addToBackStack(checkedId+"");            }else {                //该fragment已经入栈                boolean isCurrent=false;       //是否是当前栈                for (int i=0,size=fragmentManager.getBackStackEntryCount();i<size;i++){                    String name=fragmentManager.getBackStackEntryAt(i).getName();  //获取当前栈名称                    if(isCurrent)                        fragmentManager.popBackStack();                    if(name.equals(checkedId+"")){                        isCurrent=true;                    }                }            }            transaction.replace(R.id.frame, fragment1,checkedId+"");          transaction.commit();        }   }   @Override   public boolean onKeyDown(int keyCode, KeyEvent event) {      if (keyCode == KeyEvent.KEYCODE_BACK) {         FragmentManager fragmentManager=getSupportFragmentManager();         int count=fragmentManager.getBackStackEntryCount();      if(count>1){         fragmentManager.popBackStack();         isBack=true;         BackStackEntry backstatck=getSupportFragmentManager().getBackStackEntryAt(count-1);            RadioButton radioButton=(RadioButton) tab_group.findViewById(radioIds[(backstatck.getId()-1)%5]);         radioButton.setChecked(true);      }else {         exitBy2Click();      }      }      return false;   }   private void exitBy2Click() {      Timer tExit = null;      if (isExit == false) {         isExit = true;         Toast.makeText(this, "再按一次退出", Toast.LENGTH_SHORT).show();         tExit = new Timer();         tExit.schedule(new TimerTask() {            @Override            public void run() {               isExit = false;            }         }, 2000);      } else {         ActivityManager.getInstance().exit();      }   }}

   好了，至此，我们的仿淘宝tab返回就算是基本完成了，快来看看我们的效果吧：
   
项目下载地址：点击下载demo