Activity indicator in Titanium not working

Question

I want to show an activity indicator in my screen using Titanium but it is not showing me any result. It is not showing any progress sign.

Here is my code:

var actInd = Titanium.UI.createActivityIndicator();

actInd.message = 'Please wait...';
//message will only shows in android.

var self = Ti.UI.createWindow({
    title : "About",
    navBarHidden : false,
    barColor : "#50b849",
    backgroundColor : "#2d2d2d",
});
self.add(actInd);
actInd.show();
self.orientationModes = [Titanium.UI.PORTRAIT];

var text = Ti.Filesystem.getFile(Ti.Filesystem.resourcesDirectory + "info.txt").read();

var infoText = Ti.UI.createTextArea({
    width : "100%",
    height : "100%",
    color : "#fff",
    backgroundColor : "#2d2d2d",
    value : text,
    editable : false,
    scrollable : false,
    font : {
        fontWeight : 'bold',
        fontSize : 20,
        fontFamily : 'Helvetica Neue'
    },
    textAlign : Ti.UI.TEXT_ALIGNMENT_CENTER,
    autoLink : Ti.UI.AUTODETECT_LINK
});

infoText.addEventListener("click", function() {
    Ti.Platform.openURL("http://tellusanotherone.org/c2p");
});

var scrollView = Ti.UI.createScrollView({
    width : "100%",
    height : "100%",
    verticalBounce : true,
    scrollType : "vertical",
});
scrollView.add(infoText);
self.add(infoText);

return self;

Thanks in advance.

Answer 1

Just create file (lib/indicator.js) and add the following code int it

function createIndicatorWindow(args) {
    var width = 180,
        height = 50;

    var args = args || {};
    var top = args.top || 140;
    var text = args.text || 'Loading ...';

    var win = Titanium.UI.createWindow({
        height:           height,
        width:            width,
        top:              top,
        borderRadius:     10,
        touchEnabled:     false,
        backgroundColor:  '#000',
        opacity:          0.6
    });

    var view = Ti.UI.createView({
        width:   Ti.UI.SIZE,
        height:  Ti.UI.FILL,
        center:  { x: (width/2), y: (height/2) },
        layout:  'horizontal'
    });

    var style;
    if (Ti.Platform.name === 'iPhone OS') {
        style = Ti.UI.iPhone.ActivityIndicatorStyle.PLAIN;
    } else {
        style = Ti.UI.ActivityIndicatorStyle.DARK;
    }

    var activityIndicator = Ti.UI.createActivityIndicator({
        style : style,      
        height : Ti.UI.FILL,
        width : 30
    });

    var label = Titanium.UI.createLabel({
        left:    10,
        width:   Ti.UI.FILL,
        height:  Ti.UI.FILL,
        text:    text,
        color:   '#fff',
        font:    { fontFamily: 'Helvetica Neue', fontSize: 16, fontWeight: 'bold' }
    });

    view.add(activityIndicator);
    view.add(label);
    win.add(view);

    function openIndicator() {
        win.open();
        activityIndicator.show();
    }

    win.openIndicator = openIndicator;

    function closeIndicator() {
        activityIndicator.hide();
        win.close();
    }

    win.closeIndicator = closeIndicator;

    return win;
}

// Public interface
exports.createIndicatorWindow = createIndicatorWindow

Use in your code like this

var uie = require('lib/indicator');
var indicator = uie.createIndicatorWindow();

someViewObject.addEventListener('click', function(e) {
    indicator.openIndicator();

    setTimeout(function() {
        // Do the work that takes a while
        // and requires an activity indicator
        indicator.closeIndicator();
    },0);
});