JS版本：大柒悬浮按钮(FloatyRoundButton)使用文档

前言

该模块为付费模块

作者使用AJ版本是 Auto.Js Pro 7.0.4-1
如果在使用中发现一些问题,请联系我 QQ：531310591
也可加入我们的QQ交流群讨论 903405346

导入模块：require(path)

path：模块路径
在使用悬浮按钮之前需要在脚本头部使用require(path)导入悬浮按钮模块到脚本内。
例如模块路径在脚本同级目录下,使用var FloatyRoundButton = require('./FloatyRoundButton.js')即可完成模块导入。

var FloatyRoundButton = require('./FloatyRoundButton.js');

绑定构造函数：new FloatyRoundButton(obj)

obj：悬浮按钮参数同等于下面所有设置参数,详细内容在文档末尾处查看

var frb = new FloatyRoundButton();

设置按钮大小：frb.setButtonSize(number)

number：单位{dp} 默认参数[40dp]
下面代码设置了按钮大小为42dp,如果不设置此参数,则系统使用默认参数40dp

 frb.setButtonSize(42);

设置主按钮图标大小：frb.setLogoSrcSize(number)

number：单位{dp} 默认参数[24dp]
下面代码设置了主按钮图标大小为28dp,如果不设置此参数,则系统使用默认参数24dp

frb.setLogoSrcSize(28);

设置子菜单按钮图标大小：frb.setMenuSrcSize(number)

number：单位{dp} 默认参数[24dp]
下面代码设置了子菜单按钮图标大小为28dp,如果不设置此参数,则系统使用默认参数24dp

frb.setMenuSrcSize(28);

设置子菜单展开半径：frb.setMenuRadius(number)

number：单位{dp} 默认参数[80dp]

frb.setMenuRadius(100);

设置主按钮透明度：frb.setLogoAlpha(number)

number：参数范围0~1 默认参数[0.5]

frb.setLogoAlpha(0.4);

设置主按钮位置(初始化参数)：frb.setPosition(number)

number：参数范围0~1 默认参数[0.5]
参数越小主按钮越靠近屏幕顶部

frb.setPosition(0.4);

设置按钮停靠时X偏移值：frb.setDeviationX(number)

number：单位{dp} 默认参数：[主按钮大小 - 主按钮图标大小 / 2]
下方代码设置了参数为10dp,按钮在停靠时自动往屏幕外部隐藏10dp距离
如果参数设为0dp,按钮在停靠时则不隐藏

frb.setDeviationX(10);

设置子菜单展开动画时间：frb.setAnimationTime(time)

time：单位{ms} 默认参数[300ms]

frb.setAnimationTime(200);

设置子菜单停靠动画时间：frb.setDockingAnimationTime(time)

time：单位{ms} 默认参数[300ms]

frb.setDockingAnimationTime(400);

设置子菜单展开后自动关闭时间：frb.setTimeout(time)

time 单位{ms} 默认参数[0ms]
假如参数为5000ms,在子菜单展开后5000ms时间内用户没有任何操作.子菜单自动关闭
默认参数0ms为不关闭

frb.setTimeout(5000);

设置子菜单是否点击关闭：frb.setMenuClickClose(boolean)

boolean 单位{布尔值} 默认参数[false]
- boolean = true：用户点击子菜单按钮后子菜单自动关闭
- boolean = false：不关闭

frb.setMenuClickClose(true);

悬浮按钮参数

设置主按钮参数：frb.setLogoView( { bg , src } )

bg：主按钮背景颜色
src：主按钮图标
下方代码设置参数为 AutoJs Pro 官方logo

frb.setLogoView({bg:"#b0ffffff", src:"https://pro.autojs.org/images/logo.png"});

设置主按钮参数：frb.setMenuView( [ {name,bg,tint,src} , ... , {name,bg,tint,src} ] )

name：按钮名称(name会在onClick事件中调用,勿重复命名)
bg ：按钮背景颜色
tint：按钮图标着色(不设置此参数,则不为图标着色)
src：按钮图标

frb.setMenuView([//添加子菜单按钮视图
    { name: "按钮1", bg: "#40a5f3", tint: "#ffffff", src: "@drawable/ic_clear_black_48dp" },
    { name: "按钮2", bg: "#ee534f", tint: "#ffffff", src: "@drawable/ic_clear_black_48dp" },
    { name: "按钮3", bg: "#bfc1c0", tint: "#ffffff", src: "@drawable/ic_clear_black_48dp" },
    { name: "按钮4", bg: "#fbd834", tint: "#ffffff", src: "@drawable/ic_clear_black_48dp" },
    { name: "按钮5", bg: "#32b16c", tint: "#ffffff", src: "@drawable/ic_clear_black_48dp" },
]);

子菜单按钮点击事件

//第一种写法
frb.onClick((name,view) => {
  toastLog("点击: " + name );
});

//第二种写法
frb.on("click",(name,view)=>{
  toastLog("点击: " + name );
})

初始化参数详解 new FloatyRoundButton(obj)

参数:Obj = {parameter, logo, menu}

parameter：类型{obj}
- buttonSize：按钮大小默认参数[40dp]
- logoSrcSize：主按钮图标大小默认参数[24dp]
- menuSrcSize：子菜单按钮图标大小默认参数[24dp]
- animationTime：子菜单展开动画时间默认参数[300ms]
- dockingAnimationTime：主按钮停靠动画时间默认参数[300ms]
- menuRadius：子菜单展开半径, 默认参数[80dp]
- logoAlpha：主按钮透明度默认参数[0.5]
- position：主按钮初始化位置 0~1 越小越靠近顶部默认参数[0.5]
- timeout：子菜单自动关闭时间单位{ms} 0为不关闭默认参数[0]
- menuClickClose：点击子菜单按钮后菜单关闭 true:关闭 false:不关闭默认参数[false]
logo：主按钮参数类型{obj}
- bg：按钮背景颜色默认参数[#999999]
- src：按钮图标
menu：子菜单按钮参数类型 [array] menu:[ {name,bg,tint,src}, ... , {name,bg,tint,src} ]
- name：按钮名称(name会在onClick事件中调用,勿重复命名)
- bg：按钮背景颜色
- tint：按钮图标着色(不设置此参数,则不为图标着色)
- src：按钮图标

//导入模块
var FloatyRoundButton = require('./FloatyRoundButton.js');
//悬浮按钮参数
var frbData = {
    parameter: {
        buttonSize: 42,//按钮大小 默认40dp
        logoSrcSize: 28,//主按钮图标大小 默认24dp
        menuSrcSize: 22,//子菜单图标大小 默认24dp
        animationTime: 300,//子菜单展开动画时间 默认300ms
        dockingAnimationTime: 400,//主按钮停靠动画时间 默认300ms
        menuRadius: 100,//子菜单展开半径 默认80dp
        logoAlpha: 0.4,//主按钮 透明度 默认0.5
        position: 0.2,//主按钮初始化位置 0-1 越小越靠近顶部 默认0.5
        timeout: 5000,//子菜单自动关闭时间(ms) 0为不关闭 默认0
        menuClickClose: true,//点击子菜单按钮后菜单关闭 true关闭 false不关闭 默认false
    },
    /**
     * logo:{bg,src}
     *  .bg 按钮背景颜色
     *  .src 按钮图标
     */
    logo: { bg: "", src: "" },

    // menu - 子菜单参数 array
    menu: [
        /**
         * {name,bg,src,tint}
         *  .name 子菜单按钮名称 (在onClick事件中调用不可重复命名)
         *  .bg 按钮背景颜色
         *  .src 按钮图标
         *  .tint 按钮图标着色 (默认为空不着色)
         */
        { name: "菜单1", bg: "", src: "", tint: "" },
        { name: "菜单2", bg: "", src: "", tint: "" },
        { name: "菜单3", bg: "", src: "", tint: "" },
        { name: "菜单4", bg: "", src: "", tint: "" },
        { name: "菜单5", bg: "", src: "", tint: "" },
    ],
};

//绑定构造函数
var frb = FloatyRoundButton(frbData);

//子菜单按钮点击事件
frb.on("click",(name,view)=>{
  toastLog("点击: " + name );
});