展会信息港展会大全

Android实现带动画效果的Tab Menu
来源:互联网   发布日期:2015-10-03 11:09:39   浏览:2272次  

导读:今天给大家介绍如何在Android下实现一个带动画效果的Tab Menu。Tab Menu的打开动画效果为自下而上的淡入推进效果,关闭效果为自上而下的淡出推出效果。实现的效果图如下(没有找到合适的屏幕录像工具,只能截静......

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

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

[图片] 程序运行效果

[代码] TabMenuActivity.java

package com.zhuozhuo;

import android.app.Activity;

import android.os.Bundle;

import android.view.KeyEvent;

import android.widget.TextView;

public class TabMenuActivity extends Activity {

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

TabView dockView;

TextView tv;

@Override

public void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.main);

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

dockView = new DockView(this);

}

public boolean onKeyDown(int keyCode, KeyEvent event) {

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

if(dockView.isOpen()) {

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

dockView.closeDock();//关闭dock

}

else {

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

dockView.openDock();//打开dock

}

return true;

}

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

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

dockView.closeDock();

return true;

}

}

return super.onKeyDown(keyCode, event);

}

}

[代码] TabView.java

package com.zhuozhuo;

import android.app.Activity;

import android.content.Context;

import android.view.View;

import android.view.View.OnClickListener;

import android.view.animation.Animation;

import android.view.animation.Animation.AnimationListener;

import android.view.animation.AnimationUtils;

import android.widget.Toast;

public class TabView {

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

private View tab1;

private View tab2;

private View tab3;

private View tab4;

private Activity context;

private boolean isOpen;

public TabView(Activity context) {

this.context = context;

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

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

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

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

setOnClickListener(tab1, 1);

setOnClickListener(tab2, 2);

setOnClickListener(tab3, 3);

setOnClickListener(tab4, 4);

}

public void openDock() {//打开dock

tab(tab1, 0, true);

tab(tab2, INTERVAL_TIME * 1, true);

tab(tab3, INTERVAL_TIME * 2, true);

tab(tab4, INTERVAL_TIME * 3, true);

isOpen = true;

}

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

view.setOnClickListener(new OnClickListener() {

@Override

public void onClick(View v) {

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

closeDock();

}

});

}

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

view.postDelayed(new Runnable() {

@Override

public void run() {

Animation animation;

if(toOpen) {

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

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

view.startAnimation(animation);

}

else {

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

animation.setAnimationListener(new AnimationListener() {

@Override

public void onAnimationStart(Animation animation) {

}

@Override

public void onAnimationRepeat(Animation animation) {

}

@Override

public void onAnimationEnd(Animation animation) {

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

}

});

view.startAnimation(animation);

}

}

}, delayTime);

}

public boolean isOpen() {

return isOpen;

}

public void closeDock() {//关闭dock

tab(tab1, 0, false);

tab(tab2, INTERVAL_TIME * 1, false);

tab(tab3, INTERVAL_TIME * 2, false);

tab(tab4, INTERVAL_TIME * 3, false);

isOpen = false;

}

}

赞助本站

人工智能实验室

相关热词: 动画效果 Tab Menu

AiLab云推荐
展开

热门栏目HotCates

Copyright © 2010-2024 AiLab Team. 人工智能实验室 版权所有    关于我们 | 联系我们 | 广告服务 | 公司动态 | 免责声明 | 隐私条款 | 工作机会 | 展会港