0

我可以轻松地将小部​​件添加到 CollectionView，但我似乎无法添加多个小部件类型。我正在尝试添加 2 个 TextView。这是我到目前为止得到的，它只输出了 firstName 两次。（这在操场上运行）

另外，是否可以向每个 TextView 添加事件？喜欢： .on('tap', () => {

我确实在 Collection View 上看到了.on('select',工作原理，但我想将事件添加到每个单独的 TextView

谢谢。

没有显示姓氏的屏幕截图

// Create a collection view, initialize its cells and fill it with items
const {CollectionView, Composite, ImageView, TextView, ui} = require('tabris');

let people = [
  ['Bob', 'Smith',],
  ['Fred', 'Jones'],
  ['James', 'Mackay'],
].map(([firstName, lastName]) => ({firstName, lastName}));

new CollectionView({
  left: 0, top: 0, right: 0, bottom: 0,
  itemCount: people.length,
  cellHeight: 56,

  createCell: () => {
    let cell = new Composite();

    new TextView({
      left: 30, top: 10,
      alignment: 'left'
    })
    .appendTo(cell);

    let txvLastName = new TextView({
      left: 50, top: 25,
      alignment: 'right'
    })
    .appendTo(cell);
    return cell;
  },
  updateCell: (cell, index) => {
    let person = people[index];
    cell.apply({
      TextView: {text: person.firstName},
      txvLastName: {text: person.lastName},
    });
  }
}).on('select', ({index}) => console.log('selected', people[index].firstName))
  .appendTo(ui.contentView);
4

1 回答 1

2

apply方法采用Widget 选择器，其工作方式与 CSS 选择器类似，并在上述链接中记录。您正在引用一个 JavaScript 变量，该变量不受支持且不在updateCell回调函数的范围内。

我会更新你的createCell回调，以便每个元素都有一个不同的类，并在你的updateCell回调中引用它：

createCell: () => {
  let cell = new Composite();

  new TextView({
    left: 30, top: 10,
    class: 'firstName',
    alignment: 'left'
  }).appendTo(cell);

  new TextView({
    left: 50, top: 25,
    class: 'lastName',
    alignment: 'right'
  }).appendTo(cell);
  return cell;
},
updateCell: (cell, index) => {
  let person = people[index];
  cell.apply({
    '.firstName': {text: person.firstName},
    '.lastName': {text: person.lastName},
  });
}
于 2018-06-26T17:16:01.167 回答