Titanium下拉框效果
Titanium下拉框效果<div class="postText"><div id="cnblogs_post_body">运行效果：
http://pic002.cnblogs.com/images/2012/222222/2012080313371676.png
app.js代码：
<div class="cnblogs_code">Titanium.UI.setBackgroundColor('#000');var win1 = Titanium.UI.createWindow({ backgroundColor:'#000'});
//创建2D矩阵var tr = Titanium.UI.create2DMatrix();tr = tr.rotate(90);
//创建下拉效果的Buttonvar drop_button =Titanium.UI.createButton({ style:Titanium.UI.iPhone.SystemButton.DISCLOSURE, transform:tr});//创建输入框，设置右侧下拉按钮var my_combo = Titanium.UI.createTextField({ hintText:"选择一个", height:40, width:300, top:20, borderStyle:Titanium.UI.INPUT_BORDERSTYLE_ROUNDED, rightButton:drop_button, rightButtonMode:Titanium.UI.INPUT_BUTTONMODE_ALWAYS});//创建视图var picker_view = Titanium.UI.createView({ height:251, bottom:-251});//创建&lsquo;Cancel&rsquo;按钮var cancel =Titanium.UI.createButton({ title:'Cancel', style:Titanium.UI.iPhone.SystemButtonStyle.BORDERED});//创建&lsquo;Done&rsquo;按钮var done =Titanium.UI.createButton({ title:'Done', style:Titanium.UI.iPhone.SystemButtonStyle.DONE});//创建一个空格按钮var spacer =Titanium.UI.createButton({ systemButton:Titanium.UI.iPhone.SystemButton.FLEXIBLE_SPACE});//创建一个工具栏var toolbar =Titanium.UI.createToolbar({ top:0, items://工具栏中的内容});//创建picker选择器var picker = Titanium.UI.createPicker({ top:43});picker.selectionIndicator=true;
//选择器数据var picker_data = [ Titanium.UI.createPickerRow({title:'MacBook'}), Titanium.UI.createPickerRow({title:'Lenovo'}), Titanium.UI.createPickerRow({title:'Samsun'}), Titanium.UI.createPickerRow({title:'HP'}), Titanium.UI.createPickerRow({title:'Sony'})];//设置选择器数据picker.add(picker_data);
//添加工具栏至视图picker_view.add(toolbar);
//将picker选择器也添加至视图picker_view.add(picker);//创建滑入屏幕特效var slide_in =Titanium.UI.createAnimation({bottom:0});
//创建滑出屏幕特效var slide_out =Titanium.UI.createAnimation({bottom:-251});//给输入框添加获得焦点事件my_combo.addEventListener('focus', function() {
//picker_view滑出屏幕 picker_view.animate(slide_out);});//给下拉按钮添加事件drop_button.addEventListener('click',function() { //picker_view滑入屏幕
picker_view.animate(slide_in);
//让输入框失去焦点 my_combo.blur();});//取消事件：picker_view滑出屏幕cancel.addEventListener('click',function() { picker_view.animate(slide_out);});//选择事件：将选择器选择的值赋给输入框，并让picker_view滑出视图done.addEventListener('click',function() { my_combo.value =picker.getSelectedRow(0).title; picker_view.animate(slide_out);});//将视图、输入框添加至Windowwin1.add(picker_view);win1.add(my_combo);win1.open();
页:
[1]