autojs颜色渐变效果

牙叔教程 简单易学

使用场景

颜色渐变

视频教学

autojs颜色渐变

autojs版本

原理

使用androidx自带的颜色工具类来混合颜色

代码讲解

1. 布局

ui.layout(
  <vertical gravity="center">
    <button id="渐变色">渐变色</button>
    <View id="view1" w="300dp" h="300dp"></View>
  </vertical>
);

2. 初始化变量

let view;
view = ui.view1;
let color1 = "#ff0000";
let color2 = "#00ff00";
view.attr("bg", color1);

3. 设置按钮点击事件

ui.渐变色.click(start);

具体函数

1. 创建handler

let mHandler = new Handler({
     
  handleMessage: function (msg) {
     
    let a = msg.arg1;
    if (a <= 500) {
     
      let message = mHandler.obtainMessage();
      message.arg1 = a + 1;
      mHandler.sendMessageDelayed(message, 1);
      let fraction = a / 500;
      let color = blendColors(colors.parseColor(color1), colors.parseColor(color2), fraction);
      view.attr("bg", colors.toString(color));
    }
    mHandler.handleMessage(msg);
    return true;
  },
});

2. handler发送消息

function start() {
     
  let msg = new Message();
  msg.arg1 = 0;
  mHandler.sendMessageDelayed(msg, 1);
}

3. 混合颜色

/**
 * 颜色渐变
 *
 * @param color1 起始颜色
 * @param color2 终止颜色
 * @param ratio 颜色变化频率 从0-1
 * @return 颜色值
 */
function blendColors(color1, color2, ratio) {
     
  return ColorUtils.blendARGB(color1, color2, ratio);
}

注意事项

1. blendColors的颜色参数范围, 必须在Integer范围之内, 不可以用这种 0xffff0000,
   可能java里面能用, 但是js里面不可以
2. ui.view.setBackgroundColor(color); 不管用,
   要用 view.attr("bg", colors.toString(color));代替
3. 控件的id名字不可以是 view, 因为ui.view是默认的根控件
   测试代码如下

"ui";
ui.layout(
  <vertical>
    <button>牙叔教程 简单易学</button>
  </vertical>
);
ui.post(function () {
     
  log(ui.view.getWidth());
  log(ui.view.getHeight());
  ui.view.attr("bg", "#ff00ff");
});

参考文章

1. Android颜色渐变效果

声明

部分内容来自网络

微信公众号 牙叔教程

QQ群

747748653

完整源码

.