版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/wpwbb510582246/article/details/52965062
一、效果图
二、android开发中TabHost使用方法详解
1、定义一个布局文件，将一个RadioGroup放在TabWidget中，然后将TabWidget放在TabHost中，其中TabWidget是选项卡切换按钮，通过点击该组件可以切换选项卡，该组件与FrameLayout组件是TabHost组件中必备的两个组件
<?xml version="1.0" encoding="utf-8"?>
<com.weipeng.android.pocketlife.AnimationTabHostUtils xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@android:id/tabhost"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<TabHost
android:id="@+id/tabhost"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<FrameLayout
android:id="@android:id/tabcontent"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1.0" />
<LinearLayout
android:id="@+id/console_line_bottom"
android:layout_width="match_parent"
android:layout_height="70dp"
android:layout_alignParentBottom="true"
android:background="@color/transparent"
android:orientation="horizontal" >
<TabWidget
android:id="@android:id/tabs"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="0.0"
android:visibility="gone" />
<RadioGroup
android:id="@+id/main_tab_group"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:background="@drawable/head_bg"
android:gravity="bottom"
android:orientation="horizontal" >
<RadioButton
android:id="@+id/main_tab_traffic"
style="@style/main_tab_bottom"
android:layout_height="69dp"
android:drawableTop="@drawable/main_navigation_living"
android:text="@string/main_navigation_traffic"
android:textColor="#ffffff" />
<RadioButton
android:id="@+id/main_tab_property"
style="@style/main_tab_bottom"
android:layout_height="69dp"
android:drawableTop="@drawable/main_navigation_property"
android:text="@string/main_navigation_property"
android:textColor="#ffffff" />
<RadioButton
android:id="@+id/main_tab_living"
style="@style/main_tab_bottom"
android:checked="true"
android:layout_height="69dp"
android:drawableTop="@drawable/main_navigation_traffic"
android:text="@string/main_navigation_living"
android:textColor="#ffffff" />
<RadioButton
android:id="@+id/main_tab_wiki"
style="@style/main_tab_bottom"
android:layout_height="69dp"
android:drawableTop="@drawable/main_navigation_more"
android:text="@string/main_navigation_sociality"
android:textColor="#ffffff" />
<RadioButton
android:id="@+id/main_tab_more"
style="@style/main_tab_bottom"
android:layout_height="69dp"
android:drawableTop="@drawable/main_navigation_settings"
android:text="@string/main_navigation_settings"
android:textColor="#ffffff" />
</RadioGroup>
</LinearLayout>
</LinearLayout>
</TabHost>
</com.weipeng.android.pocketlife.AnimationTabHostUtils>AnimationTabHostUtils是为选项卡切换添加动画，其源代码为
import android.content.Context;
import android.util.AttributeSet;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.TabHost;
/** 继承 TabHost 组件，带有切入切出的滑动动画效果。 */
public class AnimationTabHostUtils extends TabHost {
private Animation slideLeftIn;
private Animation slideLeftOut;
private Animation slideRightIn;
private Animation slideRightOut;
/** 记录是否打开动画效果 */
private boolean isOpenAnimation;
/** 记录当前标签页的总数 */
private int mTabCount;
public AnimationTabHostUtils(Context context, AttributeSet attrs) {
super(context, attrs);
// slideLeftIn = AnimationUtils
// .loadAnimation(context, R.anim.push_left_in);
// slideLeftOut = AnimationUtils.loadAnimation(context,
// R.anim.push_left_out);
// slideRightIn = AnimationUtils.loadAnimation(context,
// R.anim.push_right_in);
// slideRightOut = AnimationUtils.loadAnimation(context,
// R.anim.push_right_out);
//
// isOpenAnimation = false;
}
/**
* 设置是否打开动画效果
*
* @param isOpenAnimation
* true：打开
*/
public void setOpenAnimation(boolean isOpenAnimation) {
this.isOpenAnimation = isOpenAnimation;
}
/**
* 设置标签滑动动画。<br>
* 动画顺序为“左进——>左出——>右进——>左出”
*
* @param animationResIDs
* 动画的资源文件ID
* @return true：四个动画文件;<br>
* false：非四个动画文件（无法匹配，采用默认动画）
*/
public boolean setTabAnimation(int[] animationResIDs) {
if (3 == animationResIDs.length) {
slideLeftIn = AnimationUtils.loadAnimation(getContext(),
animationResIDs[0]);
slideLeftOut = AnimationUtils.loadAnimation(getContext(),
animationResIDs[1]);
slideRightIn = AnimationUtils.loadAnimation(getContext(),
animationResIDs[2]);
slideRightOut = AnimationUtils.loadAnimation(getContext(),
animationResIDs[3]);
return true;
} else {
return false;
}
}
/**
* @return 返回当前标签页的总数
*/
public int getTabCount() {
return mTabCount;
}
@Override
public void addTab(TabSpec tabSpec) {
mTabCount++;
super.addTab(tabSpec);
}
@Override
public void setCurrentTab(int index) {
int mCurrentTabID = getCurrentTab();
if (null != getCurrentView()) {
// 第一次设置 Tab 时，该值为 null。
if (isOpenAnimation) {
if (mCurrentTabID == (mTabCount - 1) && index == 0) {
getCurrentView().startAnimation(slideLeftOut);
} else if (mCurrentTabID == 0 && index == (mTabCount - 1)) {
getCurrentView().startAnimation(slideRightOut);
} else if (index > mCurrentTabID) {
getCurrentView().startAnimation(slideLeftOut);
} else if (index < mCurrentTabID) {
getCurrentView().startAnimation(slideRightOut);
}
}
}
super.setCurrentTab(index);
if (isOpenAnimation) {
if (mCurrentTabID == (mTabCount - 1) && index == 0) {
getCurrentView().startAnimation(slideLeftIn);
} else if (mCurrentTabID == 0 && index == (mTabCount - 1)) {
getCurrentView().startAnimation(slideRightIn);
} else if (index > mCurrentTabID) {
getCurrentView().startAnimation(slideLeftIn);
} else if (index < mCurrentTabID) {
getCurrentView().startAnimation(slideRightIn);
}
}
}
}2、创建一个Activity并让它继承TabActivity，定义一个TabHost，然后通过newTabSpec(String tag)创建一个选项卡，其中tag为选项卡的唯一标识，然后通过setIndicator(String tabSpecName)设置选项卡按钮的名称，然后再通过setContent(Activity act or Layout ly)设置选项卡内容，其参数可以为一个Activity或者是一个Layout布局，然后通过tabHost.addTab(tabSpec)的方法添加选项卡
tabHost.addTab(tabHost.newTabSpec("traffic").setIndicator("traffic")
.setContent(new Intent(this, MainActivityTraffic.class)));3、通过将按钮的监听事件设置为tabHost.setCurrentTabByTag("traffic")的方法将布局中的按钮与tabHost中的选项卡相互绑定，从而实现点击tabHost中的选项卡显示相应的界面
main_tab_traffic=(RadioButton)findViewById(R.id.main_tab_traffic);
main_tab_traffic.setOnClickListener(new OnClickListener() {
public void onClick(View view) {
tabHost.setCurrentTabByTag("traffic");
}
});MainActivityTraffic.java
import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.GridView;
import com.weipeng.android.pocketlife.R;
import com.weipeng.android.pocketlife.adapter.MainActivityTrafficAdapter;
public class MainActivityTraffic extends Activity {
private GridView gridView;
private Intent intent;
private MainActivityTrafficAdapter mainActivityTrafficAdapter;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.mainactivity_traffic);
gridView=(GridView) findViewById(R.id.gridView_home);
mainActivityTrafficAdapter=new MainActivityTrafficAdapter(MainActivityTraffic.this);
gridView.setAdapter(mainActivityTrafficAdapter);
gridView.setOnItemClickListener(new OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> arg0, View arg1, int arg2,
long arg3) {
// 1.1 天气查询 WeatherInquiry
// 1.2 地铁查询 SubwayInquiry
// 1.3 火车票查询 TrainTicketsInquiry
// 1.4 公交查询 BusInquiry
// 1.5 酒店查询 HotelInquiry
// 1.6 旅游百事 TravellingInquiry
// 1.7 长途查询 CoachInquiry
// 1.8 航班查询 FlightInquiry
// 1.9 万年历 Calendar
switch (arg2) {
case 0:
intent=new Intent(MainActivityTraffic.this, com.weipeng.android.pocketlife.traffic.WeatherInquiry.MainActivity.class);
startActivity(intent);
break;
case 1:
intent=new Intent(MainActivityTraffic.this, com.weipeng.android.pocketlife.traffic.SubwayInquiry.MainActivity.class);
startActivity(intent);
break;
case 2:
intent=new Intent(MainActivityTraffic.this, com.weipeng.android.pocketlife.traffic.TrainTicketsInquiry.MainActivity.class);
startActivity(intent);
break;
case 3:
intent=new Intent(MainActivityTraffic.this, com.weipeng.android.pocketlife.traffic.BusInquiry.MainActivity.class);
startActivity(intent);
break;
case 4:
intent=new Intent(MainActivityTraffic.this, com.weipeng.android.pocketlife.traffic.HotelInquiry.MainActivity.class);
startActivity(intent);
break;
case 5:
intent=new Intent(MainActivityTraffic.this, com.weipeng.android.pocketlife.traffic.TravellingInquiry.MainActivity.class);
startActivity(intent);
break;
case 6:
intent=new Intent(MainActivityTraffic.this, com.weipeng.android.pocketlife.traffic.CoachInquiry.MainActivity.class);
startActivity(intent);
break;
case 7:
intent=new Intent(MainActivityTraffic.this, com.weipeng.android.pocketlife.traffic.FlightInquiry.MainActivity.class);
startActivity(intent);
break;
case 8:
intent=new Intent(MainActivityTraffic.this, com.weipeng.android.pocketlife.traffic.Calendar.MainActivity.class);
startActivity(intent);
break;
}
}
});
}
}MainActivityTrafficAdapter.java（为界面设置适配器，将相应的元素添加到界面中）
import android.content.Context;
<pre name="code" class="java"> import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.ImageView;
import android.widget.RelativeLayout;
import android.widget.TextView;
import com.weipeng.android.pocketlife.R;
public class MainActivityTrafficAdapter extends BaseAdapter {
private Context myContext;
private int[] gridViewIconId={R.drawable.weather,R.drawable.ditie,R.drawable.train,R.drawable.gongjiao,R.drawable.hotel,R.drawable.lvyoubst,R.drawable.changtu,R.drawable.plane,R.drawable.wnl};
private String[] gridViewText={"天气查询", "地铁查询", "火车票查询", "公交查询","酒店查询", "旅游百事", "长途查询", "航班查询","万年历"};
private View view;
private ImageView imageView;
private TextView textView;
private RelativeLayout relativeLayout;
public MainActivityTrafficAdapter(Context context) {
myContext=context;
}
@Override
public int getCount() {
return gridViewIconId.length;
}
@Override
public Object getItem(int position) {
return null;
}
@Override
public long getItemId(int position) {
return 0;
}
@Override
public View getView(int position, View convertView, ViewGroup parent) {
view=View.inflate(myContext, R.layout.gridview_item, null);
relativeLayout=(RelativeLayout) view.findViewById(R.id.relaGrid);
imageView=(ImageView) view.findViewById(R.id.image_weather);
textView=(TextView) view.findViewById(R.id.text_weather);
imageView.setImageResource(gridViewIconId[position]);
textView.setText(gridViewText[position]);
return view;
}
}mainactivity_traffic.xml
<?xml version="1.0" encoding="UTF-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="@drawable/pocketlife_background2">
<RelativeLayout
android:id="@+id/top_relative"
android:layout_width="fill_parent"
android:layout_height="45.0dip"
android:background="@color/transparent" >
<TextView
android:id="@+id/titleText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:singleLine="true"
android:text="掌上生活"
android:textColor="@android:color/white"
android:textSize="18dp" />
</RelativeLayout>
<GridView
android:id="@+id/gridView_home"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="50dp"
android:columnWidth="120dp"
android:gravity="center"
android:horizontalSpacing="10dp"
android:numColumns="3"
android:stretchMode="columnWidth"
android:verticalSpacing="10dp" >
</GridView>
</RelativeLayout>