autojs数据驱动界面和界面驱动数据

界面驱动数据

checkbox状态改变后, 去修改与他绑定的数据

"ui";
ui.layout(
  
    
      
    
  
);

ui.checkbox.on("check", (checked) => {
  log(checked);
});

数据驱动界面

"ui";
engines.all().map((ScriptEngine) => {
  if (engines.myEngine().toString() !== ScriptEngine.toString()) {
    ScriptEngine.forceStop();
  }
});
ui.layout(
  
    
      
        
        
      
    
  
);

let dataList = [];
for (var i = 0; i < 10; i++) {
  dataList.push({ num: i, state: !random(0, 1) });
}
ui.list.setDataSource(dataList);
ui.list.on("item_click", function (item, i, itemView, listView) {
  toastLog(i);
});
ui.list.on("item_bind", function (itemView, itemHolder) {
  //绑定勾选框事件
  itemView.checkbox.on("check", function (checked) {
    let item = itemHolder.item;
    item.state = checked;
  });
});

setTimeout(() => {
  dataList.map((item, i) => {
    item.state = !item.state;
  });
  ui.list.adapter.notifyDataSetChanged();
  toastLog("更新数据");
}, 2000);

UI界面

在这个代码示例中,

数据驱动界面与界面驱动数据共存

界面驱动数据

勾选框可以改变dataList中的数据

ui.list.on("item_bind", function (itemView, itemHolder) {
  //绑定勾选框事件
  itemView.checkbox.on("check", function (checked) {
    let item = itemHolder.item;
    item.state = checked;
  });
});

数据驱动界面

dataList修改后, 通知界面更新

setTimeout(() => {
  dataList.map((item, i) => {
    item.state = !item.state;
  });
  ui.list.adapter.notifyDataSetChanged();
  toastLog("更新数据");
}, 2000);

如何获取某个勾选框的状态?

每个勾选框都隐形或者显性的绑定一个序号,

通过序号来获取勾选框的状态

在dataList中, 有一个num键, 就是显性的给checkbox编一个序号,

当要获取某个checkbox的勾选状态时, 就这样做

dataList[num].state

这就要求我们, 要保持控件的状态和数据的强一致性

当checkbox被点击后, 要及时更新dataList中的数据;

当dataList的数据更改后, 要及时更新checkbox的状态

如何设置某个勾选框的状态?

setTimeout(() => {
  dataList[3].state = !dataList[3].state;
  ui.list.adapter.notifyDataSetChanged();
  toastLog("更新数据");
}, 4000);

先修改dataList指定序号的数据,

然后通知listView更新勾选框的状态