Uploaded image for project: 'Titanium SDK/CLI'
  1. Titanium SDK/CLI
  2. TIMOB-7351

Android: ImageView.images - animated images do not start on load and animating property value incorrect

    Details

      Description

      Problem

      The animating property defaults to false on creation, but is then set to true on load, even though the animation does not run.

      The start() method needs to be invoked to start the animation, and the animating property remains set at the same value (true).

      Hence, to resolve this, ensure that the start() method works correctly, and the animating property reflects the actual animation state. Hence, surely animating should be false on load until the start event is fired?

      Test case

      1. create a new project
      2. replace the app.js code with the code below
      3. extract the attached zip of images to the /images folder. Note that the campfire images included in the archive are taken from the KS
      4. launch project
      5. on second launch, enable the start() method in the load eventListener

      app.js

      Ti.UI.backgroundColor = 'white';
      var win = Ti.UI.createWindow({
        exitOnClose: true,
        layout: 'vertical'
      });
       
      var switchAnimation = Ti.UI.createSwitch({
        title: 'Start',
        value:false,
        top: 20
      });
      win.add(switchAnimation);
       
      var imageArray = [];
       
      var imgName = 'campFire';
      var imgExt = 'gif';
      var imgNum = 17;
       
      for (var i=1;i<=imgNum;i++){
        imageArray.push('/images/' + imgName + ((i<10) ? '0'+i : i) + '.' + imgExt);
      }
       
      var imageSeries = Ti.UI.createImageView({
        defaultImage: '/images/campFire01.gif',
        images: imageArray,
        duration:100,
        repeatCount:0,
        top: 20,
        height:200
      });
      win.add(imageSeries);
       
      Ti.API.info('Before load 1): imageSeries.animating = ' + imageSeries.animating); // returns false
       
      imageSeries.addEventListener('load', function(e){
        Ti.API.info('After load 1): imageSeries.animating = ' + imageSeries.animating); // returns true
        // e.source.start();  // uncomment this to allow the animation to run properly
        Ti.API.info('After load 2): imageSeries.animating = ' + imageSeries.animating); // returns true
      });
       
      switchAnimation.addEventListener('click', function(e){
        if(imageSeries.animating === false){
          e.value = true;
          imageSeries.start();
          Ti.API.info('After switch 3): imageSeries.animating = ' + imageSeries.animating);
        } else {
          e.value = false;
          imageSeries.stop();
          Ti.API.info('After switch 4): imageSeries.animating = ' + imageSeries.animating);
        }
      });
       
      win.open();
      

      Logs

      With start() NOT invoked in the load event listener, animation DOES NOT start and gives the following results.

      887                   TiAPI  I  (kroll$1: app://app.js) [247,923] Before load 1): imageSeries.animating = false
      887                   TiAPI  I  (kroll$1: app://app.js) [622,1384] After load 1): imageSeries.animating = true
      887                   TiAPI  I  (kroll$1: app://app.js) [1,1385] After load 2): imageSeries.animating = true
      

      With start() invoked in the load event listener, animation DOES start, and gives the same results.

      console

      887                   TiAPI  I  (kroll$1: app://app.js) [247,923] Before load 1): imageSeries.animating = false
      887                   TiAPI  I  (kroll$1: app://app.js) [622,1384] After load 1): imageSeries.animating = true
      887                   TiAPI  I  (kroll$1: app://app.js) [1,1385] After load 2): imageSeries.animating = true
      

        Attachments

          Activity

            People

            • Assignee:
              pwang Ping Wang
              Reporter:
              pdowsett Paul Dowsett
            • Watchers:
              0 Start watching this issue

              Dates

              • Created:
                Updated:
                Resolved:

                Backbone Issue Sync

                • Titanium SDK/CLI <> Titanium Mobile
                  Synced with:
                  TIMOB-11852
                  Sync status:
                  ERROR
                  Last received:
                  Last sent:

                  Git Integration