3 Answers

• Philip's solution to animate using a sequence of images works fine. You could either create an array of image names – or name your images with a sequential number and use an index to load the correct one. Here is a sample of how to code it. Assume that you have 12 images and you number them loader1.png, loader2.png, etc:

  
  var win = Ti.UI.createWindow();
  
  // create an imageview and set it to the width and height of your images
  var loaderImage = Ti.UI.createImageView({
    width:54,
    height:54
  });
  
  // add it to your window
  win.add(loaderImage);
  
  // set the length of the images you have in your sequence
  var loaderArrayLength=12;
  
  // initialize the index to 1
  var loaderIndex=1;
  
  // this function will be called by the setInterval
  function loadingAnimation(){
    // set the image property of the imageview by constructing the path with the loaderIndex variable
    loaderImage.image = "images/loader-sequence/frame" + loaderIndex + ".png";
    //increment the index so that next time it loads the next image in the sequence
    loaderIndex++;
    // if you have reached the end of the sequence, reset it to 1
    if(loaderIndex===13)loaderIndex=1;
  }
  
  // start the setInverval -- adjust the time to make a smooth animation
  var loaderAnimate = setInterval(loadingAnimation,80);
  
  
  win.open();
  

• Image array is great. Using photoshop , save each frame as picture using File->Export->Render Video->Image Sequence.

  Then make array , and start the animation. It's simple and works.

• Just to confirm, it appears that gif is not supported. See Jigar Panchal's thread: http://developer.appcelerator.com/question/49181/run-animated-gif-image-in-webview-on-andorid.

  However, thanks to Dan Giulvezan who pointed out on a thread (link) you can use the activity indicator to show activity (See docs here). Or it may be appropriate to use the progress bar. Both have examples in KitchenSink/Resources/examples/activity_indicator.js and progress_bar.js.