創建自定義選擇器控件

Question

請參閱自定義選擇器的截圖：

我知道有沒有辦法風格鈦選取器控件。這個選擇器只需要在iOS上工作（僅限iPad）。我想我可以破解TableView控件來代替拾取器來實現所需的樣式。這是否合理？我如何捕捉TableViewRows，使其像在典型的拾取器控件中一樣處於中心位置？

Answer 1

這是一個艱難的我會說你只需要視圖和標籤和滑動事件（你可以識別是否有人滑動上下），只是改變標籤。你可以用一個回調函數，我希望這個代碼將幫助你做到這一點（我們已經創建了這個代碼的自定義選擇器）使用

合金

XML

<View id="numOfIntrusionsPickerContainer" class="compositeWrapperPicker noMargins" > 
<View id="numOfIntrusionsButtonContainer" class="horizontalWrapper"></View> 

CSS

".compositeWrapperPicker" : { 
    height: Ti.UI.SIZE, 
    layout: "composite", 
    width:Ti.UI.SIZE 
}, 
".horizontalWrapper" : { 
    width: Ti.UI.SIZE, 
    height: Ti.UI.SIZE, 
    layout: "horizontal" 
}, 

JS

// INSTANTIATION 
var args = arguments[0] || {}; 
var widthValue = 120; 
var pickerEnabled = true; 

if(args.width != null){ 
    widthValue = args.width; 
} 
if(args.isEnabled != null){ 
    pickerEnabled = args.isEnabled; 
} 
// STYLING 


// ADDITIONS 

// pressed arg can be: true,false,null. false & null are equal 
// true = 'yes' is Pressed at creation, false/null = 'no' is pressed 



var btn_main = Ti.UI.createButton({ 
    top: 5, 
    bottom: 0, 
    left:0, 
    right:5, 
    height: 45, 
    enabled: pickerEnabled, 
    width: widthValue, 
    borderRadius: 5, 
    backgroundImage: "/images/bttn_gray_flex.png", 
    backgroundSelectedImage : "/images/bttn_gray_press_flex.png", 
    backgroundFocusedImage : "/images/bttn_gray_press_flex.png" 
    }); 

var picker_divider = Ti.UI.createImageView({ 
    right: 43, 
    bottom:2, 
    touchEnable:false, 
    focusable:false, 
    image: "/images/Divider_picker.png" 
}); 
var picker_arrows = Ti.UI.createImageView({ 
    right: 16, 
    top: 17, 
    touchEnabled: false, 
    focusable: false, 
    image: "/images/bttn_selector_arrow.png" 
}); 

$.pickerContainer.add(btn_main); 
$.pickerContainer.add(picker_divider); 
$.pickerContainer.add(picker_arrows); 



// CODE 



// LISTENERS 
if(args.callBack != null){ 
    btn_main.addEventListener("click",function(_event){ 
     args.callBack(_event); 
    }); 

}