How to rotate and resize the image view with single finger

Question

I am developing an app which has feature that resizing and rotating the imageview by dragging its bottom right corner button.

I saw one app which has feature that if we drag the bottom right corner button diagonally imageview size had resized or else if we drag the button left or right side direction imageview had rotated as per direction. I wish to implement this feature in my app

I am struggling to implement single finger rotation as well as resizing the imageview.

I could successfully implement resizing the imageview by dragging its bottom right corner button. But I do not have enough knowledge to add rotation to the image view

Please guide me in right way.

I have added the code below for resizing the image view by dragging its right corner.

- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event{
UITouch *touch = [[event allTouches] anyObject];

    touchStart = [[touches anyObject] locationInView:imageView];
    isResizingLR = (containerVw.bounds.size.width - touchStart.x < kResizeThumbSize && containerVw.bounds.size.height - touchStart.y < kResizeThumbSize);

}



- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event{
CGPoint touchPoint = [[touches anyObject] locationInView:imageView];
CGPoint previous=[[touches anyObject]previousLocationInView:imageView];

UITouch *touch = [[event allTouches] anyObject];


float  deltaWidth = touchPoint.x-previous.x;
float  deltaHeight = touchPoint.y-previous.y;


    if (isResizingLR) {
        containerVw.frame = CGRectMake(containerVw.frame.origin.x, containerVw.frame.origin.y,touchPoint.x + deltaWidth, touchPoint.y + deltaWidth); 
        imageView.frame = CGRectMake(imageView.frame.origin.x, imageView.frame.origin.y,touchPoint.x + deltaWidth, touchPoint.y + deltaWidth);                      
        dragIm.frame = CGRectMake(containerVw.frame.size.width-10, containerVw.frame.size.height-10,20,20);


    if (!isResizingLR) {
        containerVw.center = CGPointMake(containerVw.center.x + touchPoint.x touchStart.x,containerVw.center.y + touchPoint.y - touchStart.y);
    }
}

enter image description here

I saw one app. they have implemented this feature. i do not know how they have achieved. — thavasidurai, Sep 24 '12 at 14:37
@thavasidurai hey. code is really nice. but it implements rotate and resize on two separate views. i need on one view just like in image shown above. do you have any idea about how that can be achieved. — coder1010, Jun 11 '13 at 03:48
@coder1010 Please look at my answer, there would be sample code link there you can find the what you want. — thavasidurai, Jun 11 '13 at 07:01

Kim · Accepted Answer · 2013-06-21T01:28:03.937

I had hitted the same obstacle as yours, so I developed my own modules ZDStickerView. It would be nice reference.

First of all, be sure your view's autoresizingMask should be flexible.

    autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight

otherwise resizing wouldn't work properly.

Second, I recommends you to use "CGAffineTransformMakeRotation" and "atan2" functions to solve the rotation problem, like this:

    float ang = atan2([recognizer locationInView:self.superview].y - self.center.y,
                      [recognizer locationInView:self.superview].x - self.center.x);
    float angleDiff = deltaAngle - ang;
    self.transform = CGAffineTransformMakeRotation(-angleDiff);

Third, be sure to use relative coordinate, like this:

    self.transform = CGAffineTransformMakeRotation(-angleDiff);

I played with ZDStickerView, it is working like a charm i am expecting more controls like this from you.. — thavasidurai, Jun 18 '13 at 11:05
@thavasidurai Thanks :-) if you have any problem on ZDStickerView, give me an issue by github. — Kim, Jun 18 '13 at 14:30

thavasidurai · Answer 2 · 2013-06-13T10:54:43.697

5

I have fixed this issue and uploaded this control in cocoacontrols

http://www.cocoacontrols.com/controls/tdresizerview

And sample code

https://www.dropbox.com/s/yb0vzy0wao52bgt/SampeResizeView.zip

Updated answer

https://www.cocoacontrols.com/controls/zdstickerview

edited Jun 13 '13 at 10:54

answered Mar 28 '13 at 12:28

thavasidurai

1,972
1
26
51

score -1 · Answer 3 · edited Dec 07 '16 at 06:23

-1

This might help, https://github.com/zedoul/ZDStickerView.

IQStickerView with OneFingerRotation, Scale, Resize and Close feature.

Features:

One Finger Rotation Scale.
One Finger Resize.
Enable/Desable Rotation, Scale, Resize with properties.
Auto manage Multiple IQStickerView.
Can work with UIScrollView also.
Fast Responsiveness.

edited Dec 07 '16 at 06:23

Stargateur

24,473
8
65
91

answered Dec 07 '16 at 05:45

Aimul khattak

1
1

bogus third class library – Mehul Aug 07 '18 at 13:42

How to rotate and resize the image view with single finger

3 Answers3

Linked