チタンでチェックボックスを作成する

Question

私はを使って作成したいCheckboxesのリストを持っています。

私は以下のタイプのデータを持っています。

Value 1 --> checkbox image 
Value 2 --> 
Value 3 --> 
. 
. 
. 
Value 15 --> checkbox Image 

私はそれには次のコードを使用していますが、どのように動作しますか？それは正しいコードですか？

var chkArray = ['Value 1', 'Value 2', 'Value 3', 'Value 4', 'Value 5', 'Value 6', 'Value 7', 'Value 8', 'Value 9', 'Value 10']; 

AssessmentArray = function createChkBx() { 
    var chkBx = []; 
    for(var i in chkArray) { 
     var t = 80; 
     var checkbox = Ti.UI.createSwitch({ 
      style : Ti.UI.Android.SWITCH_STYLE_CHECKBOX, 
      title : chkArray[i], 
      value : true, 
      left : '20dp', 
      top : t + 30, 
      height : 25, 
      width : 'auto' 
     }); 
     checkbox.addEventListener("change", function(e) { 
      Ti.API.info("The checkbox has been set to " + e.value); 
     }); 
     chkBx.push(checkbox); 
    } 
    return chkBx; 
} 


var assessData = new AssessmentArray(); 

これを私のWindowにどのように追加すればいいですか？これが唯一のAndroidのために特別である...

Answer 1

var AssessmentArray = function() 
{ 

    function AssessmentArray() 
    { 

     //Pass the parent view inside which u want to add the check boxes and teh values as array 
     //gap or the distance between two checkboxes 
     this.addCheckBoxes = function(window, values, gap) 
     { 
      var t = 0; 
      var chkBx = []; 
      var i = 0; 
      for(i = 0; i < values.length; i++) { 

       var checkbox = Ti.UI.createSwitch({ 
        style : Ti.UI.Android.SWITCH_STYLE_CHECKBOX, 
        title : chkArray[i], 
        value : true, 
        left : '20dp', 
        top : i * gap, 
        height : 25, 
        width : 'auto' 
       }); 
       checkbox.addEventListener("change", function(e) { 
        Ti.API.info("The checkbox has been set to " + e.value); 
       }); 
       win.add(checkbox); 
       chkBx.push(checkbox); 
      } 
      return chkBx; 
     } 



    } 

    return AssessmentArray; 
}(); 

var ass = new AssessmentArray(); 
ass.addCheckBoxes(Ti.UI.createWindow(), ['Value 1', 'Value 2', 'Value 3', 'Value 4', 'Value 5', 'Value 6'], 50); 

はこのようにいくつかのことを試してみてください。

Answer 2

U may prefer something like this,it can be used both in Ios and Android. 

    var win = Titanium.UI.createWindow({ 
    title : 'app', 
    backgroundColor : 'white', 
    fullscreen : false, 
    navBarHidden : true, 
    layout : 'vertical', 
    height : Ti.UI.FILL, 
    width : Ti.UI.FILL 
}); 
    var checkboxview = Titanium.UI.createView({ 
    width : Ti.UI.FILL, 
    height : Ti.UI.SIZE, 
    //layout : 'horizontal', 
    horizontalWrap : false, 
    //right : '10dp', 
    //left : '10dp', 
    layout : 'horizontal', 
    //backgroundImage : '/images/backblue.png' 
    backgroundColor : '#045FB4', 
    //top : '20dp', 
    //backgroundColor:'' 
}); 
win.add(checkboxview); 
var checkbox = Ti.UI.createButton({ 
    title : '', 
    top : 10, 
    right : 10, 
    width : 30, 
    height : 30, 
    borderColor : 'black', 
    borderWidth : 2, 
    borderRadius : 3, 
    backgroundColor : 'white', 
    backgroundImage : 'none', 
    color : '#fff', 
    font : { 
     fontSize : 25, 
     fontWeight : 'bold' 
    }, 
    value : false //value is a custom property in this casehere. 
}); 
checkboxview.add(checkbox); 
var hinttext = Ti.UI.createLabel({ 
    color : 'black', 
    font : { 
     fontSize : '17dp', 
     //fontWeight : 'bold', 
     fontFamily : 'Rod' 
    }, 
    left : '10%', 
    text : 'user1' 
}); 
checkboxview.add(hinttext); 
//Attach some simple on/off actions 
checkbox.on = function() { 
    this.backgroundColor = '#007690'; 
    this.title = '\u2713'; 
    this.value = true; 
}; 

checkbox.off = function() { 
    this.backgroundColor = '#aaa'; 
    this.title = ''; 
    this.value = false; 
}; 

checkbox.addEventListener('click', function(e) { 
    if (false == e.source.value) { 
     e.source.on(); 
     alert(hinttext.text); 
    } else { 
     e.source.off(); 
    } 
}); 
var checkboxview1 = Titanium.UI.createView({ 
    width : Ti.UI.FILL, 
    height : Ti.UI.SIZE, 
    //layout : 'horizontal', 
    horizontalWrap : false, 
    //right : '10dp', 
    //left : '10dp', 
    layout : 'horizontal', 
    //backgroundImage : '/images/backblue.png' 
    backgroundColor : '#045FB4', 
    //top : '20dp', 
    //backgroundColor:'' 
}); 
win.add(checkboxview1); 
var checkbox1 = Ti.UI.createButton({ 
    title : '', 
    top : 10, 
    right : 10, 
    width : 30, 
    height : 30, 
    borderColor : '#666', 
    borderWidth : 2, 
    borderRadius : 3, 
    backgroundColor : '#aaa', 
    backgroundImage : 'none', 
    color : '#fff', 
    font : { 
     fontSize : 25, 
     fontWeight : 'bold' 
    }, 
    value : false, 
    //value is a custom property in this casehere. 
}); 
checkboxview1.add(checkbox1); 
var hinttext1 = Ti.UI.createLabel({ 
    color : 'black', 
    font : { 
     fontSize : '17dp', 
     //fontWeight : 'bold', 
     fontFamily : 'Rod' 
    }, 
    left : '10%', 
    width : Ti.UI.SIZE, 
    height : Ti.UI.SIZE, 
    text : "User2" 
}); 
checkboxview1.add(hinttext1); 
//Attach some simple on/off actions 
checkbox1.on = function() { 
    this.backgroundColor = '#007690'; 
    this.title = '\u2713'; 
    this.value = true; 
}; 

checkbox1.off = function() { 
    this.backgroundColor = '#aaa'; 
    this.title = ''; 
    this.value = false; 
}; 

checkbox1.addEventListener('click', function(e) { 
    if (false == e.source.value) { 
     e.source.on(); 
     alert(hinttext1.text); 
    } else { 
     e.source.off(); 
    } 
});