titanium - 如何使用钛创建客户风格的进度条？

Question

我想使用钛创建自己的进度条，而不是使用 createProgressBar 函数......或者我希望能够设置使用 createProgressBar 函数创建的进度条的样式（更改外观、背景等）。我怎样才能做到这一点？

var ind2 = Titanium.UI.createProgressBar({
    width : 200,
    min : 0,
    max : 90,
    value : 0,
    height : 150,
    color : '#000000',
    font : {
        fontSize : 14,
    },
    top : 60
});

Answer 1

Use views. Spruce it up with graphics.

var win = Ti.UI.createWindow({
    backgroundColor: 'white'
});
var track = Ti.UI.createView({
    width: 100, height: 30,
    backgroundColor: 'red'
});
var progress = Ti.UI.createView({
    left: 0,
    width: 1, height: 30,
    backgroundColor: 'green'
});
track.add(progress);
win.add(track);
win.addEventListener('open', function () {
    progress.animate({
        width: 100,
        duration: 5000
    });
    // or: progress.width = 100;
});
win.open();

Answer 2

如果它只是 iOS，你可以使用NappAppearance 模块并像这样自定义你的进度条：

var NappAppearance = require('dk.napp.appearance');
NappAppearance.setGlobalStyling({
    progressBar:{
        progressTintColor:"#CD1625",
        trackTintColor:"#ececec",
        progressImage:"/images/components/progressBarBG.png",
        trackImage:"/images/components/progressBarTrack.png"

    },
});