I've been struggling with this for a while and have not found a solution.
I'm resizing a UIWebView using animations through beginAnimations: and commitAnimations. All goes well, except for when the resizing tries to make the UIWebView larger.
Let me make this clearer. Suppose the current frame of my UIWebView is (0, 0, 320, 300).
Then, I try to resize it to (0, 0, 320, 340) by using:
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:1.0];
[self.webView setFrame:(CGRectMake(webView.frame.origin.x, webView.frame.origin.y, webView.frame.size.width, 340))];
[UIView commitAnimations];
By doing that, I expect the UIWebView to come down 40 pixels, but it actually goes up a little bit (around 10 - 20 pixels) and only AFTER THAT it comes down to the desired position (so it ends up coming down around 50 - 60 pixels, actually).
Does anyone know how to solve that? What I want to do is have the bottom of my UIWebView go down when the method is called, so if there are any other options for accomplishing it, I would be happy to try.
Thanks a lot.
Instead of animating the frame of the UIWebView, you should try animating the bounds alone, or perhaps the bounds and center together. e.g. expand the height by 40 while simultaneously moving the center down by 20.
Related
In some of the applications, I have seen that we can drag a view outside of its position using two fingers(in smooth motion). We are also able to resize, rotate and move it further. And when I take my fingers off the screen it just resized(also rotates) and go backs to its original position by itself in a smooth motion.
How can I do this kind of animation? Is there any sample available? OR just telling me how the flow actually is will also be really helpful.
UIViews are animatable simply by setting properties.
[UIView animateWithDuration:0.5 animations:^{
myView.frame = CGRectMake(50, 50, 100, 200);
myView.layer.affineTransform = CGAffineTransformMakeRotation(M_PI);
}];
Look up animateWithDuration in the docs for more options and examples.
I'm trying to build my first iPhone app, a Berlin museum guide, and I'm having a little trouble figuring out how to design a specific view. I did mockups of all my views with Photoshop before, but now actually making it happen in Xcode is something else, of course :-)
So, here's what I want:
[I was gonna post an image here but since I'm new I don't have enough reputation to post images.]
Find the image here:
http://img9.uploadhouse.com/fileuploads/13445/13445099d5adea77b02fe1d76755da6b81c92634.png
I want a white box with several text parts in it. A large heading, a smaller heading and a longer text that is placed next to an image. The text that goes in there is provided by my core data model and changes depending on what exhibition the user is looking at.
First question: Is there such thing as a "white box with rounded corners object" in which I can place text, images etc. or would I have to import this as a custom image? In that case, I'd have a problem if I want the box to change it's size, as with simply scaling the image the round corners would become distorted.. I'm assuming a CSS-stye approach with a top- and bottom-image and doing the middle part with a repeat-y property or something like that won't work in objective-c, right?
Second question: Does anyone have good advice on how to approach the text expand thing in general? I want the description text to initially be just a teaser so it won't take up the whole screen. If the user wants to keep reading, on tapping the "more" button the box should expand and display the entire text.
So much for the theory.. I'm a bit clueless about how to get this done and am hoping that somebody might have some good input on that.
Thanks a lot for taking the time to help a newbie :-)
I would not use a b/g image since there are going to be problems with vertical expansion, as you noted yourself. I would rather use a regular UIView and following method to make its corners round.
#import <QuartzCore/QuartzCore.h>
view.layer.cornerRadius = 5;
As for the text expansion. I would not try to make image wrapping text as it is hard.
For automatica UITextView adjustment you can do the following.
set UITextView frame smaller.
create a button "more" that will change the frame of the UITextView and animate it
example:
#define MOVE_ANIMATION_DURATION_SECONDS 0.5
-(void)maximize:(BOOL)animated{
if(animated){
[UIView beginAnimations:nil context:nil];
[UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
[UIView setAnimationDuration:MOVE_ANIMATION_DURATION_SECONDS];
[UIView setAnimationDelegate:self];
[self setMaximizedViewState];
[UIView commitAnimations];
}else
[self setMaximizedViewState];
}
-(void)minimize:(BOOL)animated{
if(animated){
[UIView beginAnimations:nil context:nil];
[UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
[UIView setAnimationDuration:MOVE_ANIMATION_DURATION_SECONDS];
[UIView setAnimationDelegate:self];
[self setMinimizedViewState];
[UIView commitAnimations];
}else
[self setMinimizedViewState];
}
-(void)setMinimizedViewState{
isMinimized = YES;
//Adjust the UITextView's frame and other properties
}
-(void)setMaximizedViewState{
isMinimized = NO;
//Adjust the UITextView's frame and other properties
}
I have a UIImageView showing an image with the contentMode of UIViewContentModeScaleAspectFill.
Then I am associating a animation (about 30 seconds) of CGAffineTransformMakeScale with the UIImageView.
imageView.transform = CGAffineTransformMakeScale(1,1);
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:30];
imageView.transform = CGAffineTransformMakeScale(1.9,1.9);
[UIView commitAnimations];
After 30 seconds, when a round of animation is done, I will set another image to the imageView and restart the animation.
Everything is fine. But when I try to rotate the UIImageView to adapt user's selection of device orientation, it becomes wired.
When the user is about to change the orientation, I set the UIImageView's frame to CGRectMake(0, 0, 768, 1004) or CGRectMake (0, 0, 1024, 748), accordingly.
The strange thing is:
if the frame of UIImageView is changed while the animation, it is fine. But when the next image comes and starts a new round of animation, the UIImageView suddenly became small in the center of screen (is supposed to be full screen) and then the animation of zoom-in started as usual, just not full screen any more.
Can anyone tell me how to control the frame or orientation while the UIImageView has a transform with it?
Because I guess this is where it went wrong.
Thanks
Quoth the documentation for the frame property:
Warning: If the transform property is not the identity transform, the value of this property is undefined and therefore should be ignored.
You should probably be messing with center and bounds instead, if you are using transformations.
Frame property is not defined when transforming. Use bounds instead of frame in this case.
I've tried creating two UIButtons programatically as described here. This works great but there doesn't seem to be a simple transition for expanding the UIButton on the left as seen in the Apps Store.
If you would like to animate the size of your button, you can use transforms or make the frame larger. Just set the new frame or transform, start the animation, and your button should animate to it's new size.
Assuming your button starts as 50 wide, 38 high and is at the 100,100 point of the screen:
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:.5];
yourButton.frame = CGRectMake(70, 100, 80, 38); // this makes the button 80 wide, expanding to the left
//here you can change other values, such as the background image and title.
[UIView commitAnimations];
I want to perform a shrink animation on a UITableVIew. I experimented a bit and found out that the animation runs much faster when I shrink a UIImageView with an image of the current state of the tableview instead of shrinking the table view itself.
I grabbed the image in a method in my main viewcontroller prior to the animation:
UIGraphicsBeginImageContext(mainTableView.bounds.size);
[resizeContainer.layer renderInContext:UIGraphicsGetCurrentContext()];
UIImage *viewImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
Works like a charm, at least almost. On very rare occasions I get weird graphic glitches, where the UIImage starts to overlap a toolbar that lies underneath it.
I just want to make sure that I am getting the image in the right way. I am laking the necessary understand of GraphicContexts to be sure about it.
To cut a long story short, is my code correct?
Thx
In what way did you animate the table? I haven't had problems with it animating slowly. Here is an example of what I did when I had to resize my table:
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:1.0];
[UIView setAnimationCurve:UIViewAnimationCurveEaseOut];
[mainTableView setFrame:CGRectMake(0,43,320,176)];
[UIView commitAnimations];
The reason I would suggest not just taking a screenshot but actually animating the table is because the animation could possibly start as the table is still scrolling. For instance the user just happened to flick the table as it started animating then you would have a jump to the new state when you fade out the "screen shot" that you took.
It went away with iOS 4.0. So I guess it was a bug.