Android中使用TabHost 与 Fragment 制作页面切换效果

概述三个标签页置于顶端效果图：在文件BoardTabHost.java中定义页面切换的效果；切换页面时，当前页面滑出，目标页面滑入。这是2个不同的动画设定动画时要区分对待

三个标签页置于顶端

效果图：

在文件BoardTabHost.java中定义页面切换的效果；切换页面时，当前页面滑出，目标页面滑入。这是2个不同的动画设定动画时要区分对待

import androID.content.Context;import androID.util.AttributeSet;import androID.vIEw.animation.Animation;import androID.vIEw.animation.TranslateAnimation;import androID.Widget.TabHost;public class BoardTabHost extends TabHost {private int currentTab = 0;int duration = 1000;// ms; the bigger the slowerpublic BoardTabHost(Context context) {super(context);}public BoardTabHost(Context context,AttributeSet attr) {super(context,attr);}@OverrIDepublic voID setCurrentTab(int index) {// we need two animation here: first one is fading animation,2nd one is coming animation// translateAnimation of fading fragmentif (index > currentTab) {// fly right to left and leave the screenTranslateAnimation translateAnimation = new TranslateAnimation(Animation.relative_TO_SELF/* fromXType */,0f/* fromXValue */,Animation.relative_TO_SELF/* toXType */,-1.0f/* toXValue */,Animation.relative_TO_SELF,0f,0f);translateAnimation.setDuration(duration);getCurrentVIEw().startAnimation(translateAnimation);} else if (index < currentTab) {// fly left to rightTranslateAnimation translateAnimation = new TranslateAnimation(Animation.relative_TO_SELF,1.0f,0f);translateAnimation.setDuration(duration);getCurrentVIEw().startAnimation(translateAnimation);}super.setCurrentTab(index);// the current tab is index Now// translateAnimation of adding fragmentif (index > currentTab) {TranslateAnimation translateAnimation = new TranslateAnimation(Animation.relative_TO_PARENT,/* fly into screen */Animation.relative_TO_PARENT,/* screen location */Animation.relative_TO_PARENT,Animation.relative_TO_PARENT,0f);translateAnimation.setDuration(duration);getCurrentVIEw().startAnimation(translateAnimation);} else if (index < currentTab) {TranslateAnimation translateAnimation = new TranslateAnimation(Animation.relative_TO_PARENT,-1.0f,0f);translateAnimation.setDuration(duration);getCurrentVIEw().startAnimation(translateAnimation);}currentTab = index;}}

对应的布局文件activity_board.xml

使用BoardTabHost，装载一个竖直的linearLayout；上面是TabWidget，装载标签；后面是fragment的FrameLayout
可以看到这里有3个fragment，待会在activity中也设置3个标签

<?xml version="1.0" enCoding="utf-8"?><com.rust.tabhostdemo.BoardTabHostandroID:ID="@androID:ID/tabhost"xmlns:androID="http://schemas.androID.com/apk/res/androID"xmlns:tools="http://schemas.androID.com/tools"androID:layout_wIDth="match_parent"androID:layout_height="match_parent"tools:context="com.rust.tabhostdemo.BoardActivity"><linearLayoutandroID:layout_wIDth="match_parent"androID:layout_height="match_parent"androID:orIEntation="vertical"><TabWidgetandroID:ID="@androID:ID/tabs"androID:layout_wIDth="match_parent"androID:layout_height="wrap_content"/><FrameLayoutandroID:ID="@androID:ID/tabcontent"androID:layout_wIDth="match_parent"androID:layout_height="match_parent"><fragmentandroID:ID="@+ID/fragment_tab1"androID:name="com.rust.tabhostdemo.TabFragment1"androID:layout_wIDth="match_parent"androID:layout_height="match_parent"/><fragmentandroID:ID="@+ID/fragment_tab2"androID:name="com.rust.tabhostdemo.TabFragment2"androID:layout_wIDth="match_parent"androID:layout_height="match_parent"/><fragmentandroID:ID="@+ID/fragment_tab3"androID:name="com.rust.tabhostdemo.TabFragment3"androID:layout_wIDth="match_parent"androID:layout_height="match_parent"/></FrameLayout></linearLayout></com.rust.tabhostdemo.BoardTabHost> 

值得一提的是，这里的ID要用androID指定的ID；
比如@androID:ID/tabhost，@androID:ID/tabcontent，@androID:ID/tabs；否则系统找不到对应控件而报错

BoardActivity.java中设置了3个标签页，并指定了标签对应的fragment

import androID.support.v4.app.FragmentActivity;import androID.os.Bundle;public class BoardActivity extends FragmentActivity {public static final String TAB1 = "tab1";public static final String TAB2 = "tab2";public static final String TAB3 = "tab3";public static BoardTabHost boardTabHost;@OverrIDeprotected voID onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentVIEw(R.layout.activity_board);boardTabHost = (BoardTabHost) findVIEwByID(androID.R.ID.tabhost);boardTabHost.setup();boardTabHost.addTab(boardTabHost.newTabSpec(TAB1).setIndicator(getString(R.string.tab1_name)).setContent(R.ID.fragment_tab1));boardTabHost.addTab(boardTabHost.newTabSpec(TAB2).setIndicator(getString(R.string.tab2_name)).setContent(R.ID.fragment_tab2));boardTabHost.addTab(boardTabHost.newTabSpec(TAB3).setIndicator(getString(R.string.tab3_name)).setContent(R.ID.fragment_tab3));boardTabHost.setCurrentTab(0);}}

主要文件目录：

── layout

├── activity_board.xml
├── fragment_tab1.xml
├── fragment_tab2.xml
└── fragment_tab3.xml

── tabhostdemo

├── BoardActivity.java
├── BoardTabHost.java
├── TabFragment1.java
├── TabFragment2.java
└── TabFragment3.java

以上所述是小编给大家介绍的AndroID中使用TabHost 与 Fragment 制作页面切换效果的相关内容，希望对大家有所帮助！

总结

以上是内存溢出为你收集整理的Android中使用TabHost 与 Fragment 制作页面切换效果全部内容，希望文章能够帮你解决Android中使用TabHost 与 Fragment 制作页面切换效果所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。