使用UIPinchGestureRecognizer在单向上缩放uiviews [英] Using UIPinchGestureRecognizer to scale uiviews in single direction
问题描述
我想知道我们如何使用 UIPinchGestureRecognizer 在单个（x或y）方向上缩放 UIView 单独。比如，如果用户仅在单个方向（水平）上以捏合手势移动他的两个手指，则仅uiview的宽度应该增加/减小，并且如果手指仅垂直移动，则高度应该改变。如果手指沿对角线移动，则uiview的高度和宽度都应增加/减少。我已经看过Apple的MoveMe示例代码。
I would like to know how we can use UIPinchGestureRecognizer to scale UIView in single (x or y) directions alone. Say, if the user moves his two fingers in a pinch gesture only in a single direction (horizontal), only the width of the uiview should increase/decrease and if the fingers are moved only vertically, the height should change. If the fingers move diagonally, then both height and width of uiview should increase/decrease. I have seen the MoveMe sample code from Apple.
UIPinchGestureRecognizer *pinchGesture = [[UIPinchGestureRecognizer alloc] initWithTarget:self action:@selector(scalePiece:)];
[pinchGesture setDelegate:self];
[piece addGestureRecognizer:pinchGesture];
[pinchGesture release];
比例片段：
- (void)scalePiece:(UIPinchGestureRecognizer *)gestureRecognizer
{
UIView *piece = (UIView *) [gestureRecognizer view];
NSLog(@"scalePiece enter");
if ([gestureRecognizer state] == UIGestureRecognizerStateBegan){
NSLog(@"inside if");
lastTouchPosition = [gestureRecognizer locationInView:piece];
}
else if ([gestureRecognizer state] == UIGestureRecognizerStateBegan || [gestureRecognizer state] == UIGestureRecognizerStateChanged){
NSLog(@"inside else");
CGPoint currentTouchLocation = [gestureRecognizer locationInView:piece];
NSLog(@"currentTouchLocation = %@ and lastTouchPosition= %@",NSStringFromCGPoint(currentTouchLocation), NSStringFromCGPoint(lastTouchPosition));
CGPoint deltaMove = [self calculatePointDistancewithPoint1:currentTouchLocation andPoint2:lastTouchPosition];
NSLog(@"deltaMove = %@",NSStringFromCGPoint(deltaMove));
float distance = sqrt(deltaMove.x*deltaMove.x + deltaMove.y*deltaMove.y);
NSLog(@"distance = %f",distance);
float hScale = 1 - deltaMove.x/distance * (1-gestureRecognizer.scale);
float vScale = 1 - deltaMove.y/distance * (1-gestureRecognizer.scale);
if (distance == 0) {
hScale = 1;
vScale = 1;
}
NSLog(@"[gestureRecognizer scale] = %f",[gestureRecognizer scale]);
NSLog(@"hScale = %f and vScale = %f",hScale, vScale);
piece.transform = CGAffineTransformScale([piece transform], hScale, vScale);
[gestureRecognizer setScale:1];
lastTouchPosition = currentTouchLocation;
}
NSLog(@"scalePiece exit");
}
计算距离：
- (CGPoint) calculatePointDistancewithPoint1:(CGPoint)point1 andPoint2:(CGPoint) point2 {
return CGPointMake(point2.x - point1.x, point2.y - point1.y);
}
当我尝试捏出（放大）时，这是日志输出视图只能在垂直方向上移动我的手指。元素的高度不会增加。
This is the log output when I try to pinch out (zoom into) of the view only moving my fingers in a vertical direction. The element's height does not increase.
2011-07-21 13:06:56.245 New[8169:707] scalePiece enter
2011-07-21 13:06:56.248 New[8169:707] inside if
2011-07-21 13:06:56.251 New[8169:707] scalePiece exit
2011-07-21 13:06:56.259 New[8169:707] scalePiece enter
2011-07-21 13:06:56.262 New[8169:707] inside else
2011-07-21 13:06:56.264 New[8169:707] currentTouchLocation = {88, 87} and lastTouchPosition= {87, 86}
2011-07-21 13:06:56.265 New[8169:707] deltaMove = {-1, -1}
2011-07-21 13:06:56.267 New[8169:707] distance = 1.414214
2011-07-21 13:06:56.268 New[8169:707] [gestureRecognizer scale] = 1.102590
2011-07-21 13:06:56.271 New[8169:707] hScale = 0.927458 and vScale = 0.927458
2011-07-21 13:06:56.272 New[8169:707] scalePiece exit
2011-07-21 13:06:56.281 New[8169:707] scalePiece enter
2011-07-21 13:06:56.283 New[8169:707] inside else
2011-07-21 13:06:56.284 New[8169:707] currentTouchLocation = {87, 89} and lastTouchPosition= {88, 87}
2011-07-21 13:06:56.286 New[8169:707] deltaMove = {1, -2}
2011-07-21 13:06:56.287 New[8169:707] distance = 2.236068
2011-07-21 13:06:56.296 New[8169:707] [gestureRecognizer scale] = 1.096172
2011-07-21 13:06:56.298 New[8169:707] hScale = 1.043009 and vScale = 0.913981
2011-07-21 13:06:56.299 New[8169:707] scalePiece exit
2011-07-21 13:06:56.302 New[8169:707] scalePiece enter
2011-07-21 13:06:56.303 New[8169:707] inside else
2011-07-21 13:06:56.305 New[8169:707] currentTouchLocation = {88, 89} and lastTouchPosition= {87, 89}
2011-07-21 13:06:56.309 New[8169:707] deltaMove = {-1, 0}
2011-07-21 13:06:56.311 New[8169:707] distance = 1.000000
2011-07-21 13:06:56.313 New[8169:707] [gestureRecognizer scale] = 1.066320
2011-07-21 13:06:56.314 New[8169:707] hScale = 0.933680 and vScale = 1.000000
2011-07-21 13:06:56.316 New[8169:707] scalePiece exit
2011-07-21 13:06:56.318 New[8169:707] scalePiece enter
2011-07-21 13:06:56.320 New[8169:707] inside else
2011-07-21 13:06:56.329 New[8169:707] currentTouchLocation = {88, 90} and lastTouchPosition= {88, 89}
2011-07-21 13:06:56.331 New[8169:707] deltaMove = {0, -1}
2011-07-21 13:06:56.333 New[8169:707] distance = 1.000000
2011-07-21 13:06:56.334 New[8169:707] [gestureRecognizer scale] = 1.061696
2011-07-21 13:06:56.335 New[8169:707] hScale = 1.000000 and vScale = 0.938304
2011-07-21 13:06:56.338 New[8169:707] scalePiece exit
2011-07-21 13:06:56.343 New[8169:707] scalePiece enter
2011-07-21 13:06:56.346 New[8169:707] inside else
2011-07-21 13:06:56.347 New[8169:707] currentTouchLocation = {88, 92} and lastTouchPosition= {88, 90}
2011-07-21 13:06:56.349 New[8169:707] deltaMove = {0, -2}
2011-07-21 13:06:56.350 New[8169:707] distance = 2.000000
2011-07-21 13:06:56.351 New[8169:707] [gestureRecognizer scale] = 1.096869
2011-07-21 13:06:56.353 New[8169:707] hScale = 1.000000 and vScale = 0.903131
2011-07-21 13:06:56.362 New[8169:707] scalePiece exit
2011-07-21 13:06:56.366 New[8169:707] scalePiece enter
2011-07-21 13:06:56.370 New[8169:707] inside else
2011-07-21 13:06:56.373 New[8169:707] currentTouchLocation = {88, 92} and lastTouchPosition= {88, 92}
2011-07-21 13:06:56.376 New[8169:707] deltaMove = {0, 0}
2011-07-21 13:06:56.380 New[8169:707] distance = 0.000000
2011-07-21 13:06:56.383 New[8169:707] [gestureRecognizer scale] = 1.035330
2011-07-21 13:06:56.387 New[8169:707] hScale = 1.000000 and vScale = 1.000000
2011-07-21 13:06:56.389 New[8169:707] scalePiece exit
2011-07-21 13:06:56.393 New[8169:707] scalePiece enter
2011-07-21 13:06:56.397 New[8169:707] inside else
2011-07-21 13:06:56.399 New[8169:707] currentTouchLocation = {88, 93} and lastTouchPosition= {88, 92}
2011-07-21 13:06:56.403 New[8169:707] deltaMove = {0, -1}
2011-07-21 13:06:56.406 New[8169:707] distance = 1.000000
2011-07-21 13:06:56.409 New[8169:707] [gestureRecognizer scale] = 1.042659
2011-07-21 13:06:56.412 New[8169:707] hScale = 1.000000 and vScale = 0.957341
2011-07-21 13:06:56.414 New[8169:707] scalePiece exit
2011-07-21 13:06:56.419 New[8169:707] scalePiece enter
2011-07-21 13:06:56.422 New[8169:707] inside else
2011-07-21 13:06:56.425 New[8169:707] currentTouchLocation = {88, 92} and lastTouchPosition= {88, 93}
2011-07-21 13:06:56.427 New[8169:707] deltaMove = {0, 1}
2011-07-21 13:06:56.430 New[8169:707] distance = 1.000000
2011-07-21 13:06:56.432 New[8169:707] [gestureRecognizer scale] = 1.024549
2011-07-21 13:06:56.436 New[8169:707] hScale = 1.000000 and vScale = 1.024549
2011-07-21 13:06:56.439 New[8169:707] scalePiece exit
2011-07-21 13:06:56.442 New[8169:707] scalePiece enter
2011-07-21 13:06:56.447 New[8169:707] inside else
2011-07-21 13:06:56.450 New[8169:707] currentTouchLocation = {88, 92} and lastTouchPosition= {88, 92}
2011-07-21 13:06:56.453 New[8169:707] deltaMove = {0, 0}
2011-07-21 13:06:56.455 New[8169:707] distance = 0.000000
2011-07-21 13:06:56.458 New[8169:707] [gestureRecognizer scale] = 1.007702
2011-07-21 13:06:56.460 New[8169:707] hScale = 1.000000 and vScale = 1.000000
2011-07-21 13:06:56.464 New[8169:707] scalePiece exit
2011-07-21 13:06:56.501 New[8169:707] scalePiece enter
2011-07-21 13:06:56.504 New[8169:707] inside else
2011-07-21 13:06:56.507 New[8169:707] currentTouchLocation = {89, 92} and lastTouchPosition= {88, 92}
2011-07-21 13:06:56.509 New[8169:707] deltaMove = {-1, 0}
2011-07-21 13:06:56.510 New[8169:707] distance = 1.000000
2011-07-21 13:06:56.511 New[8169:707] [gestureRecognizer scale] = 1.000283
2011-07-21 13:06:56.513 New[8169:707] hScale = 0.999717 and vScale = 1.000000
2011-07-21 13:06:56.517 New[8169:707] scalePiece exit
2011-07-21 13:06:56.566 New[8169:707] scalePiece enter
2011-07-21 13:06:56.570 New[8169:707] inside else
2011-07-21 13:06:56.572 New[8169:707] currentTouchLocation = {89, 91} and lastTouchPosition= {89, 92}
2011-07-21 13:06:56.573 New[8169:707] deltaMove = {0, 1}
2011-07-21 13:06:56.575 New[8169:707] distance = 1.000000
2011-07-21 13:06:56.576 New[8169:707] [gestureRecognizer scale] = 1.008267
2011-07-21 13:06:56.579 New[8169:707] hScale = 1.000000 and vScale = 1.008267
2011-07-21 13:06:56.582 New[8169:707] scalePiece exit
2011-07-21 13:06:56.585 New[8169:707] scalePiece enter
2011-07-21 13:06:56.586 New[8169:707] inside else
2011-07-21 13:06:56.588 New[8169:707] currentTouchLocation = {89, 91} and lastTouchPosition= {89, 91}
2011-07-21 13:06:56.589 New[8169:707] deltaMove = {0, 0}
2011-07-21 13:06:56.591 New[8169:707] distance = 0.000000
2011-07-21 13:06:56.597 New[8169:707] [gestureRecognizer scale] = 1.000000
2011-07-21 13:06:56.599 New[8169:707] hScale = 1.000000 and vScale = 1.000000
2011-07-21 13:06:56.600 New[8169:707] scalePiece exit
2011-07-21 13:06:56.603 New[8169:707] scalePiece enter
2011-07-21 13:06:56.604 New[8169:707] inside else
2011-07-21 13:06:56.606 New[8169:707] currentTouchLocation = {89, 182} and lastTouchPosition= {89, 91}
2011-07-21 13:06:56.607 New[8169:707] deltaMove = {0, -91}
2011-07-21 13:06:56.617 New[8169:707] distance = 91.000000
2011-07-21 13:06:56.620 New[8169:707] [gestureRecognizer scale] = 1.000000
2011-07-21 13:06:56.623 New[8169:707] hScale = 1.000000 and vScale = 1.000000
2011-07-21 13:06:56.626 New[8169:707] scalePiece exit
2011-07-21 13:06:56.630 New[8169:707] scalePiece enter
2011-07-21 13:06:56.632 New[8169:707] scalePiece exit
推荐答案
如果我理解你的问题，你的目标是沿水平和垂直轴进行非比例缩放。在这种情况下，事情归结为提供你的仿射变换：
If I understand correctly your question, you are aiming at having non-proportional scaling along the horizontal and vertical axis. In this case, the thing comes down to providing your affine transform:
piece.transform = CGAffineTransformScale([piece transform], hScale, vScale);
具有不同的比例因子。
一个计算它们的方法如下：
One way to calculate them is the following:
-
在类中定义一个ivar来存储
lastTouchPosition;
在您的手势处理程序中，您将执行以下操作：
in your gesture handler you will do something like this:
if ([gestureRecognizer state] == UIGestureRecognizerStateBegan){
lastTouchPosition = [gestureRecognize locationInView:yourViewHere];
hScale = 1;
vScale = 1;
} else if ([gestureRecognizer state] == UIGestureRecognizerStateBegan || [gestureRecognizer state] == UIGestureRecognizerStateChanged){
CGPoint currentTouchLocation = [gestureRecognize locationInView:yourViewHere];
CGPoint deltaMove = CGPointDistance(currentTouchLocation, lastTouchPosition);
float distance = sqrt(deltaMove.x*deltaMove.x + deltaMove.y*deltaMove.y);
hScale -= abs(deltaMove.x)/distance * (1-gestureRecognizer.scale);
vScale -= abs(deltaMove.y)/distance * (1-gestureRecognizer.scale);
piece.transform = CGAffineTransformScale([piece transform], hScale, vScale);
[gestureRecognizer setScale:1];
lastTouchPosition = currentTouchLocation;
}
另一种方式做的是：
if ([gestureRecognizer state] == UIGestureRecognizerStateBegan){
lastTouchPosition = [gestureRecognize locationInView:yourViewHere];
} else if ([gestureRecognizer state] == UIGestureRecognizerStateBegan || [gestureRecognizer state] == UIGestureRecognizerStateChanged){
CGPoint currentTouchLocation = [gestureRecognize locationInView:yourViewHere];
CGPoint deltaMove = CGPointDistance(currentTouchLocation, lastTouchPosition);
float distance = sqrt(deltaMove.x*deltaMove.x + deltaMove.y*deltaMove.y);
float hScale = 1 - abs(deltaMove.x)/distance * (1-gestureRecognizer.scale);
float vScale = 1 - abs(deltaMove.y)/distance * (1-gestureRecognizer.scale);
piece.transform = CGAffineTransformScale([piece transform], hScale, vScale);
lastTouchPosition = currentTouchLocation;
}
这不会在每次迭代时存储当前的 hFloat 和 vFloat 而是依赖于 gestureRecognizer 将累积整体规模变化的事实。它执行绝对计算，而第一个实现执行相对计算。
This will not store at each iteration the current hFloat and vFloat and instead rely on the fact that the gestureRecognizer will accumulate the overall scale change. It does an "absolute" calculate, while the first implementation does a "relative" one.
请注意，您还需要定义 CGPointDistance 计算两次触摸之间的距离，并选择您将用于计算距离的视图（ yourViewHere ）。
Note that you need also define CGPointDistance to calculate the distance between the two touches and choose which view are your going to use to calculate the distance (yourViewHere).
编辑：
CGPoint CGPointDistance(CGPoint point1, CGPoint point2)
{
return = CGPointMake(point2.x - point1.x, point2.y - point1.y);
};
EDIT2：关于计算比例的公式
about the formula to calculate the scaling
这个想法是计算比例因子的变化，并根据它们的相对变化将它应用于两个方向（x和y）。
The idea is calculating the variation in the scale factor and apply it to the two directions (x and y) according to their relative variations.
-
比例因子delta为：
1-gestureRecognizer.scale;
delta乘以一个因子，使其与水平轴或垂直轴的位移成比例;当位移为零时，三角尺度也为零;当位移沿两轴相等时，刻度差也沿两轴相等;我决定除以距离，但还有其他可能性（比如除以两个deltaMoves的总和或deltaMoves的最大值等）。
the delta is the multiplied by a factor so that it is somehow proportional to the displacement along the horizontal or vertical axis; when the displacement is zero, the delta scale is also zero; when the displacement is equal along the two axis, the scale delta is also equal along the two axis; I decided to divide by the distance, but there are other possibilities (like dividing by the sum of the two deltaMoves or by the max of the deltaMoves, etc).
最终从元素的当前比例中减去调整后的差值。
the adjusted delta is finally subtracted from the current scale of the element.
这篇关于使用UIPinchGestureRecognizer在单向上缩放uiviews的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
