三个标签页置于顶端
效果图:
在文件boardtabhost.java中定义页面切换的效果;切换页面时,当前页面滑出,目标页面滑入。这是2个不同的动画设定动画时要区分对待
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
|
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个标签
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
|
<?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
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
|
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 制作页面切换效果的相关内容,希望对大家有所帮助!