▲ Android 自定义可收缩的菜单

▲ Android 自定义可收缩的菜单

先给各位大爷们看一下 我要实现的效果 =_=!
这里写图片描述

大家肯定会说这有什么难的?so easy 这不就是弄个渐变缩放动画 来显示固定好的 5个按钮嘛。

但是我这里要说的是通过计算来实现这个效果,很6的做法

实现原理
先根据圆的半径来定位每一张图片的位置

然后大家可以清晰的看出
X轴的移动距离 = radius sin(a)
Y轴的移动距离 = radius
cos(a) ————- radius 是半径,a是夹角的度数

这里写图片描述

实现过程
【1】先要确定这个a是多少度?
菜单的夹角和是90°,共有5个菜单项,相当于把90°分为4等份。一个夹角的度数大约是22° (90/4=22)
然后第一个菜单的夹角是0°,第二个菜单的夹角是22° 第三个菜单的夹角是(222)° ,第四个菜单的夹角是 (223)°,第五个菜单的夹角是(22*4)°

假设index表示当前位置的索引,从0开始,第一个索引就是0,第二个就是1… 所以当前菜单与Y轴之间的夹角就是(22*index)°

【2】如何计算对应的正弦值,余弦值?

这几个可以放心,因为Java中有个一Math类,该类有三个函数已经帮咱们处理好了

//对应弧度的正弦值
double sin (double d)

//对应弧度的余弦值
double cos (double d)

//对应弧度的正切值
double tan(double d)

**注意一点啊,这个三个函数输入的参数不是度数,而是度数对应的弧度值 **

啥叫弧度值? 如图↓ 画的太low =_=!
这里写图片描述

获取弧度有2中方法

第一种呢,Math类中Math.PI不仅代表圆周率π,也代表180°所对应的弧度值,所以Math.sin(Math.PI)就是180°的正弦值,/2就是90°的正玄值了。

第二种就是 根据度数来获取弧度值,Math中提供了一个函数

double toReadians(double angdeg)

代码实现

XML布局

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginBottom="10dp"
        android:layout_marginRight="10dp">

        <Button
            android:id="@+id/item1"
            android:layout_width="43dp"
            android:layout_height="43dp"
            android:layout_gravity="bottom|right"
            android:background="@mipmap/ice"
            android:visibility="gone" />
        <Button
            android:id="@+id/item2"
            android:layout_width="43dp"
            android:layout_height="43dp"
            android:layout_gravity="bottom|right"
            android:background="@mipmap/icb"
            android:visibility="gone" />

        <Button
            android:id="@+id/item3"
            android:layout_width="43dp"
            android:layout_height="43dp"
            android:layout_gravity="bottom|right"
            android:background="@mipmap/icc"
            android:visibility="gone" />

        <Button
            android:id="@+id/item4"
            android:layout_width="43dp"
            android:layout_height="43dp"
            android:layout_gravity="bottom|right"
            android:background="@mipmap/icd"
            android:visibility="gone" />

        <Button
            android:id="@+id/item5"
            android:layout_width="43dp"
            android:layout_height="43dp"
            android:layout_gravity="bottom|right"
            android:background="@mipmap/icf"
            android:visibility="gone" />


        <Button
            android:id="@+id/menu"
            android:layout_width="55dp"
            android:layout_height="55dp"
            android:layout_gravity="bottom|right"
            android:background="@mipmap/ica" />
    </FrameLayout>
</LinearLayout>

java代码 实现

  @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_animation_b);
        Button menu = findViewById(R.id.menu);
        item1 = findViewById(R.id.item1);
        item2 = findViewById(R.id.item2);
        item3 = findViewById(R.id.item3);
        item4 = findViewById(R.id.item4);
        item5 = findViewById(R.id.item5);
        menu.setOnClickListener(this);
        item1.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Toast.makeText(MainActivity.this,"第一个条目",Toast.LENGTH_LONG).show();
            }
        });
    }

    @Override
    public void onClick(View v) {
        switch (v.getId()) {
            case R.id.menu:
                if (!mIsMenuOpen) {
                    mIsMenuOpen = true;
                    oPenMenu();
                } else {
                    mIsMenuOpen = false;
                    closeMenu();
                }
                break;
        }
    }

    private void oPenMenu() {
        doAnimateOpen(item1, 0, 5, 300);
        doAnimateOpen(item2, 1, 5, 300);
        doAnimateOpen(item3, 2, 5, 300);
        doAnimateOpen(item4, 3, 5, 300);
        doAnimateOpen(item5, 4, 5, 300);
    }

    private void doAnimateOpen(View view, int index, int total, int radius) {
        if (view.getVisibility() != View.VISIBLE) {
            view.setVisibility(View.VISIBLE);
        }
        double degree = Math.toRadians(90) / (total - 1) * index;
        int translationX = -(int) (radius * Math.sin(degree));
        int translationY = -(int) (radius * Math.cos(degree));
        AnimatorSet set = new AnimatorSet();
        //包括平移 缩放 透明 动画
        set.playTogether(ObjectAnimator.ofFloat(view, "translationX", 0, translationX),
                ObjectAnimator.ofFloat(view, "translationY", 0, translationY),
                ObjectAnimator.ofFloat(view, "scaleX", 0f, 1f),
                ObjectAnimator.ofFloat(view, "scaleY", 0f, 1f),
                ObjectAnimator.ofFloat(view, "alpha", 0f, 1f));
        set.setDuration(800).start();
    }

    private void closeMenu() {
        doAnimateClose(item1,0,5,300);
        doAnimateClose(item2,1,5,300);
        doAnimateClose(item3,2,5,300);
        doAnimateClose(item4,3,5,300);
        doAnimateClose(item5,4,5,300);
    }

    private void doAnimateClose(View view, int index, int total, int radius) {
        if (view.getVisibility()!=View.VISIBLE){
            view.setVisibility(View.VISIBLE);
        }
        double degree = Math.PI * index / ((total - 1) * 2);
        int translationX = -(int)(radius*Math.sin(degree));
        int translationY = -(int)(radius*Math.cos(degree));
        AnimatorSet set = new AnimatorSet();
        //包括平移 缩放 透明 动画
        set.playTogether(ObjectAnimator.ofFloat(view, "translationX", translationX,0),
                ObjectAnimator.ofFloat(view, "translationY", translationY,0),
                ObjectAnimator.ofFloat(view, "scaleX", 1f, 0.1f),
                ObjectAnimator.ofFloat(view, "scaleY", 1f, 0.1f),
                ObjectAnimator.ofFloat(view, "alpha", 1f, 0f));
        set.setDuration(800).start();
    }

最后是源码地址 https://download.csdn.net/download/macaopark/10658331

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/2844.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)
blank

相关推荐

  • win10中使用sqlserver2008r2 SQL Server 配置管理器[通俗易懂]

    win10中使用sqlserver2008r2 SQL Server 配置管理器[通俗易懂]win10打开sqlserver2008r2的SQLServer配置管理器,直接运行次文件就可:“C:\Windows\SysWOW64\SQLServerManager10.msc”在win10中是安装sqlserver2008r2,有时候安装成功之后会发现sqlserver的1433端口访问不了,通过sql语句查看端口号,发现找不到1433端口号–查询端口号

  • IsBackground对线程的重要作用「建议收藏」

    IsBackground对线程的重要作用「建议收藏」IsBackground对线程的重要作用要点:1、当在主线程中创建了一个线程,那么该线程的IsBackground默认是设置为FALSE的。2、当主线程退出的时候,IsBackground=FALSE的线程还会继续执行下去,直到线程执行结束。3、只有IsBackground=TRUE的线程才会随着主线程的退出而退出。4、当初始化一个线程,把T

    2022年10月10日
  • 由于Redis后门漏洞导致服务器被注入挖矿脚本解决过程

    由于Redis后门漏洞导致服务器被注入挖矿脚本解决过程由于Redis后门漏洞导致服务器被注入挖矿脚本解决过程事件描述某一天的早晨,我还是像往常一样搭着公交车开启打工仔的一天,一早8.30就到办公室了,坐着玩手机等上班,就这这时突然我组长飞快的回来办公室,回来就说快看看阿里云后台服务,服务是不是挂掉了,我当时就纳闷了一大早的流量不大怎么就宕机了呢,不一会我组长收到了阿里云短信通知监测到恶意脚本,接下来就是脚本的查找前期处理首先是通过阿里云的控制台发现,查看到恶意的进程PID,通过ps-ef|greap5724的确看到了当前进程,前期处理我只

  • 启动hive出错,提示没有权限

    启动hive出错,提示没有权限

  • MySQL 5.7的原生JSON数据类型使用

    MySQL 5.7的原生JSON数据类型使用

  • JavaScript数组-冒泡排序

    JavaScript数组-冒泡排序数组的冒泡排序算法也算一道经典面试题了,这里也给大家分享一下JavaScript中关于数组的冒泡排序的写法和思路:先给大家上代码:<script>//冒泡排序:将数组中的数字按照从大到小或从小到大的顺序排序vararr=[2,4,5,1,3];for(vari=0;i<arr.length-1;i++){//外层循环管趟数,即数组的全部项数都排好一共需要比较多少次一趟排好一个,注意趟

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号