Android实现带动画效果的Tab Menu

今天给大家介绍如何在Android下实现一个带动画效果的Tab Menu。Tab Menu的打开动画效果为自下而上的淡入推进效果，关闭效果为自上而下的淡出推出效果。

实现的效果图如下(没有找到合适的屏幕录像工具，只能截静态图)：

程序运行效果

[文件] dockmenu.rar ~ 49KB 下载(372)

[代码] TabMenuActivity.java

view source print ?

`01`	`package` `com.zhuozhuo;`

02

`03`	`import` `android.app.Activity;`

`04`	`import` `android.os.Bundle;`

`05`	`import` `android.view.KeyEvent;`

`06`	`import` `android.widget.TextView;`

07

`08`	`public` `class` `TabMenuActivity` `extends` `Activity {`

`09`	`/** Called when the activity is first created. */`

10

`11`	`TabView dockView;`

`12`	`TextView tv;`

13

`14`	`@Override`

`15`	`public` `void` `onCreate(Bundle savedInstanceState) {`

`16`	`super.onCreate(savedInstanceState);`

`17`	`setContentView(R.layout.main);`

`18`	`tv = (TextView) findViewById(R.id.tv);`

`19`	`dockView =` `new` `DockView(this);`

20 }

21

`22`	`public` `boolean` `onKeyDown(int` `keyCode, KeyEvent event) {`

`23`	`if` `(keyCode == KeyEvent.KEYCODE_MENU) {//监听menu键`

`24`	`if(dockView.isOpen()) {`

`25`	`tv.setText("点击menu键打开dock");`

26

`27`	`dockView.closeDock();//关闭dock`

28 }

`29`	`else` `{`

`30`	`tv.setText("再次点击menu键或者back键关闭dock");`

`31`	`dockView.openDock();//打开dock`

32 }

`33`	`return` `true;`

34 }

`35`	`if` `(keyCode == KeyEvent.KEYCODE_BACK) {//监听back键`

`36`	`if(dockView.isOpen()) {//当dock打开时，按back键关闭dock`

`37`	`dockView.closeDock();`

`38`	`return` `true;`

39 }

40 }

`41`	`return` `super.onKeyDown(keyCode, event);`

42 }

43

44

45 }

[代码] TabView.java

view source print ?

001 package com.zhuozhuo;

002

003 import android.app.Activity;

004 import android.content.Context;

005 import android.view.View;

006 import android.view.View.OnClickListener;

007 import android.view.animation.Animation;

008 import android.view.animation.Animation.AnimationListener;

009 import android.view.animation.AnimationUtils;

010 import android.widget.Toast;

011

012 public class TabView {

013

014 private static final int INTERVAL_TIME = 50;// 每个tab之间的动画时间间隔ms

015

016 private View tab1;

017 private View tab2;

018 private View tab3;

019 private View tab4;

020

021 private Activity context;

022

023 private boolean isOpen;

024

025 public TabView(Activity context) {

026 this.context = context;

027 tab1 = context.findViewById(R.id.tab1);

028 tab2 = context.findViewById(R.id.tab2);

029 tab3 = context.findViewById(R.id.tab3);

030 tab4 = context.findViewById(R.id.tab4);

031 setOnClickListener(tab1, 1);

032 setOnClickListener(tab2, 2);

033 setOnClickListener(tab3, 3);

034 setOnClickListener(tab4, 4);

035 }

036

037 public void openDock() {//打开dock

038 tab(tab1, 0, true);

039 tab(tab2, INTERVAL_TIME * 1, true);

040 tab(tab3, INTERVAL_TIME * 2, true);

041 tab(tab4, INTERVAL_TIME * 3, true);

042 isOpen = true;

043 }

044

045 private void setOnClickListener(View view, final int pos) {

046 view.setOnClickListener(new OnClickListener() {

047

048 @Override

049 public void onClick(View v) {

050 Toast.makeText(context, "view" + pos + " click!", Toast.LENGTH_SHORT).show();//点击tab时显示toast

051 closeDock();

052 }

053 });

054 }

055

056 private void tab(final View view,int delayTime,final boolean toOpen) {

057 view.postDelayed(new Runnable() {

058

059 @Override

060 public void run() {

061 Animation animation;

062

063 if(toOpen) {

064 view.setVisibility(View.VISIBLE);//动画开始前,设置view可见

065 animation = AnimationUtils.loadAnimation(context, R.anim.show_tab);

066 view.startAnimation(animation);

067

068 }

069 else {

070 animation = AnimationUtils.loadAnimation(context, R.anim.close_tab);

071 animation.setAnimationListener(new AnimationListener() {

072

073 @Override

074 public void onAnimationStart(Animation animation) {

075

076 }

077

078 @Override

079 public void onAnimationRepeat(Animation animation) {

080

081 }

082

083 @Override

084 public void onAnimationEnd(Animation animation) {

085 view.setVisibility(View.INVISIBLE);//动画结束时,view不可见

086

087 }

088 });

089 view.startAnimation(animation);

090

091

092 }

093

094 }

095 }, delayTime);

096 }

097

098 public boolean isOpen() {

099 return isOpen;

100 }

101

102 public void closeDock() {//关闭dock

103 tab(tab1, 0, false);

104 tab(tab2, INTERVAL_TIME * 1, false);

105 tab(tab3, INTERVAL_TIME * 2, false);

106 tab(tab4, INTERVAL_TIME * 3, false);

107 isOpen = false;

108 }

109 }

[文件] dockmenu.rar ~ 49KB 下载(372)

[代码] TabMenuActivity.java

[代码] TabView.java

更多相关文章

随机推荐