欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  移动技术

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

程序员文章站 2024-02-24 16:00:28
三个标签页置于顶端 效果图: 在文件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 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 制作页面切换效果的相关内容,希望对大家有所帮助!