Android 带有弹出收缩动画的扇形菜单实例
更新时间：2017年06月27日 10:57:25 作者：大西瓜的小桃子
本篇文章主要介绍了Android 带有弹出收缩动画的扇形菜单实例，具有一定的参考价值，有兴趣的可以了解一下
最近试着做了个Android 带有弹出收缩动画的扇形菜单，留个笔记记录一下。
效果如下
public class MainActivity extends AppCompatActivity implements View.OnClickListener {
private ImageView imgPublish;
private TextView textView1;
private TextView textView2;
private boolean isMenuOpen = false;
private List<TextView> textViews = new ArrayList<>();
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
imgPublish = (ImageView) findViewById(R.id.img_publish);
textView1 = (TextView) findViewById(R.id.tv_1);
textView2 = (TextView) findViewById(R.id.tv_2);
textViews.add(textView1);
textViews.add(textView2);
imgPublish.setOnClickListener(this);
}
@Override
public void onClick(View v) {
switch (v.getId()) {
case R.id.img_publish:
if (!isMenuOpen) {
showOpenAnim(80);
imgPublish.setImageResource(R.mipmap.publish_select);
}else {
showCloseAnim(80);
imgPublish.setImageResource(R.mipmap.fabu);
}
break;
}
}
//打开扇形菜单的属性动画， dp为半径长度
private void showOpenAnim(int dp) {
textView1.setVisibility(View.VISIBLE);
textView2.setVisibility(View.VISIBLE);
//for循环来开始小图标的出现动画
for (int i = 0; i < textViews.size(); i++) {
AnimatorSet set = new AnimatorSet();
//标题1与x轴负方向角度为20°，标题2为100°，转换为弧度
double a = -Math.cos(20 * Math.PI / 180 * (i * 2 + 1));
double b = -Math.sin(20 * Math.PI / 180 * (i * 2 + 1));
double x = a * dip2px(dp);
double y = b * dip2px(dp);
set.playTogether(
ObjectAnimator.ofFloat(textViews.get(i), "translationX", (float) (x * 0.25), (float) x),
ObjectAnimator.ofFloat(textViews.get(i), "translationY", (float) (y * 0.25), (float) y)
, ObjectAnimator.ofFloat(textViews.get(i), "alpha", 0, 1).setDuration(2000)
);
set.setInterpolator(new BounceInterpolator());
set.setDuration(500).setStartDelay(100);
set.start();
set.addListener(new Animator.AnimatorListener() {
@Override
public void onAnimationStart(Animator animation) {
}
@Override
public void onAnimationEnd(Animator animation) {
//菜单状态置打开
isMenuOpen = true;
}
@Override
public void onAnimationCancel(Animator animation) {
}
@Override
public void onAnimationRepeat(Animator animation) {
}
});
}
//转动加号大图标本身45°
ObjectAnimator rotate = ObjectAnimator.ofFloat(imgPublish, "rotation", 0, 90).setDuration(300);
rotate.setInterpolator(new BounceInterpolator());
rotate.start();
}
//关闭扇形菜单的属性动画，参数与打开时相反
private void showCloseAnim(int dp) {
//for循环来开始小图标的出现动画
for (int i = 0; i < textViews.size(); i++) {
AnimatorSet set = new AnimatorSet();
double a = -Math.cos(20 * Math.PI / 180 * (i * 2 + 1));
double b = -Math.sin(20 * Math.PI / 180 * (i * 2 + 1));
double x = a * dip2px(dp);
double y = b * dip2px(dp);
set.playTogether(
ObjectAnimator.ofFloat(textViews.get(i), "translationX", (float) x, (float) (x * 0.25)),
ObjectAnimator.ofFloat(textViews.get(i), "translationY", (float) y, (float) (y * 0.25)),
ObjectAnimator.ofFloat(textViews.get(i), "alpha", 1, 0).setDuration(2000)
);
// set.setInterpolator(new AccelerateInterpolator());
set.setDuration(500);
set.start();
set.addListener(new Animator.AnimatorListener() {
@Override
public void onAnimationStart(Animator animation) {
}
@Override
public void onAnimationEnd(Animator animation) {
textView1.setVisibility(View.GONE);
textView2.setVisibility(View.GONE);
//菜单状态置关闭
isMenuOpen = false;
}
@Override
public void onAnimationCancel(Animator animation) {
}
@Override
public void onAnimationRepeat(Animator animation) {
}
});
}
//转动加号大图标本身45°
ObjectAnimator rotate = ObjectAnimator.ofFloat(imgPublish, "rotation", 0, 90).setDuration(300);
rotate.setInterpolator(new BounceInterpolator());
rotate.start();
}
private int dip2px(int value) {
float density = getResources()
.getDisplayMetrics().density;
return (int) (density * value + 0.5f);
}
}
布局文件
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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.example.lina.animationapplication.MainActivity">
<TextView
android:id="@+id/tv_1"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_gravity="bottom|end"
android:layout_marginBottom="40dp"
android:layout_marginRight="40dp"
android:gravity="center"
android:text="标题1"
android:textColor="#ffffff"
android:visibility="gone"
android:background="@drawable/circle_purple"
/>
<TextView
android:id="@+id/tv_2"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_gravity="bottom|end"
android:layout_marginBottom="40dp"
android:layout_marginRight="40dp"
android:gravity="center"
android:text="标题2"
android:textColor="#ffffff"
android:visibility="gone"
android:background="@drawable/circle_orange"/>
<ImageView
android:id="@+id/img_publish"
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_gravity="bottom|end"
android:layout_marginBottom="35dp"
android:layout_marginRight="35dp"
android:src="@mipmap/fabu"
/>
</FrameLayout>
circle_purple.xml
<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval"> <solid android:color="#5d2a89" /> </shape>
参考
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。
相关文章
这篇文章主要介绍了Android mvvm之LiveData原理案例详解,本篇文章通过简要的案例,讲解了该项技术的了解与使用,以下就是详细内容,需要的朋友可以参考下2021-09-09
该篇文章是说明在Android手机或平板电脑中如何实现截取当前屏幕的功能，并把截取的屏幕保存到SDCard中的某个目录文件夹下面。实现的代码如下：2013-08-08
这篇文章主要介绍了Android平台生成二维码并实现扫描 & 识别功能的相关资料,需要的朋友可以参考下2016-06-06
这篇文章主要介绍了Android开发中模仿qq列表信息滑动删除功能,非常不错，具有参考借鉴价值，需要的朋友可以参考下2017-01-01
这篇文章主要为大家详细介绍了Android控件WebView实现完整截图，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2018-05-05
浅析Flutter AbsorbPointer 与 IgnorePointer的区别
Flutter是Google一个新的用于构建跨平台的手机App的SDK。这篇文章主要介绍了Flutter AbsorbPointer 与 IgnorePointer的区别,本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下2020-04-04
Android webview手动校验https证书(by 星空武哥)
有些时候由于Android系统的bug或者其他的原因，导致我们的webview不能验证通过我们的https证书，最明显的例子就是华为手机mate7升级到Android7.0后，手机有些网站打不开了，而更新了webview的补丁后就没问题了2017-09-09
这篇文章主要为大家详细介绍了Android实现圆圈倒计时，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2022-08-08
这篇文章主要给大家介绍了关于如何使用Flutter开发一款电影APP的相关资料，文中通过示例代码介绍的非常详细，对大家学习或者使用Flutter具有一定的参考学习价值，需要的朋友们下面来一起学习学习吧2019-07-07
这篇文章介绍的是一个折线图控件，用来显示一系列的状态，并可以进行滑动。有需要的可以参考借鉴。2016-08-08
最新评论