现在安卓比较流行的布局就是类似新闻客户端和手机QQ那种的底端可选择，上面的个别页面可以滑动选择。
在测试过程中发现用安卓自带的TabHost去构建，很难得到自定义的效果。
因此采用TabHost+ViewPager+RadioGroup去构建这个效果
首先要弄清楚各自的用途和功能
（1）TabHost
由于安卓自带的TabHost貌似在有些手机版本上只能固定在底端的位置，所以我们用GadioGroup去显示界面按钮，由于构建HabHost必须定义host、tabs、content几个内容，这样我们隐藏tabs，用GadioGroup代替显示。代码如下：
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
<span style="color:#ff0000;"> android:id="@android:id/tabhost" </span>
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.android_mode.MainActivity" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<FrameLayout
<span style="color:#ff0000;">android:id="@android:id/tabcontent"</span>
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1" >
</FrameLayout>
<TabWidget
<span style="color:#ff0000;">android:id="@android:id/tabs"</span>
android:layout_width="fill_parent"
android:layout_height="wrap_content"
<span style="color:#000066;">android:visibility="gone"</span> >
</TabWidget>
<RadioGroup
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<RadioButton
android:id="@+id/b1"
android:layout_width="wrap_content"
android:layout_height="40dp"
android:layout_weight="1"
android:background="#00ABCD"
android:button="@null"
android:gravity="center"
android:text="首页" />
<View
android:layout_width="2px"
android:layout_height="fill_parent" />
<RadioButton
android:id="@+id/b2"
android:layout_width="wrap_content"
android:layout_height="40dp"
android:layout_weight="1"
android:background="#00ABCD"
android:button="@null"
android:gravity="center"
android:text="设置" />
</RadioGroup>
</LinearLayout>
</TabHost>
对于主文件，由于在安卓3.0版本以下不支持TabActivity，因此我们考虑到兼容性，选用ActivityGroup。
其具体方法如下所示：
public class MyTabOwnAct extends ActivityGroup {
RadioButton radioButton1;
RadioButton radioButton2;
TabHost tabHost;
@Override
protected void onCreate(Bundle savedInstanceState) {
// TODO Auto-generated method stub
super.onCreate(savedInstanceState);
setContentView(R.layout.tabmain);
tabHost = (TabHost) findViewById(android.R.id.tabhost);
tabHost.setup();
tabHost.setup(this.getLocalActivityManager()); //必须要又这个语句，如果继承TabActivity可不要
tabHost.addTab(tabHost.newTabSpec("l1")
.setContent(new Intent(this, Act1.class)).setIndicator("首页"));
tabHost.addTab(tabHost.newTabSpec("l2")
.setContent(new Intent(this, Act2.class)).setIndicator("设置"));
radioButton1 = (RadioButton) findViewById(R.id.b1);
radioButton2 = (RadioButton) findViewById(R.id.b2);
radioButton1.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View arg0) {
// TODO Auto-generated method stub
tabHost.setCurrentTabByTag("l1"); //显示与隐藏的标记
}
});
radioButton2.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View arg0) {
// TODO Auto-generated method stub
tabHost.setCurrentTabByTag("l2");
}
});
}
}
到目前为止我们把底部的效果实现，即可以通过下面的按钮，改变上面的界面。
接下来我们选择上面其中的一个界面，用ViewPager实现滑动的效果。
界面布局文件如下：
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:layout_width="wrap_content"
android:layout_height="40dp"
android:layout_weight="1"
android:background="#FF0fab"
android:gravity="center"
android:text="页面一" />
<View
android:layout_width="2dp"
android:layout_height="fill_parent" />
<TextView
android:layout_width="wrap_content"
android:layout_height="40dp"
android:layout_weight="1"
android:background="#da0ccb"
android:gravity="center"
android:text="页面二" />
<View
android:layout_width="2dp"
android:layout_height="fill_parent" />
<TextView
android:layout_width="wrap_content"
android:layout_height="40dp"
android:layout_weight="1"
android:background="#eeffff"
android:gravity="center"
android:text="页面三" />
</LinearLayout>
<android.support.v4.view.ViewPager
android:id="@+id/pager"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
</android.support.v4.view.ViewPager>
</LinearLayout>
</pre><span style="font-size:18px">我们要准备三个界面的布局，这里我分别命名为p1.xml，p2.xml，p3.xml，然后我们在主文件中通过得到ViewPager后关联到适配器，即可得到滑动的效果。</span><pre name="code" class="java"><span style="font-family: Arial, Helvetica, sans-serif;">public class Act1 extends Activity {</span>
ViewPager pager;
@Override
protected void onCreate(Bundle savedInstanceState) {
// TODO Auto-generated method stub
super.onCreate(savedInstanceState);
setContentView(R.layout.pager);
pager = (ViewPager) findViewById(R.id.pager);
pager.setAdapter(new MyPagerAdapter());
}
class MyPagerAdapter extends PagerAdapter {
List<View> list = new ArrayList<View>();
public MyPagerAdapter() {
// TODO Auto-generated constructor stub
View view1 = LayoutInflater.from(getApplicationContext()).inflate(
R.layout.p1, null);
View view2 = LayoutInflater.from(getApplicationContext()).inflate(
R.layout.p2, null);
View view3 = LayoutInflater.from(getApplicationContext()).inflate(
R.layout.p3, null);
list.add(view1);
list.add(view2);
list.add(view3);
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
// TODO Auto-generated method stub
((ViewPager) container).addView(list.get(position));
return list.get(position);
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
// TODO Auto-generated method stub
// super.destroyItem(container, position, object);
((ViewPager) container).removeView(list.get(position));///(position);// (list.get(position));
}
@Override
public int getCount() {
// TODO Auto-generated method stub
return list.size();
}
@Override
public boolean isViewFromObject(View arg0, Object arg1) {
// TODO Auto-generated method stub
return arg0 == arg1;
}
}
}
效果显示图：
时间： 2024-10-26 18:22:48