4 Answers

• I've managed to get this working quite nicely, including pinch to zoom, and drag and drop.
  The essence of the code is below and it's not tested as a standalone, but it all works well in my app.
  Hopefully I got it all.

  //this keeps the rotating from happening during the pinch
  var pinching = false;
  

  this part is in a loop that is adding multiple images to the view

  
  images[i].addEventListener("touchstart", function(e) {
                  Ti.API.info("TOUCH START");
                  var touchCoords = e.source.convertPointToView({x: e.x, y: e.y}, self); //convert points to be relative to parent view
  
                  var objectDimensions = e.source.rect; //get top/left of object
                  var objectCoords = e.source.convertPointToView({x: objectDimensions.x, y: objectDimensions.y}, self); //convert points to be relative to parent view
  
                  //save the points of the last touch
                  e.source.lastTouch = touchCoords;
                  self.touchStart = {x: touchCoords.x, y: touchCoords.y, objectCoordsX: objectDimensions.x, objectCoordsY: objectDimensions.y, internalCoordsX: e.x, internalCoordsY: e.y};
                  Ti.API.info("touchstart:  internal x/y: " + e.x + "/" + e.y + " (view x/y: " + touchCoords.x + "/" + touchCoords.y + ")");
  
              });
  
              images[i].addEventListener("touchmove", function(e) {
                  if(e.source.selected) {
                      // rotating
                      var parentCoords = e.source.convertPointToView({x: e.x, y: e.y}, self);
                      var xdiff = parentCoords.x - self.touchStart.x;
                      var ydiff = parentCoords.y - self.touchStart.y;
  
                      var rotate = Math.round(e.source.rotated) + Math.round(xdiff * 0.2); //slower rotating
  
                      Ti.API.info("xdiff: " + xdiff + " ydiff: " + ydiff + " rotate: " + rotate);
  
                      e.source.setTransform(Ti.UI.create2DMatrix({
                          rotate: rotate,
                          scale: e.source.scaled, //need this here to maintain the scaling if you have changed it prior to this event
                      }));
  
                      //get the rotation number to something within 360
                      while(rotate >=180) {
                          rotate = rotate - 360;
                      }
  
                      while(rotate <=-180) {
                          rotate = rotate + 360;
                      }
                      e.source.rotated = rotate;
                  } else {
                      //moving
                      if(pinching == false) {
  
                          //this is the location of the image
                          var currentLocation = e.source.rect;
                          var touchCoords = e.source.convertPointToView({x: e.x, y: e.y}, self);
  
                          var xdiff = Math.round(touchCoords.x - e.source.lastTouch.x);
                          var ydiff = Math.round(touchCoords.y - e.source.lastTouch.y);
                          Ti.API.info("xdiff: " + xdiff + " ydiff: " + ydiff);
  
                          //move the image according to how far x/y have moved since the last touch
                          //this is completely stupid, but its the only way I can get the image to move reliably after rotating it
                          topSlider.value = topSlider.value + ydiff;
                          leftSlider.value = leftSlider.value + xdiff;
  
                          //save the coordinates of the last touch
                          e.source.lastTouch = touchCoords;
                      }
                  }
              });
  
              images[i].addEventListener("touchend", function(e) {
                  pinching = false;
                  Ti.API.info("TOUCH END");
              });
  
              images[i].addEventListener("pinch", function(e) {
                  if(e.source.selected == false) {
                      pinching = true;
                      // var scale = e.source.scaled * e.scale;
                      var scale = e.scale;
                      // Ti.API.info("scale: " + scale + " e.scale: " + e.scale);
  
                      if(scale > 0.133) { // don't let it get too small
                          e.source.setTransform(Ti.UI.create2DMatrix({
                              scale: scale,
                              rotate: e.source.rotated, //need this here to maintain rotation
                          }));
                          e.source.scaled = scale;
                      }
                  }
              });
  
              images[i].addEventListener("doubletap", function(e) {
                  if(e.source.selected) {
                      e.source.selected = false;
                      e.source.setBorderColor("green");
                      e.source.setBorderWidth(0);
                  } else {
                      e.source.selected = true;
                      e.source.setBorderColor("green");
                      e.source.setBorderWidth(4);
                  }
              });
  

  I tried everything I could think of to get the dragging of images to work after rotation and nothing was reliable after a rotation / scale except these extra slider controls. You'll note they are positioned way off the screen so no one can see them

  I also have a randomize function that randomly scales, rotates, etc each image and the change events just couldn't keep up which is why I have separated the actions

  
          var leftSlider = Ti.UI.createSlider({
              top: -1000,
              min: -700,
              max: 800,
              value: (Titanium.Platform.displayCaps.platformWidth / 2) - (614/2),
              width: "50%",
          });
  
          leftSlider.addEventListener("change", function(e) {
              leftAction(e.value);
          });
  
          // this is not in the change event because it can't keep up with the updates with the randomize action
          var leftAction = function(value) {
              images[self.selectedIndex].left = value;
          }
  
          var topSlider = Ti.UI.createSlider({
              top: -1000,
              left: -1000,
              min: -600,
              max: 1000,
              value: (Titanium.Platform.displayCaps.platformHeight / 2) - (614/2),
              width: 400,
              transform: Ti.UI.create2DMatrix().rotate(90),
          });
  
          topSlider.addEventListener("change", function(e) {
              topAction(e.value);
          });
  
          // this is not in the change event because it can't keep up with the updates with the randomize action
          var topAction = function(value) {
              images[self.selectedIndex].top = value;
          }
  

  Hope this helps.

• Anybody?

• hi,

  i'd like rotate an image. can you tell me how are you did it, please?

• I have only tried to rotate images using the code below:

  using System.IO;
  using System.Drawing.Printing;
  using Yiigo.Imaging;
  using Yiigo.Imaging.Processing;
  
  // Rotate image to 90 degrees
  using YiigoImage Image = new YiigoImage();
  {
  string ImageID = (@"C:\ yiigo_example.jpg");
  RotateAngle Rotation = RotateAngle.90;
  }
  Image. YiigoImageProcessRotate(@"C:\ yiigo_example.jpg", RotateAngle.90);
  Image.save(@"C:\ yiigo_example.jpg");
  
  // Rotate image to 180 degrees
  using YiigoImage Image = new YiigoImage();
  {
  string ImageID = (@"C:\ yiigo_example.jpg");
  RotateAngle Rotation = RotateAngle.180;  
  }
  Image. YiigoImageProcessRotate(@"C:\ yiigo_example.jpg", RotateAngle.180);
  Image.save(@"C:\ yiigo_example.jpg");
  
  // Rotate image to 270 degrees
  using YiigoImage Image = new YiigoImage();
  {
  string ImageID = (@"C:\ yiigo_example.jpg");
  RotateAngle Rotation = RotateAngle.270;
  }
  Image. YiigoImageProcessRotate(@"C:\ yiigo_example.jpg", RotateAngle.270);
  Image.save(@"C:\ yiigo_example.jpg");
  

  Share with you. I hope it helps. Good luck.

  Best regards,
  Arron