Core-Plot iPhone Animation Examples - iphone

I've been looking into core-plot for the iPhone and I'm having trouble finding any examples of animation actually being used.
What I need to see is an example of how to use core-plots animation to add an extra plot to a graph when someone clicks a button.
If anyone can produce and example, or show me a link to one, that would be great.
Regards,
Craig

The official CPAnimation classes within Core Plot are just stubs right now. At some point, we'll enable the full functionality of those.
In the meantime, every visible element in Core Plot is a Core Animation CALayer, so you can animate these using existing Core Animation methods. For example, if you have a plot called dataSourceLinePlot (like in the test Core Plot iPhone application), you could start the plot off with an opacity of 0.0:
dataSourceLinePlot.opacity = 0.0f;
[graph addPlot:dataSourceLinePlot];
and then animate its opacity to fade it in:
CABasicAnimation *fadeInAnimation = [CABasicAnimation animationWithKeyPath:#"opacity"];
fadeInAnimation.duration = 1.0f;
fadeInAnimation.removedOnCompletion = NO;
fadeInAnimation.fillMode = kCAFillModeForwards;
fadeInAnimation.toValue = [NSNumber numberWithFloat:1.0];
[dataSourceLinePlot addAnimation:fadeInAnimation forKey:#"animateOpacity"];
This will fade in a new plot on an existing graph over a one second interval. You could also do something similar to animate it in from a side or use a transform to scale it up into position. CATransitions could also be used to achieve these kind of effects.
EDIT (1/17/2010): The Core Plot iPhone test application now contains an example of the fade-in animation described above.

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.

Animating Background image /layer in iPhone

I started working on sample application, where I have some objects(images) which are animated on a UIView. I would like to have a background image which also should animate along with these objects.Two animations should happen at the same time. The background image occupies all the screen space and on the top of this the other images should be animated. Could someone guide me to achieve this.
I tried the following things mentioned in the link below.
for (int i = 0; i < IMAGE_COUNT; i++)
[_imageArray addObject:[UIImage imageNamed:[NSString stringWithFormat:#"D%d.png", i]]];
_animatedImages = [[UIImageView alloc]
initWithFrame:CGRectMake(
(SCREEN_WIDTH / 2) - (IMAGE_WIDTH / 2),
(SCREEN_HEIGHT / 2) - (IMAGE_HEIGHT / 2) + STATUS_BAR_HEIGHT,
IMAGE_WIDTH, IMAGE_HEIGHT)];
_animatedImages.animationImages = [NSArray arrayWithArray:_imageArray];
_animatedImages.animationDuration = 1.0;
_animatedImages.animationRepeatCount = -1;
The iPhone Game Background as Video or Animated Image?
But two animations are happening independently. I would like to animate the objects on the top of background image which also need to be animated.If this is not possible can I use layers or some other object to achieve this.Please suggest.
It seems like `UIImageView' provides no way to control the time the animation begins.
There is such an API, but it's in lower level CoreAnimation framework (which UIImageView must use in its implementation...)
You could re-implement you own UIImageView animation.
Then, to set different animations with relative timing, see "How can I chain Core Animations for different Layers one after the other?"
and How to group two CABasicAnimation animations and kick them off at the exact same time?.
As you don't need an offset between all your layers animations but want them to run at the same time, you should create a CAAnimationGroup, and put all of them with the same beginTime.
The CAMediaTiming protocol (implemented by CAAnimation) is pretty baldy documented - but this is the part you're interested in : timing your Core Animations - Check this post for some API clarification

How to animate bars of barchart-coreplot

I am new to iphone development and coreplot.
I want to draw a barchart according to some data, that i have done.
now i want to give some animations to the bars of plot. That means bars in the graph should lengten or shorten in a growing or shrinking efect.
Can anybody help me?
Thanks in advance.
Kindly refer the following post:
How to access CALayer of individual bar in core-plot?
It talks about precisely the same thing you are trying to do.
I dont know what class you might be using, but most probably it is a subclass of CA Layer.
Check this code out:
CABasicAnimation *rotation = [CABasicAnimation animationWithKeyPath:#"transform"];
CATransform3D transform = CATransform3DMakeRotation(DegreesToRadians(360), 0, 0, 1);
rotation.toValue = [NSValue valueWithCATransform3D:transform];
rotation.duration = 10.0f;
[pieChart addAnimation:rotation forKey:#"rotation"];
How to animate the pie charts developed using core-plot library?

Iphone 3d Animation

I recently posted my problem but neither did I get an answer here or elsewhere, nor can I find my post again...
Anyway, I want to try to state my point clearer, hoping you can help me this time maybe.
The part of code, this is about, looks like this:
CABasicAnimation *animation = nil;
CATransform3D transform;
animation = [CABasicAnimation animationWithKeyPath:#"transform"];
transform = CATransform3DMakeRotation(1.57f, 0.0f, 1.0f, 0.0f);
value = [NSValue valueWithCATransform3D:transform];
[animation setToValue:value];
[animation setAutoreverses:YES];
[animation setDuration:0.5f];
[[shieldView layer] addAnimation:animation forKey:#"180"];
What happens, is that I have a UIImageView with an image in it. I take this View and rotate it around the z-Axis for half a turn (1.57 measured in arc).
Now there is another View overlapping with the one being transformed in 3d. This leads to my problem: As soon as the transformation is executed, the transformed layer is sort of clipped against the overlapping view, but wrong, so that u see a 'flickering' effect to both Views.
Now I don't know, why this happens. I would expect the view to be animated appropriately, without this 'bug', and the Views to be just displayed correctly.... since I do not do anything special.
I have tried to overlay 2D transformations, using the 'beginAnimations' and 'commitAnimations' context, which works fine. This means, the problem is sort of hidden in the 3D rotation of my View.
You guys have any clues on this? I hope I explained that well enough.
If these are two sibling views (subviews of the same superview), their layers can overlap, potentially creating the visual artifacts you see. You should be able to either reposition the views relative to one another in the view hierarchy (make one view a level above or below the other) or directly set the Z position of the view's layer. If you do something like
shieldView.layer.zPosition = 1.0f;
your shieldView's layer should be slightly above the other view's layer (unless I'm remembering the coordinate space wrong and it needs to be -1.0f) and you should be able to avoid the clipping you see now.

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!");
}];