功能实现比较简单,弹出的菜单具有可点击性,故使用android3.0之后推出的属性动画来实现。(传统补间动画没有改变View的属性,只是改变视觉效果。而属性动画则直接改变view的属性值,不仅仅是视觉效果,实现了和用户的交互性功能)
效果图:
QQ20190403-094605-HD.gif下边直接是代码:
布局文件.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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=".PostActivity">
<ImageView
android:id="@+id/iv_men1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@mipmap/ic_launcher"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:onClick="menu1Click"
android:layout_marginBottom="50dp"
tools:ignore="OnClick" />
<ImageView
android:id="@+id/iv_men2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@mipmap/ic_launcher"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:onClick="menu2Click"
android:layout_marginBottom="50dp"
tools:ignore="OnClick" />
<ImageView
android:id="@+id/iv_add"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@mipmap/ic_launcher"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="50dp"
android:onClick="startAnim"/>
</RelativeLayout>
java代码
public class PostActivity extends AppCompatActivity {
private ImageView iv_menu1;
private ImageView iv_menu2;
private ImageView iv_add;
//启始坐标 x,y
private float startX;
private float startY;
private boolean flag = true;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_post);
iv_add = findViewById(R.id.iv_add);
iv_menu1 = findViewById(R.id.iv_men1);
iv_menu2 = findViewById(R.id.iv_men2);
}
public void startAnim(View view) {
startX = iv_add.getTranslationX();
startY = iv_add.getTranslationY();
//x轴偏移量
float endX_menu1 = getScreenWidth() / 4;
//Y轴坐标 向上偏移量300px 可自己根据dp转换成px
float endY_menu1 = startY - 300;
Log.d("Tag", "startX=" + startX + " startY =" + startY);
Log.d("Tag", "endX_menu1=" + endX_menu1 + " endY_menu1=" + endY_menu1);
if (flag) {
//点击按钮的旋转动画
ObjectAnimator rotation = ObjectAnimator.ofFloat(view, "rotation", 0, 270);
rotation.setDuration(500);
rotation.start();
//分别设置x轴Y轴的偏移量
ObjectAnimator menu1_animatorX = ObjectAnimator.ofFloat(iv_menu1, "translationX", startX, endX_menu1);
ObjectAnimator menu1_animatorY = ObjectAnimator.ofFloat(iv_menu1, "translationY", startY, endY_menu1);
//缩放动画
ObjectAnimator menu1_animator_scaleX = ObjectAnimator.ofFloat(iv_menu1, "scaleX", 0f, 1f);
ObjectAnimator menu1_animator_scaleY = ObjectAnimator.ofFloat(iv_menu1, "scaleY", 0f, 1f);
AnimatorSet menu1Set = new AnimatorSet();
menu1Set.setDuration(500);
//OvershootInterpolator插值器实现动画抖动效果
menu1Set.setInterpolator(new OvershootInterpolator());
menu1Set.playTogether(menu1_animatorX, menu1_animatorY, menu1_animator_scaleX, menu1_animator_scaleY);
menu1Set.start();
ObjectAnimator menu2_animatorX = ObjectAnimator.ofFloat(iv_menu2, "translationX", startX, -endX_menu1);
ObjectAnimator menu2_animatorY = ObjectAnimator.ofFloat(iv_menu2, "translationY", startY, endY_menu1);
ObjectAnimator menu2_animator_scaleX = ObjectAnimator.ofFloat(iv_menu2, "scaleX", 0f, 1f);
ObjectAnimator menu2_animator_scaleY = ObjectAnimator.ofFloat(iv_menu2, "scaleY", 0f, 1f);
AnimatorSet menu2Set = new AnimatorSet();
menu2Set.setDuration(500);
menu2Set.setInterpolator(new OvershootInterpolator());
menu2Set.playTogether(menu2_animatorX, menu2_animatorY, menu2_animator_scaleX, menu2_animator_scaleY);
menu2Set.start();
} else {
ObjectAnimator rotation = ObjectAnimator.ofFloat(view, "rotation", 270, 0);
rotation.setDuration(500);
rotation.start();
ObjectAnimator menu1_animatorX = ObjectAnimator.ofFloat(iv_menu1, "translationX", endX_menu1, startX);
ObjectAnimator menu1_animatorY = ObjectAnimator.ofFloat(iv_menu1, "translationY", endY_menu1, startY);
ObjectAnimator menu1_animator_scaleX = ObjectAnimator.ofFloat(iv_menu1, "scaleX", 1f, 0f);
ObjectAnimator menu1_animator_scaleY = ObjectAnimator.ofFloat(iv_menu1, "scaleY", 1f, 0f);
AnimatorSet menu1Set = new AnimatorSet();
menu1Set.setDuration(500);
menu1Set.playTogether(menu1_animatorX, menu1_animatorY, menu1_animator_scaleX, menu1_animator_scaleY);
menu1Set.start();
ObjectAnimator menu2_animatorX = ObjectAnimator.ofFloat(iv_menu2, "translationX", -endX_menu1, startX);
ObjectAnimator menu2_animatorY = ObjectAnimator.ofFloat(iv_menu2, "translationY", endY_menu1, startY);
ObjectAnimator menu2_animator_scaleX = ObjectAnimator.ofFloat(iv_menu2, "scaleX", 1f, 0f);
ObjectAnimator menu2_animator_scaleY = ObjectAnimator.ofFloat(iv_menu2, "scaleY", 1f, 0f);
AnimatorSet menu2Set = new AnimatorSet();
menu2Set.setDuration(500);
menu2Set.playTogether(menu2_animatorX, menu2_animatorY, menu2_animator_scaleX, menu2_animator_scaleY);
menu2Set.start();
}
flag = !flag;
}
public void menu1Click(View v) {
Toast.makeText(getApplicationContext(), "menu1 click", Toast.LENGTH_SHORT).show();
}
public void menu2Click(View v) {
Toast.makeText(getApplicationContext(), "menu2 click", Toast.LENGTH_SHORT).show();
}
private int getScreenWidth() {
WindowManager wm = (WindowManager) this.getSystemService(Context.WINDOW_SERVICE);
DisplayMetrics dm = new DisplayMetrics();
wm.getDefaultDisplay().getMetrics(dm);
int width = dm.widthPixels; // 屏幕宽度(像素)
return width;
}
private int getScreenHeight() {
WindowManager wm = (WindowManager) this.getSystemService(Context.WINDOW_SERVICE);
DisplayMetrics dm = new DisplayMetrics();
wm.getDefaultDisplay().getMetrics(dm);
int height = dm.heightPixels;
return height;
}
}
网友评论