系统默认的TabHost按钮在上面,其实大部分主流应用的都在下面,有的同学可能不知道怎么做,其实很简单。系统的TabWidget在FramLayout的上面,只要把它移到FramLayout的下面就可以了。系统的TabWidget外面是没有HorizontalScrollView的,当TabWidget比较多的时候可以套了一个HorizontalScrollView,这样可以滑动,HorizontalScrollView增加一个属性android:scrollbars=“none”这样就没有滚动条了。到这里可能有些同学又遇到布局的比例问题了,只要更改FramLayout为android:layoutHight=“match_parent”还有android:layout_weight=“1”应该就可以了
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<TabHost
android:id="@android:id/tabhost"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
android:id="@+id/linearLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<FrameLayout
android:id="@android:id/tabcontent"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1" >
</FrameLayout>
<HorizontalScrollView
android:id="@+id/horizontalScrollView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scrollbars="none" >
<TabWidget
android:id="@android:id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
</TabWidget>
</HorizontalScrollView>
</LinearLayout>
</TabHost>
</LinearLayout>
下面说一下代码怎么写,首先要继承TabActivity,然后getTabHost()的到TabHost。
import android.app.TabActivity;
import android.content.Intent;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.ImageView;
import android.widget.TabHost;
public class Ex140_tabHostActivity extends TabActivity {
/** Called when the activity is first created. */
TabHost mTabHost;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
mTabHost = getTabHost();
Intent intent1=new Intent(this,FirstActivity.class);
View view = LayoutInflater.from(this).inflate(R.layout.tabitem, null);
ImageView img = (ImageView) view.findViewById(R.id.imageView1);
img.setImageResource(R.drawable.friend_qzone);
mTabHost.addTab(mTabHost.newTabSpec("tab1").setContent(intent1).setIndicator(view));
//方法和上面代码效果一样
addTab("tab2",R.drawable.friend_kaixin,SecondActivity.class);
addTab("tab3",R.drawable.friend_renren,ThirdActivity.class);
addTab("tab4",R.drawable.friend_sina,FirstActivity.class);
addTab("tab5",R.drawable.friend_tencent,SecondActivity.class);
}
private void addTab(String string, int imgId,Class clazz) {
View view = LayoutInflater.from(this).inflate(R.layout.tabitem, null);
ImageView img = (ImageView) view.findViewById(R.id.imageView1);
img.setImageResource(imgId);
mTabHost.addTab(mTabHost.newTabSpec("tab2").setContent(new Intent(this,clazz)).setIndicator(view));
}
}
上面view的布局是一个图片,我在外面又套了一个RelativeLayout这样大家可以实现更复杂的样式,其实一般也用不到,一张图片足以在复杂的只要把它们做成图片就OK了。这里用了android:padding是因为图片背景设置了selecter,这样更容易看到选中时的状态。
<?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" >
<ImageView
android:id="@+id/imageView1"
android:layout_width="80dip"
android:layout_height="80dip"
android:padding="5dip"
android:layout_alignParentLeft="true"
android:background="@drawable/imgbg"
android:layout_alignParentTop="true"
android:src="@drawable/ic_launcher" />
</RelativeLayout>
TabWidget的选中状态是android:state_selected,selecter代码如下:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_selected="true"><color android:color="#ff3333cc"/></item>
<item ><color android:color="#ffffaacc"/></item>
</selector>
如有意见或建议请留言,欢迎批评指正。如下载源码请到http://zhizunbao.blog.51cto.com/4010021/750546下载附件