Creating a custom Transition that zooms into circle view - ios

I am trying to create a custom iOS 7 Transition. At present I have a simple circle view like this:
I have a gesture recogniser on the custom view. When clicked the custom transition delegate is called
`-[CCZTTransitionDelegate animationControllerForPresentedController:presentingController:sourceController:]`
Which in turn calls the two methods on the transition animating class:
-[CCZTAnimatedTransitioning transitionDuration:]
-[CCZTAnimatedTransitioning animateTransition:]
At present I have just made the second controller zoom in and that is all working fine...
Desired Effect
What I would like to do when the circle is tapped is
1. have the circle increase in size until the screen is completed covered with its color.
2. Fade the second controller in
What is the best way to complete step 1? Can this be completed in the transition delegate/transition animating methods?
In this method - (void)animateTransition:(id<UIViewControllerContextTransitioning>)transitionContext it looks like I have access to the view controllers but not the subview. Should the animation be done before somehow if so how?
Note: In time there will eventually be a group of the circles not just one.
EDIT:
It is also important to note that I am actually trying to zoom in from the center of the circle. So if the circle is positioned elsewhere (i.e. when there are more) the circle should zoom in/increase in size from its own center point.

Try using a CGAffineTransformScale animation on the circle view and expand it to fill the entire view. Once that is done scaling up (either through the UIView animation completion block or by using UIViewKeyFrameAnimation), present your next view controller behind the filled in view. Once presented, fade out the view to reveal the newly presented view controller by alpha-ing down the view in an animation block.

Related

Slide view from bottom in and blur rest

I want to have a view sliding in from the bottom, but the height of this view-element is just about the half of the screen height. The upper part of the screen should blur out.
I am very new to building ios-Apps and I wonder what is the best approach to do this.
Should I use viewElements in the same ViewController and just let them slide in etc. or is there some build-in functionality which I can use?
You can do two things:
define a custom interactive viewcontroller transition, that way you can add a blur view in the background and bind the offset of the scroll up to the blur effect to animate the change.
(I think this is a lot easier to implement, but less reusable) embed a container view in your viewcontroller, add a pan gesture recognized on the view and as you pull your finger up, animate e.g. the bottom constraint's constant to move the view up and do the same with the background as described in step 1

How do I add an overlay that does not move with the map to a GMSMapView?

I'm trying add a crosshair in the middle of a GMSMapView. The crosshair will not move with the map as the user pans it. It will move with the camera.
I looked at the google maps guide but it doesn't seem to talk about the kind of overlays I'm interested in. What it says is just adding overlays and shapes that moves with the map.
Therefore, I tried to come up with something on my own. I tried to add an UIImageView on top of the map view he storyboard. (Note that both the image view and the map view is in the storyboard and they are both direct subviews of the view that the VC controls)
When I run the app, I did not see the crosshair anywhere on the map. I looked at the UI hierarchy and saw this:
The little view is the image view with the crosshair, and as you can see there are 3 more views in front of it. I think this is why the crosshair did not show. The three views are, from right to left: GMSVectorMapView, GMSUISettingsPaddingView and GMSUISettingsView.
I have not idea how to bring the image view to front. I tried bring it to front by calling bringSubview(toFront:). I tried to call this in both viewDidLoad and viewDidAppear but it did nothing in both times.
How can I make such an overlay work?
You can use zPosition to achieve this
YourView.layer.zPosition = 1
by doing this you will put your view's layer to the frontmost position, but not the view itself. So position of the view won't change.
self.view.bringSubview(toFront: YourView)
Should also work, it's probably juat a timing problem.

Adding an overlay UIView that will scale down the underlay view

I have a UITableView and I would like that when they enter a certain area of the device, the cells' content view would appear to be reduced.
Only the part of the cell in this area would be scaled down. How can I achieve that?
I guess it has to use a UIView as an overlay view and apply a transform somehow to the underlying view that crosses it but I have no idea how to do it.
You can take a snapshot of the cell in question (before you leave the table view) by calling snapshotViewAfterScreenUpdates: with argument false on the cell. Now, as you say, you do whatever you want with the resulting snapshot view, including transforming it to be smaller.
Moreover, you can place the snapshot view into the interface and animate the change in its transform as part of the transition to the next view controller. That's what Apple is doing, for instance, in the Calendar app, when a year zooms into a month.

Changing the alpha of a view over a region

I have a view that takes a pan gesture. So that view can translate. I gradually want to change the alpha of the view taking the pan gesture from 1.0 to 0.0 as it is moving close to another view so that there is no abrupt overlapping of the frames of two views. How can i achieve this?
I do not think there is a method for assigning different alpha value to different region of a single view.
As a workaround, you can have an overlay view with same color as the background, or set an image on the view which has gradually increasing alpha and allow the target view to slide under this overlay view.
You have to do some work in a CALayer, Check the answer by #robmayoff from below SO question, I think it could help:
How to apply partial fade in-out in IOS?

Moving UIView and subviews periodically

I am building a word tetris kind of an app. Now I have to move a Uiview containing 8 uibuttons towards the bottom of the screen based on time and also track the position of uibuttons as the user taps specified button.
Am I suppose to use Block based animation or core animation to do the task.
Currently if I am animating frame and center of superview it seems like I have to do the same for the subviews as well inside the block.
Any input would be handy.
You can use UIView block animation to animate a view and it's subviews quite simply.
However, neither UIView animation nor core animation will let the user click on buttons as they are animating. Button actions don't work at all on "in flight" animations. There's no automatic way to do that. (At least none that I know of.)
Instead, you have to add a tap gesture recognizer to the parent view, and do hit testing on the presentation layer of your parent view to see which sublayer of the presentation layer is tapped.

Resources