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

 更新时间:2016年03月08日 09:29:13   作者:RustFisher  
这篇文章主要介绍了Android中使用TabHost 与 Fragment 制作页面切换效果的相关资料,需要的朋友可以参考下

三个标签页置于顶端

效果图:

在文件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 slower
public BoardTabHost(Context context) {
super(context);
}
public BoardTabHost(Context context, AttributeSet attr) {
super(context, attr);
}
@Override
public void setCurrentTab(int index) {
// we need two animation here: first one is fading animation, 2nd one is coming animation
// translateAnimation of fading fragment
if (index > currentTab) {// fly right to left and leave the screen
TranslateAnimation translateAnimation = new TranslateAnimation(
Animation.RELATIVE_TO_SELF/* fromXType */, 0f/* fromXValue */,
Animation.RELATIVE_TO_SELF/* toXType */, -1.0f/* toXValue */,
Animation.RELATIVE_TO_SELF, 0f,
Animation.RELATIVE_TO_SELF, 0f
);
translateAnimation.setDuration(duration);
getCurrentView().startAnimation(translateAnimation);
} else if (index < currentTab) {// fly left to right
TranslateAnimation translateAnimation = new TranslateAnimation(
Animation.RELATIVE_TO_SELF, 0f,
Animation.RELATIVE_TO_SELF, 1.0f,
Animation.RELATIVE_TO_SELF, 0f,
Animation.RELATIVE_TO_SELF, 0f
);
translateAnimation.setDuration(duration);
getCurrentView().startAnimation(translateAnimation);
}
super.setCurrentTab(index);// the current tab is index now
// translateAnimation of adding fragment
if (index > currentTab) {
TranslateAnimation translateAnimation = new TranslateAnimation(
Animation.RELATIVE_TO_PARENT, 1.0f,/* fly into screen */
Animation.RELATIVE_TO_PARENT, 0f, /* screen location */
Animation.RELATIVE_TO_PARENT, 0f,
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,
Animation.RELATIVE_TO_PARENT, 0f,
Animation.RELATIVE_TO_PARENT, 0f,
Animation.RELATIVE_TO_PARENT, 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.BoardTabHost
android: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">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TabWidget
android:id="@android:id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
<FrameLayout
android:id="@android:id/tabcontent"
android:layout_width="match_parent"
android:layout_height="match_parent">
<fragment
android:id="@+id/fragment_tab1"
android:name="com.rust.tabhostdemo.TabFragment1"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<fragment
android:id="@+id/fragment_tab2"
android:name="com.rust.tabhostdemo.TabFragment2"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<fragment
android: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;
@Override
protected 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 制作页面切换效果的相关内容,希望对大家有所帮助!

相关文章

  • FragmentTabHost使用方法详解

    FragmentTabHost使用方法详解

    这篇文章主要为大家详细介绍了Android中FragmentTabHost的使用方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-08-08
  • android 开发中使用okhttp上传文件到服务器

    android 开发中使用okhttp上传文件到服务器

    在开发android手机客户端,常常会需要上传文件到服务器,使用okhttp会是一个很好的选择,它使用很简单,而且运行效率也很高,下面小编给大家带来了android 开发中使用okhttp上传文件到服务器功能,一起看看吧
    2018-01-01
  • 浅析AndroidStudio3.0最新 Android Profiler分析器(cpu memory network 分析器)

    浅析AndroidStudio3.0最新 Android Profiler分析器(cpu memory network

    Android Profiler分为三大模块: cpu、内存 、网络。本文给大家介绍AndroidStudio3.0最新 Android Profiler分析器(cpu memory network 分析器)的相关知识,他们的基本使用方法,在文中都给大家提到,具体内容详情大家通过本文一起学习吧
    2017-12-12
  • Android中GridView插件的使用方法

    Android中GridView插件的使用方法

    今天小编就为大家分享一篇关于Android中GridView插件的使用方法,小编觉得内容挺不错的,现在分享给大家,具有很好的参考价值,需要的朋友一起跟随小编来看看吧
    2019-03-03
  • Android 利用广播监听usb连接状态(变化情况)

    Android 利用广播监听usb连接状态(变化情况)

    这篇文章主要介绍了Android 利用广播监听usb连接状态,需要的朋友可以参考下
    2017-06-06
  • Android Studio中主题样式的使用方法详解

    Android Studio中主题样式的使用方法详解

    这篇文章主要介绍了Android Studio中主题样式的使用方法,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2020-03-03
  • Gradle属性设置及环境变量全面教程

    Gradle属性设置及环境变量全面教程

    这篇文章主要为大家介绍了Gradle属性设置及环境变量的全面教程,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-06-06
  • Android自定义View实现地铁显示牌效果

    Android自定义View实现地铁显示牌效果

    这篇文章主要为大家详细介绍了Android自定义View实现地铁显示牌效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2019-11-11
  • 浅析Android中getWidth()和getMeasuredWidth()的区别

    浅析Android中getWidth()和getMeasuredWidth()的区别

    这篇文章主要介绍了浅析Android中getWidth()和getMeasuredWidth()的区别 ,getMeasuredWidth()获取的是view原始的大小,getWidth()获取的是这个view最终显示的大小,具体区别介绍大家参考下本文
    2018-04-04
  • SharedPreference引发ANR原理详解

    SharedPreference引发ANR原理详解

    这篇文章主要为大家介绍了SharedPreference引发ANR原理详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-02-02

最新评论