更改微调的形象

Question

虽然与钛应用程序时，遇到了在这里我想改变微调的图像（即选择器在钛）

拍摄选择器的对象，我能创造微调和操纵数据，但没有找到的情况这改变微调

思考做这样replace-picker-with-button

任何其他想法的默认图像的任何机制？

Answer 1

您可以通过其backgroundImage属性直接更改微调器的图像。

对于实施例

backgroundImage: '/images/dropdown.png。

这将仅适用于Android工作，并没有与iPhone合作。

所以，如果你想为Ios和Android制作相同的UI，那么你可以按照下面的方法。

这里是你可以用它来创建和显示选择器全局法。

/* 
pickerData: is the array of the values which you want to display in the picker 
funName: is the callback function which will be called when user will select the row from picker. this function will have two parameters first will be selected row's text and second is the index of the selected row 
title: is the title of the picker 
index: is the default selected index in the picker 
*/ 

function showPicker(pickerData, funName, title, index) { 
    if (title == undefined || title == "") { 
     title = ""; 
    } 
    if (pickerData == undefined || pickerData == null) { 
     pickerData = []; 
    } 

    index = index || 0; 

    if (pickerData.length <= index || index < 0) { 
     index = 0; 
    } 

    var selectedCategory = pickerData[0]; 
    var win = Ti.UI.createWindow({ 
     backgroundColor : 'transparent', 
    }); 


    //Check weather the Os is IOs or Android 
    //globals.isIos is the parameter which is indicating that current OS is IOs or not? 
    if (globals.isIos) { 

     var picker = Ti.UI.createPicker({ 
      selectionIndicator : true, 
      bottom : 0, 
      width : '100%', 
      isSpinner : true, 
     }); 

     data = []; 
     for (var p = 0; p < pickerData.length; p++) { 
      data.push(Ti.UI.createPickerRow({ 
       title : pickerData[p], 
       index : p 
      })); 
     } 
     picker.add(data); 
     Ti.API.info("Tab Index" + index); 
     picker.setSelectedRow(0, index, true); 

     var selectedIndex = 0; 
     picker.addEventListener('change', function(e) { 
      selectedCategory = e.row.title; 
      selectedIndex = e.row.index; 
     }); 

     //toolbar 
     var done = Titanium.UI.createButton({ 
      title : 'Done', 
      style : Titanium.UI.iPhone.SystemButtonStyle.DONE, 
     }); 
     done.addEventListener('click', function(e) { 
      funName(selectedCategory, selectedIndex); 
      win.close(); 
     }); 

     var title = Titanium.UI.createLabel({ 
      text : title, 
      textAlign : 'left', 
      color : 'white', 
      font : { 
       fontWeight : 'bold', 
       fontSize : globals.isIpad ? 18 : "14dp" 

      } 
     }); 
     var flexSpace = Titanium.UI.createButton({ 
      systemButton : Titanium.UI.iPhone.SystemButton.FLEXIBLE_SPACE 
     }); 

     var toolbar = Titanium.UI.iOS.createToolbar({ 
      items : [title, flexSpace, done], 
      bottom : 216, 
      borderTop : true, 
      borderBottom : false, 
      barColor : '#3F3F3F' 
     }); 

     win.addEventListener('click', function(e) { 
      win.close(); 

     }); 

     win.add(picker); 
     win.add(toolbar); 
     win.open(); 
    } else { 

     var pickerView = Titanium.UI.createOptionDialog({ 
      selectedIndex : index 
     }); 
     pickerView.title = title; 

     data = []; 
     for (var p = 0; p < pickerData.length; p++) { 
      data.push(pickerData[p]); 
     }; 
     pickerView.options = data; 
     pickerView.addEventListener('click', function(e) { 
      selectedCategory = pickerData[e.index >= 0 ? e.index : index]; 
      funName(selectedCategory, e.index >= 0 ? e.index : index); 

     }); 
     pickerView.show(); 
    } 
    return win; 
} 

现在在窗口中创建一个按钮或标签，并将下拉图像设置为其背景。 所以它看起来像现在下拉处理单击按钮，并在它把下面的代码。

var data = ["Android", "IOS", "Blackberry", "Windows"]; 
function callback(title, index) { 
    Ti.API.info('Selected title=' + title + ' index=' + index); 
} 

var defaultSelected = 1; 

//Here functions is the global file in which my showPicker method is defined. 
var pickerShow = functions.showPicker(data, callback, "Mobile OS", defaultSelected); 
//Here globals is the file in which my isIos variable is defined. 
if (globals.isIos) { 
    pickerShow.open(); 
}