Tooth uncle tutorial is easy to understand

Interface driver data

After the checkbox status changes, modify the data bound to it

"ui";
ui.layout(
  <vertical gravity="center_horizontal">
    <horizontal gravity="center" margin="30">
      <checkbox id="checkbox"></checkbox>
    </horizontal>
  </vertical>
);

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

Data-driven interface

"ui"; engines.all().map((ScriptEngine) => { if (engines.myEngine().toString() ! == ScriptEngine.toString()) { ScriptEngine.forceStop(); }}); ui.layout( <vertical gravity="center_horizontal"> <list id="list"> <horizontal gravity="center" w="*" margin="10"> <text  textColor="#222222" textSize="16sp" text="{{this.num}}"></text> <checkbox id="checkbox" checked="{{this.state}}"></checkbox> </horizontal> </list> </vertical> ); 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) {ui.list.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 (" Update data "); }, 2000);Copy the code

UI

In this code example,

Data-driven interfaces coexist with interface-driven data

Interface driver data

Check boxes can change the data in dataList

Ui.list. on("item_bind", function (itemView, itemHolder) {ui.list.on(" check", function (checked) { let item = itemHolder.item; item.state = checked; }); });Copy the code

Data-driven interface

After dataList is modified, the notification interface is updated

setTimeout(() => { dataList.map((item, i) => { item.state = ! item.state; }); ui.list.adapter.notifyDataSetChanged(); ToastLog (" Update data "); }, 2000);Copy the code

How do I get the status of a check box?

Each check box is implicitly or explicitly bound to a serial number,

Get the status of the check box by serial number

Select * from dataList; select * from dataList;

Do this when you want to get the checked status of a checkbox

dataList[num].state
Copy the code

This requires us to maintain a strong consistency of control state and data

Update dataList when checkbox is clicked;

Update checkbox status when dataList data changes

How do I set the status of a check box?

setTimeout(() => { dataList[3].state = ! dataList[3].state; ui.list.adapter.notifyDataSetChanged(); ToastLog (" Update data "); }, 4000);Copy the code

Alter table dataList;

Then notify the listView to update the status of the check box

Baidu, Bing, StackOverflow, Github, Android docs, AutoJS docs, and finally just ask in the group

This tutorial is intended for learning purposes only and is not intended for any other use

Wechat official account tooth Uncle tutorial