Iphone: Page flipping animation - iphone

My code is flipping my view as if you were reading a book in reverse page order (right to left). I'm trying to achieve the opposite but I can't seem to figure out how to make the page flip from the other side of the views coordinate system.
Here's my code:
_memoryOneView.layer.anchorPoint = CGPointMake(1.0f, .5f);
_memoryOneView.layer.position = CGPointMake(_memoryOneView.layer.position.x + _memoryOneView.bounds.size.width/2.0f, _memoryOneView.layer.position.y);
[UIView animateWithDuration:.5 animations:^{
_memoryOneView.layer.transform = CATransform3DMakeRotation((M_PI / 2.0), 0, 1.0f, 0);
}];
I've tried making many of the values negative but this simply hides the animation behind views behind it. Any ideas? ty.
Edit I also need to be able to use this animation for dragging, meaning I need to have something I can easily transfer into code where the user is dragging to the next page.

iOS 5 has an in-built PageViewController exactly for this. Tutorial here: http://www.techotopia.com/index.php/An_Example_iOS_5_iPhone_UIPageViewController_Application

Related

Scroll tableview cell in cube effect in iOS?

Writing up an code for creating table view in such a manner when user scroll table view it behaves like cube. Please find below youtube link for the vision what I am asking for:
http://www.youtube.com/watch?v=hrBxHq83yKQ
Meanwhile, I tried with CATransform3D transform = CATransform3DMakeRotation(angle, 1, 0, 0); and it working for adding up an row at the top but not for scrolling.
Further, due to lack of knowledge of OpenGLES I can not go with it for rotating the cubes with touch gesture. Please suggest for the same as per your feasibility.
Look forward to hear from you.
check it out.. hope it helps you..
Link 1: https://www.cocoacontrols.com/controls/abcustomuinavigationcontroller
Link 2: https://github.com/augustjoki/CubeTabBarController
you can achieve this effects with Layer transform and a scrollview. To build a cube take a look at this post. You might add some overlays to your cube-sides to simulate lightning and you are done.
I got an answer for cubical scrolling. Earlier I was using below source code link:
GestureBasedTableViewDemo
Meanwhile, above tableview demo was using gesture and allow me to only add first row in tableview cell while scrolling down but my requirement was to have cubical scrolling up or down both.
Further, I tried with vertical iCarousel cylindrical and I achieved the vertical cubical scrolling. Thanks
You might also want to check our implementation of a gesture based 3D-cube over at Chubamobile:
http://www.chupamobile.com/products/details/2106/Cube+Selector/
It's fully featured, ready to use out of the box - and pretty much exactly what you want
Maybe it helps.
CATransition *animation = [CATransition animation];
animation.duration = 1;
animation.type = #"cube";
animation.subtype = #"fromRight";
[self.contentView.layer addAnimation:animation forKey:#"animation"];
[self.contentView bringSubviewToFront:view];
or that link http://www.albertopasca.it/whiletrue/objectivec-3d-view-rotation/
Don't dislike - there are few information about it.

Tracking UIView frame change animation

I have a UITextView that changes it's frame with the animateWithDuration:animations method:
[UIView animateWithDuration:1.5 animations:^{
[_textView setFrame:CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height - keyboardSize.height-25)];
}];
Is there any callback that helps me track the height of the UITextView as it animates?
There is no accurate way.
That's because the frame is just set directly. The animation takes care of the transition, but actually there is no transition.
There are some ways of estimating what is the current frame size and for me, the best is the simple math solution using a timer, when the animation started and the animation duration.
But, again, it's probably for the best if you just go another way, as this is certainly going to impact on your code cost and precision.
It's my first post and I don't really know anything that well, just learning and trying to help.
This depends on what you want to do with this thing.
If you want somehow accurate information about your frame, use the presentationLayer. This is a semi-accurate representation of what's actually on the screen. Note that this is in the coordinates of the view (bounds), so you need to convert it to the superview's coordinate system to get the current frame.
CGRect currentTextViewFrame = [_textView.superview convertRect:[_textView.layer.presentationLayer frame] fromView:_textView];
Note however this will be about one drawing loop or more off. If you are trying to base another animation off this it may be problematic and can cause flickering or other delay-induced effects. Also, at least the official documentation says this may not always be very fast and you may want to make the animation yourself if you need this information often due to performance reasons.
[_textView.layer.presentationLayer frame].size.height;
Credit belongs to this anwser.

Objective-c going down / up with acceleration

Im trying to make an animation of falling object that goes up when you touch the screen. That is not a problem if i want to use a linear velocity for this object, but i would better like it if it accelerated towards ground and when user touches screen it starts accelerating to the opposite direction. So lets suppose we have an object that goes 10px/s towards ground and when user touches screen i want it to have a = -5px/s^2 which means that even after touching screen, the object would still go down for another 2 seconds. Any idea how to do this in a "nice way" (right now im rewriting UIImageViews.frame every time with new CGRect but thats not really good way to do it i guess)?
Thanks
You can always use UIView animations:
[UIView animateWithDuration:1.0
delay:0.0 options:UIViewAnimationCurveEaseIn animations:^{
// put the co-ordinates you want your object to FINISH on in here
}
completion:^(BOOL finished){
}];
Any idea how to do this in a "nice way" (right now im rewriting
UIImageViews.frame every time with new CGRect but thats not really
good way to do it i guess)?
Use Core Animation. It's very easy to get started, and very powerful once you've gotten started. You can specify your own timing function, so you can give the appearance of acceleration. There's no reason for you to redraw your image view manually... Core Animation will do this for you more easily, and better.

CA animation of a UIView inside a UITableView. Like the one on iTunes

I've been checking this site for many of my questions before but this is the first time I actually have to ask someting, so I hope I can make myself clear enough.
I have an App which is nearly finish. The main functionallity is in up and running. I'm only concern in making the whole App visually appealing. The App is maninly a database wich scientifical relevant data. I want the user to be able to store custom data in the DB and to do that I've created a "contact-like" view where the user can save some data. The view contains a table and inside this table, the cell have UITextFields. After entering the data, when the user presses a button, I want to animate the content of the textField to a cabinet-like icon. Very much like when you purchase something in the iTunes on a iOS device.
I've been able to do that animation in a "static" view (not a UITableView), playing around with starting point, end point and so on is a bit of a pain in the neck, but doable after all.
I'm doing the animation in a not really conventional way, I think, but actually very effecive. On the press of the button I create a UILabel, I set the text as the text of the textField and then I use viewAnimationWithDuration block to animate the label. Inside the block I also use Core Animation to animate the layer of the label over a path. Again, not conventional, but straight forward.
The problem I'm having is that I'm not able to create the label over the textField since it is in a UITableView. Mainly the problem is to know the position (or frame, or bounds, or position. I'm really confused already) of the textField and hence, the starting position of the path.
The code I'm using is as follows:
-(IBAction)saveCustom:(id)sender{
UILabel *imageViewForAnimation = [[UILabel alloc] initWithFrame:CGRectMake(l1, l2, l3, l4)];
imageViewForAnimation.text=label.text;
imageViewForAnimation.alpha = 1.0f;
imageViewForAnimation.backgroundColor=[UIColor clearColor];
imageViewForAnimation.textColor=[UIColor blackColor];
imageViewForAnimation.adjustsFontSizeToFitWidth=YES;
[self.view addSubview:imageViewForAnimation];
[UIView animateWithDuration:10.0
delay:0.0
options:UIViewAnimationOptionCurveEaseInOut
animations:^{
// Set up path movement Core Animation begins
CAKeyframeAnimation *pathAnimation = [CAKeyframeAnimation animationWithKeyPath:#"position"];
CGPoint endPoint = CGPointMake(310, 380); // final point
CGMutablePathRef curvedPath = CGPathCreateMutable();
CGPoint rootViewPoint = [imageViewForAnimation convertPoint:imageViewForAnimation.center toView:taula];
CGPathMoveToPoint(curvedPath, NULL, rootViewPoint.x, rootViewPoint.y); // initial point
CGPathAddCurveToPoint(curvedPath, NULL, 100, 100, 100, 100, endPoint.x, endPoint.y);
pathAnimation.path = curvedPath;
CGPathRelease(curvedPath);
pathAnimation.fillMode=kCAFillModeForwards;
pathAnimation.removedOnCompletion=NO;
pathAnimation.duration=10.0f;
pathAnimation.delegate=self;
[imageViewForAnimation.layer addAnimation:pathAnimation forKey:#"savingAnimation"];
[imageViewForAnimation release];
//Core Animation ends
imageViewForAnimation.transform=CGAffineTransformMakeScale(0.60, 0.60);
// imageViewForAnimation.alpha=0.2;
}
completion:^(BOOL finished){
[imageViewForAnimation removeFromSuperview];
} ];
}
Any help on how to proceed will be much appreciated.
Thanks in advance!
UPDATE:
I went to the Apple Tech Talks in Berlin. In the labs they got, I asked an engineer about that. He wondered that the code I showed him didn't work. I emailed to him and he'll be back to me.
The key thing is to transform the coordinates from the table, to the view.
A UITableView shows a number of UITableViewCells. If you want to customize the controls displayed in a cell, you can add additional controls to the contentView of a UITableViewCell. Depending on how complicated your needs are, you would do this in the UITableViewDelegate or by subclassing UITableViewCell. Just be aware that adding subviews to contentView will likely interfere with the built-on controls (e.g. textLabel or detailTextLabel).
To position your additional controls or animation effects, you can check the bounds of the cell's contentView. Add your controls as subviews of contentView, animate them, and don't forget to remove them when you no longer need them.
Seems pretty conventional animation to me. And yes, effective.
As to a solution, you just need to save some state info when the user requests a save. And draw your animation label on top of the table. Should be no major problems there as long as you have a view available, super view of the table maybe?
Beyond that, how is your UI setup with respect to this table? How is the save custom activated (does the save all data or a specific field, do you have selected cell which you can access to pull the needed origin of your animation data)?
Also, don't forgot to release your UILabel after you add it as a subview, you are leaking it in the code above.

How can I replicate the trashing animation of Mail.app

In my iPhone app, I have put a UIBarBUtton of type UIBarButtonSystemItemTrash in my UIToolBar. When pressed, I'd like to replicate the animation of Mail.app: the bin opens, the UIView folds and flies into it.
Is there a way to access this animation ithrough the iPhone SDK?
Presently I am using a custom made animation, but there are some limits; for example, I cannot animate the bin itself.
Do you have any suggestion? Code samples?
Cheers,
Davide
Use the suckEffect type on an animation. Also: spewEffect, genieEffect, unGenieEffect, twist, tubey, swirl, cameraIris, cameraIrisHollowClose, cameraIrisHollowOpen, rippleEffect, charminUltra, zoomyIn, and zoomyOut. Doesn't work in the simulator.
CATransition *animation = [CATransition animation];
animation.type = #"suckEffect";
animation.duration = 2.0f;
animation.timingFunction = UIViewAnimationCurveEaseInOut;
view.opacity = 1.0f;
[view.layer addAnimation:animation forKey:#"transitionViewAnimation"];
Note: Code snippet was pulled from a larger codebase. I hope it works :)
Just to add some info:
You can use "suckEffect" with the standard +[UIView setAnimationTransition:forView:cache:]. Just pass the number 103 to the animationTransition variable. This won't avoid your app being rejected by Apple though :p
"spewEffect", "genieEffect", "unGenieEffect", etc. no longer exist on iPhoneOS 3.x. The only undocumented transition left are "cube" (--), "rippleEffect" (110), the three "cameraIris" effects (105,106,107) and "suckEffect" (103).
See http://www.iphonedevwiki.net/index.php?title=UIViewAnimationState for detail.
Also, to animate the bin (with private API): http://www.iphonedevwiki.net/index.php?title=UIToolbar#Animating_the_trash_can_icon.
Unfortunately, I think this is going to need to be an entirely custom animation. The UIView folding can be approximated using Core Animation, perhaps by adding perspective to the CATransform3D of the UIView's underlying layer to distort the UIView into a trapezoid which gets sucked into the trash can.
As far as the trash can, you can create a UIBarButtonItem using initWithCustomView:, which might let you insert a custom UIView that has an animatable trashcan. It looks like the trash can has two elements, the can base and the lid, which are rotated independently to open and close the can. Draw PNGs for both, make UIImageViews for them, and make them subviews of the UIBarButtonItem custom view. For opening and closing, apply rotational transforms to them to animate the subviews.
I'm not sure if this is an answer but here is lib that do "genie effect" so it's quite similar to what you want achieve.
CGRect endRect = CGRectMake(30, 40, 50, 60);
[view genieInTransitionWithDuration:0.7
destinationRect:endRect
destinationEdge:BCRectEdgeTop
completion:^{
NSLog(#"I'm done!");
}];