Question

I have an image view that I want to be able to move around, and pinch to stretch it. It’s all working, but it’s kinda jumpy when I start to do any pinch movements. The position will jump back and forth between the two fingers.

- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event 
{
    startLocation = [[touches anyObject] locationInView:mouth_handle];
    if([touches count] == 2) {
        NSArray *twoTouches = [touches allObjects];
        UITouch *first = [twoTouches objectAtIndex:0];
        UITouch *second = [twoTouches objectAtIndex:1];
        initialDistance = distanceBetweenPoints([first locationInView:mouth_handle],[second locationInView:mouth_handle]);
    }
}

- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event 
{
    CGPoint pt = [[touches anyObject] locationInView:mouth_handle];

    CGRect frame = [mouth_handle frame];

    frame.origin.x += pt.x - startLocation.x;
    frame.origin.y += pt.y - startLocation.y;

    frame.origin.x = (frame.origin.x < 58) ? 58 : frame.origin.x;
    frame.origin.x = (frame.origin.x > (260 - mouth_handle.frame.size.width)) ? (260 - mouth_handle.frame.size.width) : frame.origin.x;
    frame.origin.y = (frame.origin.y < 300) ? 300 : frame.origin.y;
    frame.origin.y = (frame.origin.y > 377) ? 377 : frame.origin.y;

    if(frame.origin.x - prevDistanceX > 2 && frame.origin.x - prevDistanceX < -2)
        frame.origin.x = prevDistanceX;
    if(frame.origin.y - prevDistanceY > 2 && frame.origin.y - prevDistanceY < -2)
        frame.origin.y = prevDistanceY;

    prevDistanceX = frame.origin.x;
    prevDistanceY = frame.origin.y;

    CGFloat handleWidth = mouth_handle.frame.size.width;

    if([touches count] == 2) {
        NSArray *twoTouches = [touches allObjects];
        UITouch *first = [twoTouches objectAtIndex:0];
        UITouch *second = [twoTouches objectAtIndex:1];
        CGFloat currentDistance = distanceBetweenPoints([first locationInView:mouth_handle],[second locationInView:mouth_handle]);

        handleWidth = mouth_handle.frame.size.width + (currentDistance - initialDistance);
        handleWidth = (handleWidth < 60) ? 60 : handleWidth;
        handleWidth = (handleWidth > 150) ? 150 : handleWidth;
        if(initialDistance == 0) {
            initialDistance = currentDistance;
        }

        initialDistance = currentDistance;
    }

    mouth_handle.frame = CGRectMake(frame.origin.x, frame.origin.y, handleWidth, 15);
}

Any thoughts on how to make this smoother?

Answer 1

By jumping between the fingers, do you mean that you can’t distinguish between the first and the second finger?

What I would do is calculate the angle between the fingers. By angle I mean that if you would draw a circle with one touch as the center and the other on the edge of the circle, you could determine the angle between the point right above the first touch and the second touch.
If the angle difference between two events is bigger than .5Pi (1/4 circle) you can assume the touches got switched and you could correct for that.

I hope you understand what I mean.