Android中实现多Tab页应用

Android上的多Tab是一个什么效果?如果图片看不懂的话,但是使用过Android的微博客户端,那也很清晰了,就是那个样子。

在Android API V4版本以前,可以使用TabActivity来实现多Tab的应用程序,可以参考:http://developer.android.com/guide/topics/ui/layout/tabs.html 。从里面的讲解可以看到,这个教程还是相对简单的。

但是在Android API V4版本之后,TabActivity被废弃了不推荐使用,被替换为Fragment, FragmentActivity了,使用新的API后,开发难度提升了不少,其官方教程: http://developer.android.com/training/basics/fragments/creating.html 也没有一个完整的示例。

好不容易,从Google code上面,搜索到了一个教程http://code.google.com/p/google-mobile-dev/source/browse/adcatalog/src/com/google/ad/catalog/layouts/TabbedViewExample.java?repo=ad-catalog-android,不过比较复杂,在这儿整理一下。

实现思路,这个一定要看。

  1. 实现一个Activity extends FragmentActivity。
  2. 实现一个Tab页切换的管理类,监听Tab页切换事件,负责控制Fragment显示其内容。
  3. 通过TabInfo类实现Tab与Fragment以及Activity之间的关联。

下面是代码实现,就不一一讲解了,感兴趣的同学同学,在评论中讨论。

import java.util.HashMap;

import android.content.Context;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentTransaction;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TabHost;
import android.widget.TabHost.OnTabChangeListener;
import android.widget.TabHost.TabContentFactory;
import android.widget.TabHost.TabSpec;

public class MultiTabActivity extends FragmentActivity {

private TabHost tabHost = null;
private TabManager tabManager = null;

@Override
public void onCreate(Bundle savedInstanceState){
super.onCreate(savedInstanceState);

setContentView(R.layout.activity_frame);
tabHost = (TabHost)findViewById(android.R.id.tabhost);
tabHost.setup();

//Initialize the tabs
this.tabManager = new TabManager(this, this.tabHost, android.R.id.tabcontent);
Bundle args = new Bundle();
TabSpec tabspec;

//first frame
args.putInt("layoutResource", R.layout.test_frame);
tabspec = this.tabHost.newTabSpec("Tab1");
tabspec.setIndicator("Tab1");
this.tabManager.addTab(tabspec, TabFragment.class, args);

//second frame
args = new Bundle();
args.putInt("layoutResource", R.layout.test_frame2);
tabspec = this.tabHost.newTabSpec("Tab2");
tabspec.setIndicator("Tab2");
this.tabManager.addTab(tabspec, TabFragment.class, args);

//set current tab is not exist
if (savedInstanceState != null){
this.tabHost.setCurrentTab(savedInstanceState.getInt("tab"));
}else{
this.tabHost.setCurrentTab(0);
}
}

@Override
protected void onSaveInstanceState(Bundle outState){
super.onSaveInstanceState(outState);
outState.putString("tab", this.tabHost.getCurrentTabTag());
}

/**
* helper class
* @author
*
*/
public static class TabManager implements OnTabChangeListener{

private FragmentActivity activity = null;
private TabHost tabhost = null;
private int containerId = 0;
private final HashMap<String, TabInfo> tabInfoMap = new HashMap<String, TabInfo>();
private TabInfo currentTab = null;

/**
* TabInfo including tab tag, tab class, tab arguments, tab fragment
* @author
*
*/
static final class TabInfo{
private final String tag;
private final Class<?> klass;
private final Bundle args;
private Fragment fragment = null;

TabInfo(String tag, Class<?> klass, Bundle args){
this.tag = tag;
this.klass = klass;
this.args = args;

}

}
/**
* A dummy tab by default, later it will replace by fragment
* @author
*
*/
static class DummyTabFactory implements TabContentFactory{
private Context context;

DummyTabFactory(Context context){
this.context = context;

}
public View createTabContent(String tag) {
View view = new View(this.context);
view.setMinimumHeight(0);
view.setMinimumWidth(0);
return view;
}

}

public TabManager(FragmentActivity activity, TabHost tabhost, int containerId){
this.activity = activity;
this.tabhost = tabhost;
this.containerId = containerId;
this.tabhost.setOnTabChangedListener(this);
}

public void addTab(TabSpec tabspec, Class<?> klass, Bundle args){
tabspec.setContent(new DummyTabFactory(this.activity));
String tag = tabspec.getTag();
TabInfo tabInfo = new TabInfo(tag, klass, args);

//check is the tab already exist. If so deactivate it bcoz the initiate state is not show.
tabInfo.fragment = this.activity.getSupportFragmentManager().findFragmentByTag(tag);
if (tabInfo.fragment != null && !tabInfo.fragment.isDetached()){
FragmentTransaction transaction = this.activity.getSupportFragmentManager().beginTransaction();
transaction.detach(tabInfo.fragment).commit();
}
this.tabInfoMap.put(tag, tabInfo);
this.tabhost.addTab(tabspec);
}

public void onTabChanged(String tag) {
TabInfo newTab = this.tabInfoMap.get(tag);
if (this.currentTab == newTab){
return;
}

FragmentTransaction transaction = this.activity.getSupportFragmentManager().beginTransaction();
//detach current tab
if (this.currentTab != null && this.currentTab.fragment != null ){
transaction.detach(this.currentTab.fragment);
}

if (newTab != null){
if (newTab.fragment == null){
newTab.fragment = Fragment.instantiate(this.activity, newTab.klass.getName(), newTab.args);
transaction.add(this.containerId, newTab.fragment, newTab.tag);
}
else{
transaction.attach(newTab.fragment);
}
}

this.currentTab = newTab;
transaction.commit();
this.activity.getSupportFragmentManager().executePendingTransactions();
}

}

/**
* The Tab Fragment
* @author
*
*/
public static class TabFragment extends Fragment{
private int layoutResource;

/**
* this method will be called when call Fragment.
* @param resource
* @return
*/
static TabFragment newInstance(int resource){
TabFragment fragment = new TabFragment();
Bundle args = new Bundle();
args.putInt("layoutResource", resource);
fragment.setArguments(args);
return fragment;
}

public void onCreate(Bundle savedInstanceState){
super.onCreate(savedInstanceState);

Bundle args = this.getArguments();
layoutResource = args.getInt("layoutResource");

}

public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState){
return inflater.inflate(layoutResource, container, false);
}
}

}

转载请注明:运维派 » Android中实现多Tab页应用

0
3.8k
1