Android编程实现仿易信精美弹出框效果【附demo源码下载】

本文实例讲述了Android编程实现仿易信精美弹出框效果。分享给大家供大家参考，具体如下：

截图：

动画效果介绍：

1.点击ActionBar上“+”按钮，菜单从上方弹出（带反弹效果）；
2.再次点击“+”、点击空白区域或者点击返回键，菜单向上方收起；
3.点击弹出框上的按钮时，该按钮放大，其它按钮缩小，菜单整体渐变退出。

主体代码：

1.Activity.

/**
* 仿易信动画弹出框
*/
public class MainActivity extends ActionBarActivity {
//用于标记页面顶端位置
private View topView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
topView = findViewById(R.id.main_top);
}
private PopupWindow popupWindow;
private int line1DeltaY, line2DeltaY;
//仿易信更多弹出框
private void showPopup() {
if (popupWindow == null) {
View contentView = LayoutInflater.from(this).inflate(R.layout.yixin_pop_layout, null);
//点击空白区域关闭
View blankView = contentView.findViewById(R.id.yixin_more_blank);
View blankView2 = contentView.findViewById(R.id.yixin_more_blank2);
initItems(contentView);
//测量高度
int line2Height = ViewUtils.getViewMeasuredHeight(itemViews[0]);
line1DeltaY = -getActionBarHeight() - 40;
line2DeltaY = line1DeltaY - line2Height;
blankView.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
dismissPopup();
}
});
blankView2.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
dismissPopup();
}
});
popupWindow = new PopupWindow(contentView, ScreenUtils.getScreenW(this), ScreenUtils.getScreenH(this));
//随便设置一个drawable作为背景
popupWindow.setBackgroundDrawable(new ColorDrawable());
}
if (!popupWindow.isShowing()) {
popupWindow.showAsDropDown(topView, 0, 0);
for (int i = 0; i < itemViews.length; i++) {
if (i < 3) {
//第一行
itemViews[i].startAnimation(AnimationHelper.createPopupAnimIn(this, line1DeltaY));
} else {
//第二行
itemViews[i].startAnimation(AnimationHelper.createPopupAnimIn(this, line2DeltaY));
}
}
popupWindow.getContentView().startAnimation(AnimationHelper.createPopupBgFadeInAnim());
}
}
private void dismissPopup() {
if (popupWindow == null || !popupWindow.isShowing()) {
return;
}
ViewGroup contentView = (ViewGroup) popupWindow.getContentView();
contentView.startAnimation(AnimationHelper.createPopupBgFadeOutAnim(AnimationHelper.TIME_OUT));
for (int i = 0; i < itemViews.length; i++) {
if (i < 3) {
//第一行
itemViews[i].startAnimation(AnimationHelper.createPopupAnimOut(this, line1DeltaY));
} else {
//第二行
itemViews[i].startAnimation(AnimationHelper.createPopupAnimOut(this, line2DeltaY));
}
}
//动画结束时隐藏popupWindow
contentView.postDelayed(new Runnable() {
@Override
public void run() {
popupWindow.dismiss();
}
}, AnimationHelper.TIME_OUT + 10);
}
private View[] itemViews;
//初始化popupWindow上的按钮
private void initItems(View parent) {
int[] viewIds = new int[]{R.id.yixin_more_item1, R.id.yixin_more_item2, R.id.yixin_more_item3,
R.id.yixin_more_item4, R.id.yixin_more_item5, R.id.yixin_more_item6};
itemViews = new View[viewIds.length];
int itemWidth = ScreenUtils.getScreenW(this) / 3;
OnClickImpl l = new OnClickImpl();
for (int i = 0; i < viewIds.length; i++) {
int id = viewIds[i];
itemViews[i] = parent.findViewById(id);
GridLayout.LayoutParams p = (GridLayout.LayoutParams) itemViews[i].getLayoutParams();
p.width = itemWidth;
itemViews[i].setLayoutParams(p);
itemViews[i].setOnClickListener(l);
}
}
private class OnClickImpl implements View.OnClickListener {
@Override
public void onClick(View v) {
final int viewId = v.getId();
//背景动画
popupWindow.getContentView().startAnimation(AnimationHelper.createPopupBgFadeOutAnim(AnimationHelper.TIME_OUT_CLICK));
//动画结束时隐藏popupWindow
v.postDelayed(new Runnable() {
@Override
public void run() {
popupWindow.dismiss();
//动画结束时响应点击事件
handleEvent(viewId);
}
}, AnimationHelper.TIME_OUT_CLICK + 10);
//按钮动画
for (View item : itemViews) {
if (item.getId() == v.getId()) {
//点击的按钮，放大
item.startAnimation(AnimationHelper.createPopupItemBiggerAnim(MainActivity.this));
} else {
//其它按钮，缩小
item.startAnimation(AnimationHelper.createPopupItemSmallerAnim(MainActivity.this));
}
}
}
}
//popupWindow上按钮的点击事件
private void handleEvent(int viewId) {
Toast.makeText(this, "点击了按钮：" + viewId, Toast.LENGTH_SHORT).show();
}
private int getActionBarHeight() {
return getSupportActionBar().getHeight();
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.menu_main, menu);
return true;
}
@Override
public boolean onOptionsItemSelected(MenuItem item) {
int id = item.getItemId();
if (id == R.id.action_more) {
if (popupWindow == null || !popupWindow.isShowing()) {
showPopup();
} else {
dismissPopup();
}
return true;
}
return super.onOptionsItemSelected(item);
}
//点击返回键时，如果popupWindow是显示状态，则关闭它
@Override
public void onBackPressed() {
if (popupWindow != null && popupWindow.isShowing()) {
dismissPopup();
return;
}
super.onBackPressed();
}
}

2.动画工具类。

/**
* AnimationHelper
*/
public class AnimationHelper {
/**
* 进入动画的时间
*/
public static final int TIME_IN = 300;
/**
* 进入动画之后的反弹动画时间
*/
public static final int TIME_IN_BACK = 100;
/**
* 退出动画的时间
*/
public static final int TIME_OUT = 300;
/**
* 点击PopupWindow上菜单后退出动画的时间
*/
public static final int TIME_OUT_CLICK = 500;
/**
* PopupWindow上菜单进入动画
*/
public static Animation createPopupAnimIn(Context context, int fromYDelta) {
AnimationSet animationSet = new AnimationSet(context, null);
//    animationSet.setInterpolator(new BounceInterpolator()); //结束时弹跳
animationSet.setFillAfter(true);
//移动
TranslateAnimation translateAnim = new TranslateAnimation(0, 0, fromYDelta, 20);
translateAnim.setDuration(TIME_IN);
animationSet.addAnimation(translateAnim);
//回弹效果
TranslateAnimation translateAnim2 = new TranslateAnimation(0, 0, 0, -20);
translateAnim2.setStartOffset(TIME_IN);
translateAnim2.setDuration(TIME_IN_BACK);
animationSet.addAnimation(translateAnim2);
return animationSet;
}
/**
* PopupWindow上菜单离开动画
*/
public static Animation createPopupAnimOut(Context context, int toYDelta) {
AnimationSet animationSet = new AnimationSet(context, null);
animationSet.setFillAfter(true);
TranslateAnimation translateAnim = new TranslateAnimation(0, 0, 0, toYDelta);
translateAnim.setDuration(TIME_OUT);
animationSet.addAnimation(translateAnim);
return animationSet;
}
/**
* PopupWindow背景进入动画（透明度渐变）
*/
public static Animation createPopupBgFadeInAnim() {
AlphaAnimation anim = new AlphaAnimation(0, 1.0f);
anim.setDuration(TIME_IN);
anim.setFillAfter(true);
return anim;
}
/**
* PopupWindow背景离开动画（透明度渐变）
*/
public static Animation createPopupBgFadeOutAnim(int duration) {
AlphaAnimation anim = new AlphaAnimation(1.0f, 0);
anim.setDuration(duration);
anim.setFillAfter(true);
return anim;
}
/**
* PopupWindow按钮点击动画
*/
public static Animation createPopupItemBiggerAnim(Context context) {
AnimationSet animationSet = new AnimationSet(context, null);
animationSet.setFillAfter(true);
//放大(设置缩放的中心点为自己的中心)
ScaleAnimation scaleAnim = new ScaleAnimation(1.0f, 2.0f, 1.0f, 2.0f,
Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
scaleAnim.setDuration(TIME_OUT_CLICK);
animationSet.addAnimation(scaleAnim);
//渐变
AlphaAnimation alphaAnim = new AlphaAnimation(1.0f, 0);
alphaAnim.setInterpolator(new AccelerateInterpolator());
alphaAnim.setDuration(TIME_OUT_CLICK);
animationSet.addAnimation(alphaAnim);
return animationSet;
}
/**
* PopupWindow按钮点击时其它按钮的动画
*/
public static Animation createPopupItemSmallerAnim(Context context) {
//放大(设置缩放的中心点为自己的中心)
ScaleAnimation scaleAnim = new ScaleAnimation(1.0f, 0, 1.0f, 0,
Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
scaleAnim.setDuration(TIME_OUT_CLICK);
scaleAnim.setFillAfter(true);
return scaleAnim;
}
}

完整实例代码点击此处本站下载。

更多关于Android相关内容感兴趣的读者可查看本站专题：《Android开发动画技巧汇总》、《Android编程之activity操作技巧总结》、《Android视图View技巧总结》、《Android布局layout技巧总结》、《Android开发入门与进阶教程》、《Android资源操作技巧汇总》及《Android控件用法总结》

希望本文所述对大家Android程序设计有所帮助。

您可能感兴趣的文章:

• Android编程实现仿QQ发表说说，上传照片及弹出框效果【附demo源码下载】
• Android仿微信进度弹出框的实现方法
• 微信浏览器弹出框滑动时页面跟着滑动的实现代码（兼容Android和IOS端）
• Android 仿微信朋友圈点赞和评论弹出框功能
• Android 多种简单的弹出框样式设置代码
• 高仿IOS的Android弹出框
• Android中自定义PopupWindow实现弹出框并带有动画效果
• Android使用Dialog风格弹出框的Activity
• Android 自定义弹出框实现代码
• Android AndBase框架内部封装实现进度框、Toast框、弹出框、确认框（二）
• Android实现可输入数据的弹出框