I have a UIImageView that I've added a PinchGestureRecognizer to. Currently, the image is resized nicely when pinching, but I want to be able to resize the image without maintaining the aspect ratio. So if the user pinches horizontally, the image view's width would enlarge; if they pinch vertically, the height would enlarge and so forth.
Can anyone give me a hint on how I could do that please?
Write a custom gesture recognizer that requires two fingers to be on screen.
Once both fingers are on screen store their offset to the imageView's border in some UIEdgeInsets.
In touchesMoved, check if both fingers are onscreen: if so, calculate the new frame by applying the edgeInsets in the current touch position.
Header: click
Implementation: click
Works well and feels more natural than other implementations I've seen.
You would need to do the touch handling yourself as UIPinchGestureRecognizer only supports one scale which has no concept of being pinched horizontally or vertically.
You could create your own subclass of UIGestureRecognizer (see here for docs) which looked at the horizontal and vertical separation of the touch points to determine 2 different scales. It should be fairly straightforward to create I would have thought. Just look at the initial touch points and then when they move, calculate the difference in the current separation of the touches to the initial separation of the touches, in both the vertical and horizontal directions.
Related
I know how to use a background image with alpha channel to create a UIButton with an irregular tap area. But with this solution, only the ignore-tap area is transparent; the tap area consists of the opaque.
What I want is a totally transparent UIButton, with an irregular tap area. (It triggers an animation behind the button.)
It seems that some sort of extra UILayer with some hit-testing could work, but I don't quite see how. Suggestions welcome.
Here's my solution. The problem: A UIImageView (call it the base view) to which I want to attach an irregularly-shaped tap area. The area corresponds to something in the image, let's call it a river. It could be a non-connected region.
In the Finder, duplicate the view's image, and make all the non-river pixels transparent, using your favorite graphics app. Call this the mask image.
When the base view is tapped, check to see if the corresponding pixel in the mask image is or is not transparent. (Solution left to reader; examples abound.)
So the mask image is never actually rendered, it is just used as a reference.
Note that if the base view gets resized or moved around (as it does in my app, via animating its constraints) then you have to "move" the mask image too, or in some other way manage the coordinate translation between view and mask. The easiest way to do this is to make the mask image a hidden subview of the base view, with its left, top, leading and trailing anchors constrained to be equal to those of the base view. Then they move around together, and the coord translation between the two is the identity.
I wrapped all this up in a subclass of UIImageView so that it manages its own mask, and calls a delegate if the "river" (or whatever) is tapped.
I'm building chat application for Mac OS, similar to iMessage. I wonder, how can I implement resizable text views in bubbles. I mean, when I resize chat window bubbles with text will resize to. Any ideas, links will be very useful. Thank you for help)
For text resizing, you use auto layout. If you have an NSScrollView containing MYBubbleViews containing NSTextViews, you can add NSLayoutConstraints using the leftAnchor and rightAnchor properties of the scroll view's content view and those of the bubble view, and add constraints between all edges of the text view and bubble view. Then pin the bubble views to the top/prev view.
Also make sure you set the NSTextView to wrap. The width of the intrinsic size of the text view will be set so that it fills the width and the intrinsic height will be set to fit the whole text.
I previously thought it was about drawing the bubbles, so I first gave this answer:
If you look at Messages.app, you'll see that they're not circular bubbles. They are basically composed of several shapes overlaid on each other. A rectangle with rounded corners, plus a bezier path of the tip.
So you should be able to take a NSTextView for the text, make it a subview of a custom view that draws a rounded rectangle and the tip in its drawRect method, and then use auto layout constraints to make your bubble view resize with the text view and the text view to the window width.
You could probably also have the bubble view host a CALayer with fill and rounded corners, plus one with an image for the tip (or aCAShapeLayer for the tip), but drawRect is the easier approach.
I have an image view that looks like a wheel. This view detects touch events on each of the colored sections.
The problem I have is that when I rotate this wheel, the UILabels on top of the view need to also be rotated so that the text is still horizontal and human readable.
What is the best way to rotate the labels while the parent view is being rotated?
This is what I am trying now and it does not rotate correctly...
CGAffineTransform textTransform = CGAffineTransformRotate(newTransform, newAngle * -1);
Presumably you are applying a rotation transform to rotate the wheel. If the labels are subviews of the wheel view, their centers are pinned in the right places to the wheel (because a view is located in its superview by its center), and they will travel around with it. At the same time, apply the inverse rotation transform to the labels. The rotation takes place around the center of each label. So each label stays in the right place and stays upright.
An afterthought - also make sure you're not using autolayout on these labels. Autolayout breaks view transforms.
I have an image inside a UIScrollView. What I want to happen is if I zoomed in to a particular position, I want to disable the scrolling (both vertical and horizontal) so that it will remain on the zoomed area. Can you give me any ideas on how to do this?
Two things to keep in mind:
Make sure you are exactly where you want when you need to disable the scroll. (you can use some methods from the UIScrollViewDelegate to accomplish that).
Make the contentSize of your UIScrollView the same size of your frame. This way both the horizontal and the vertical scroll will be disable.
CGRect myScrollViewRect = myScrollView.frame;
CGSize myScrollViewFrameSize = CGSizeMake(myScrollViewRect.frame.size.width, myScrollViewRect.frame.size.height);
myScrollView.contentSize = myScrollViewFrameSize;
For clarity I putted more code than you would normally need to.
The scenario:
I have a custom view (a subclass of UIView) that draws a game board. To enable the ability to zoom into, and pan around, the board I added my view as a subview of UIScrollView. This kind of works, but the game board is being rendered incorrectly. Everything is kind of fuzzy, and nothing looks right.
The question:
How can I force my view to be redrawn correctly ay varying scales? I'm providing my view with the current scale and sending it a setNeedsDisplay message after the scroll view is done zooming in/out, but the game board is still being rendered incorrectly. My view should be redrawing the game board depending on the zoom level, but this isn't happening. Does the scroll view perform a generic transformation on subviews? Is there a way to disable this behavior?
The easiest way to do this is to render your game board at a really high resolution, then let the ScrollView handle scaling it down to your display size automatically.
Basically, set the contentSize of your ScrollView to something big (say 1024x1024), and make your game board one giant view inside it, of the same size (say 1024x1024). Then simply let the ScrollView handle all the scaling questions. You don't even need to intercept setNeedsDisplay or anything; as far as your game is concerned, it's just always rendering at the highest resolution.