Titanium mobile multiple select

Question

我無法在任何地方找到實現簡單多重選擇彈出窗口的庫或模塊。我想要的內容完全類似於在網頁上觸摸選項/選擇對話框後出現的內容。

有什麼辦法讓網頁的選項/選擇彈出沒有頁面。也許可以創建隱藏頁面，並自動選擇選項對話框，觸發它彈出。

可以做到這一點嗎？它在iOS上看起來如何？我只有android才能測試。

Answer 1

至少有兩種實現方法。不需要特殊的模塊：

• 首先，你可以使用一個Ti.UI.Picker這是一小部分選擇有用的。這看起來像是一個日期選擇器，它在iOS和Android上非常相似。你可以在documentation找到例子。 更新：看起來，雖然在本機iOS上支持，但在鈦中使用複選標記是不可能的。

• 或者，您可以在模式或彈出窗口（僅限ios）窗口或單獨的視圖（這對於android更好）中使用table view（列表）。這對於大量選擇非常有用，因爲您可以提供搜索欄。選擇將通過設置hasCheckmark: true在table view row上觸發。 （爲了更好的用戶界面中，使用updateRow上表視圖和使用動畫製作方法）

  這是第二溶液

  var self = Ti.UI.createWindow(...); 
  
  var options = [/*array with all options*/ {title: 'Option 1', value: 1}, {title: 'Option 2', value: 2}]; 
  var selectedOptions = [0]; // array to store selected options, also pass preselected options 
  
  var tableView = Ti.UI.createTableView({...}); 
  // add rows 
  var i = 0, rows = []; 
  options.forEach(function(option) { 
      var row = Ti.UI.createTableViewRow({hasCheck: selectedOptions.indexOf(i)!==-1, title: option.title }); 
      rows.push(row); 
  }); 
  tableView.setData(rows); 
  
  tableView.addEventListener('click', function(e) { 
      var state = e.rowData.hasCheck; 
      // reuse existing row (using its configuration, not its instance) 
      var row = Ti.UI.createTableViewRow(e.rowData); 
      row.hasCheck = !e.rowData.hasCheck; 
      // or create a really new one 
      var row = Ti.UI.createTableViewRow({ 
      //config here, 
      hasCheck: !e.rowData.hasCheck, 
  ); 
      tableView.updateRow(e.index, row, {animated: true}); 
      if (state) { 
      selectedOptions.push(e.index 
      } else { 
      selectedOptions.splice(selectedOptions.indexOf(e.index),1); 
  }); 
  
  self.open({modal: true}); 
  

多項選擇可以在這兩種情況下的實施方式的一部分。在這兩種情況下，您都應該提供完成按鈕以完成工作。