zoukankan      html  css  js  c++  java
  • android 实现自定义卫星菜单

    看了hyman老师的视频,听起来有点迷糊,所以就想把实现卫星菜单的实现总结一下。长话短说,下面总结一下:

    一、自定义ViewGroup
    1)、自定义属性文件

    属性的定义:

    <attr name="position">
    <enum name="left_top" value="0"/>
    <enum name="left_bottom" value="1"/>
    <enum name="right_top" value="2"/>
    <enum name="right_bottom" value="3"/>
    <enum name="center_bottom" value="4"/>
    </attr>
    <attr name="radius" format="dimension"/>

    这里需要注意的是:如何将属性文件和自定义的ViewGroup联系起来

    通过ArcMenu将其联系起来,而ArcMenu就是我们自定义的ViewGroup

    <declare-styleable name="ArcMenu">
    <attr name="position"/>
    <attr name="radius"/>
    </declare-styleable>


    2)、在布局文件中使用
    这里需要注意的是:注意命名空间的使用
    xmlns:hyman="http://schemas.android.com/apk/res/com.example.arcmenu"
    这里分为两个部分:
    第一个部分是:http://schemas.android.com/apk/res/


    第二个部分是:com.example.arcmenu(这个可以在AndroidManifest.xml中有自定义的ViewGroup的包名)


    3)、在自定义控件中读取

    创建自定义ViewGroup

    public class ArcMenu extends ViewGroup

    {

    }

    然后可以按照下边的步骤就行相关的操作,实现相应的方法

    自定义属性的读取方法:

    首先需要获取的自定义的属性

    TypedArray typedArray = context.getTheme().obtainStyledAttributes(attrs, R.styleable.ArcMenu, defStyle, 0);

    然后获取自定义属性的值

    int position = typedArray.getInt(R.styleable.ArcMenu_position, POSITION_RIGHT_BOTTOM);

    4)关于自定义控件的布局

    这里我主要着重讲一下主菜单在下面中间位置的布局:

    首先获得主菜单的长度宽度:

    int width = mCButton.getMeasuredWidth();
    int height = mCButton.getMeasuredHeight();

    要想主菜单放到屏幕的中间位置:

    则他的x坐标为l = getMeasuredWidth() / 2 - width / 2;

    y坐标为:t = getMeasuredHeight() - height;

    最后布局

    mCButton.layout(l, t, l + width, t + height);

    子菜单的布局位置

    t1 = (int) (mRadius * Math.sin(Math.PI / count * (i + 1)));
    l1= (int) (mRadius * Math.cos(Math.PI / count * (i + 1)));

    最终子菜单的坐标

    l = getMeasuredWidth() / 2 - width / 2 - l1;
    t = getMeasuredHeight() - height - t2;

    子菜单布局

    child.layout(l, t, l + width, t + height);


    4)、设置主按钮的旋转动画

    这里边的0.5f 表示的是相对与self的坐标位置

    RotateAnimation anim = new RotateAnimation(start, end, Animation.RELATIVE_TO_SELF, 0.5f,
    Animation.RELATIVE_TO_SELF, 0.5f);
    anim.setDuration(duration);
    anim.setFillAfter(true);
    view.startAnimation(anim);


    5)、为menuItem添加平移动画(这里需要注意的是:在设置主菜单关闭与打开状态的时候,注意其修改的位置)

    if (mCurrentStatus == Status.IS_CLOSED)
    {
    tranAnim = new TranslateAnimation(xflag * cl, 0, yflag * ct, 0);
    childView.setClickable(true);
    childView.setFocusable(true);
    }
    else
    {
    tranAnim = new TranslateAnimation(0, xflag * cl, 0, yflag * ct);
    childView.setClickable(false);
    childView.setFocusable(false);
    }

    tranAnim.setFillAfter(true);
    tranAnim.setDuration(duration);
    tranAnim.setStartOffset((i * 100) / count);
    tranAnim.setAnimationListener(new AnimationListener()
    {

    @Override
    public void onAnimationStart(Animation animation)
    {

    }

    @Override
    public void onAnimationRepeat(Animation animation)
    {

    }

    @Override
    public void onAnimationEnd(Animation animation)
    {
    if (mCurrentStatus == Status.IS_CLOSED)
    {
    childView.setVisibility(View.GONE);
    }

    }
    });
    RotateAnimation rotateAnim = new RotateAnimation(0, 720, Animation.RELATIVE_TO_SELF, 0.5f,
    Animation.RELATIVE_TO_SELF, 0.5f);
    rotateAnim.setDuration(duration);
    rotateAnim.setFillAfter(true);

    animset.addAnimation(rotateAnim);
    animset.addAnimation(tranAnim);
    childView.startAnimation(animset);

    这里需要注意的是:监听子菜单的动画监听事件,当动画结束的时候,需要修改其主菜单的状态。


    6)、实现menuItem的点击动画

    这里就是关于叠加动画的添加

    首先创建动画集

    AnimationSet animationSet = new AnimationSet(true);

    其次创建缩小,以及渐变动画

    ScaleAnimation scaleAnim = new ScaleAnimation(1.0f, 0.0f, 1.0f, 0.0f, Animation.RELATIVE_TO_SELF, 0.5f,
    Animation.RELATIVE_TO_SELF, 0.5f);
    AlphaAnimation alphaAnim = new AlphaAnimation(1f, 0.0f);

    最后将动画添加到动画集
    animationSet.addAnimation(scaleAnim);
    animationSet.addAnimation(alphaAnim);

    设置时长和状态
    animationSet.setDuration(duration);
    animationSet.setFillAfter(true);

    最终效果图如下:

    demo下载,请点击此处

    转载请注明来源于

    作者: persist
    出处: http://www.cnblogs.com/persist-confident/
    本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。

  • 相关阅读:
    VUE网页loading加载状态
    VUE使用canvas画板实现签字
    一个完整的项目管理流程
    APP原型的设计步骤是什么?
    如何对接网建SMS短信通短信验证码接口
    如何彻底红蜘蛛,非常方便!!!
    如何在cmd中连接数据库
    mvn deploy:deploy-file命令
    Java线程池的分析和使用
    jstat命令详解
  • 原文地址:https://www.cnblogs.com/persist-confident/p/4487386.html
Copyright © 2011-2022 走看看