[TIMOB-13436] iOS: CoverFlowView displays half image after image modification

   var win = Ti.UI.createWindow({backgroundColor:'white'});
   
   var hover = Ti.UI.iOS.createCoverFlowView({
       width:320,
       height:200
   })
   
   var images = [];
   var imagefiles = [];
   var dir = Titanium.Filesystem.getFile(Ti.Filesystem.resourcesDirectory);
   // Open the data folder
   var dirItems = dir.getDirectoryListing();
   // get a list of all files in this folder
   var filename = null;
   // contains the filename
   var imagefile = null;
   // contains the full image file name
   var wissel = false;
    
   // loop through the directory listing selecting all .JPG files
   Ti.API.info(dirItems);
   for (var i = 0; i < dirItems.length; i++) {
       // check if the file contains .JPG as extension
       // convert to string first
       filename = dirItems[i].toString();
       // if this is a .JPG file, then process it
       if (filename.indexOf('.JPG') >= 0) {
           // add  image to coverflow view
           var p = {};
           p.imageFile = Titanium.Filesystem.resourcesDirectory + filename;
           p.command = 'Add';
           AddImageToCoverFlowView(p);
           // save filename for later
           imagefiles.push(filename);
       }
   }
   
   function modifyImage(e) {
       // just change the time in the center of the image
       if (e.index < images.length) {
           var imageFile = Titanium.Filesystem.getFile(Titanium.Filesystem.resourcesDirectory, imagefiles[e.index]);
           if (imageFile.exists()) {
               // read the image first
               var image = imageFile.read();
               imageFile = null;
               // release the file handle
               // create a view to put the image in the background
               var vw = Ti.UI.createView({
                   backgroundImage : image,
                   width : 320,
                   height : 200,
               });
               // get the current date time
               var txt = new Date();
               // create a label to put the date in
               var label = Ti.UI.createLabel({
                   text : txt,
                   width : Ti.UI.SIZE,
                   height : Ti.UI.SIZE,
                   backgroundColor : "#fff",
                   color : "#000",
                   font : {
                       fontSize : 20,
                       fontFamily : 'HelveticaNeue-Bold'
                   },
                   minimumFontSize : 8,
                   textAlign : 'center'
               });
               // add the label to the view
               vw.add(label);
               // get an image of the new view
               var newImage = vw.toImage();
               // overwrite the old image
               var newImageFile = Titanium.Filesystem.getFile(Titanium.Filesystem.applicationDataDirectory, imagefiles[e.index]);
               if (newImageFile.exists() == false) {
                   newImageFile.createFile();
               }
               
               if (newImageFile.exists()) {
                   newImageFile.write(newImage);
               } else {
                   alert('cannot find image');
                   return;
               }
               
   
               // now the image is ready to be resaved on the coverflow
               var p = {};
               p.imageFile = Titanium.Filesystem.applicationDataDirectory + imagefiles[e.index];
               images[e.index].image = newImage;
               p.command = 'Change';
               p.index = e.index;
               AddImageToCoverFlowView(p);
           }
       }
   }
   
   function AddImageToCoverFlowView(p) {
       Ti.API.info(p);
       // check if it is a change or add
       if ('command' in p) {
           switch (p.command) {
    
               case 'Add':
                   // adds an image to the end of the CoverflowView
                   var image = {
                       image : p.imageFile,
                       height : 150,
                       width : 240
                   };
                   images.push(image);
                   hover.setImages(images);
                   break;
    
               case 'Change':
                   // make sure there is an index
                   if ('index' in p) {
                       if (p.index < hover.images.length) {
                           hover.setImage(parseInt(p.index), images[parseInt(p.index)]);
                       }
                   }
                   break;
           }
       }
   }
   
   
   hover.addEventListener('click',modifyImage);
   
   win.add(hover);
   
   win.open();