如何在iOS Titanium中创建复选框?

时间:2012-11-09 09:46:04

标签: javascript titanium titanium-mobile

如何使用Titanium for iOS创建一个复选框?

2 个答案:

答案 0 :(得分:2)

这是一个非常简化的例子,说明如何做类似的事情

var win = Ti.UI.createWindow()

function createCheckbox (specs) {
    if(typeof specs != "object")
        specs = {};
    specs.width = specs.width || 25
    specs.backgroundColor = specs.unCheckedColor || "white"
    specs.height = specs.height || 25
    specs.border = specs.border || 1
    specs.borderColor = specs.borderColor || "silver"
    var viw = Ti.UI.createView(specs)

    function togglecheck () {
        if(!viw.checked) {
            viw.checked = true;
            viw.backgroundColor = specs.checkedColor || "green"
        }
        else {
            viw.checked = false;
            viw.backgroundColor = specs.unCheckedColor || "white"
        }           
    }
    viw.addEventListener("click",togglecheck)

    return viw
}

var checkbox = createCheckbox({})

win.add(checkbox)

您还可以使用背景图像在视图上显示复选标记 或者在较大的视图上添加较小的视图,并仅为内部视图提供边框颜色并在外部视图上显示复选标记图像

希望这能指出你正确的方向


编辑:以下是图片的示例, 虽然我真的会创建一个新的(显然是透明的)因为这个看起来很糟糕^^ 无论如何这样一个带图像的checkboxc可以工作

var win = Ti.UI.createWindow()
Ti.UI.setBackgroundColor("#FFF")
function createCheckbox (specs,checkboxspecs,image) {

    if(typeof checkboxspecs != "object")
        checkboxspecs = {};
    checkboxspecs.width = checkboxspecs.width || 25
    checkboxspecs.backgroundColor = checkboxspecs.unCheckedColor || "white"
    checkboxspecs.height = checkboxspecs.height || 25
    checkboxspecs.border = checkboxspecs.border || 1
    checkboxspecs.borderColor = checkboxspecs.borderColor || "silver"
    var imageView = Ti.UI.createImageView({
        image:image || "acheckbox.gif",
        height:checkboxspecs.height * 1.5,
        bottom:3 + checkboxspecs.height * 0.5,
        left:3 + checkboxspecs.width * 0.5,
        opacity:0
    })  

    var viw = Ti.UI.createView(checkboxspecs)
    specs.width =  checkboxspecs.width * 1.5;
    specs.height = checkboxspecs.height * 1.5;

    var outerview = Ti.UI.createView({
        width: specs.width * 1.5,
        height: specs.height * 1.5,
    })
    var clickview = Ti.UI.createView({
        width:checkboxspecs.width,
        height:checkboxspecs.height
    })
    outerview.add(viw)
    outerview.add(imageView)
    outerview.add(clickview)

    function togglecheck () {
        if(!viw.checked) {
            viw.checked = true;
            imageView.opacity = 1;

        }
        else {
            viw.checked = false;
            imageView.opacity = 0;
        }           
    }
    clickview.addEventListener("click",togglecheck)
    return outerview
}

var checkbox = createCheckbox({},{
    width:20,
    height:20,
    borderRadius:3,
    border:2
},"checkbox.gif")

win.add(checkbox)

win.open()

将图像保存为“checkbox.gif”并将其放在Resources文件夹中 (真的,创建一个新的) enter image description here

答案 1 :(得分:0)

根据this question,iOS中没有复选框。您可能想要使用UI switch