I want to show a UIImageView after 3 seconds from the view did load. This image view is kind of a static Ad, a static image loaded that will show up when the application starts as mentioned. This ismageView should have a close button on it so the user can close it just like the typical ad behavior. It's my first time dealing with this kind of situations so please help me out i'm totally lost.
Till now i got to animate a view containing an image view with fade in and out animations, which is perfect..but now haw can i add a close button to it, to make her dismiss only when that button is pressed? this is my code
UIImageView *wnn = [[UIImageView alloc]init];
wnn.frame = CGRectMake(100, 100, 300, 300);
[wnn setImage:[UIImage imageNamed:#"menu-icon.png"]];
UIView *jn = [[UIView alloc]init];
[jn addSubview:wnn];
[self.navigationController.view addSubview: jn];
[jn setAlpha:0.f];
[UIView animateWithDuration:2.f delay:0.f options:UIViewAnimationOptionCurveEaseIn animations:^{
[jn setAlpha:1.f];
} completion:^(BOOL finished) {
[UIView animateWithDuration:2.f delay:0.f options:UIViewAnimationOptionCurveEaseInOut animations:^{
[jn setAlpha:0.f];
} completion:nil];
}];
You can follow below steps:
Open Storyboard file with your viewcontroller.
Place UIView from library to your main view of viewcontroller.
Place your image and close button on new UIview placed.
Now set IBOutlet for this uiview.
Make hide/show this view instead of image and close button in your method.
Related
Let's say I have a class that is a subclass of UIViewController named FullSizeViewController. I also have another class that is a subclass of UIViewController called TQHViewController (TQH: Three Quarter Height). How would I
be able to display TQHViewController over FullSizeViewController, with the only one quarter of FullSizeViewController visible?
animate this action?
I'm basically attempting to make something like a UIPopover, but animate it so it slides in from the bottom of the screen.
#property(nonatomic,retain) TQHViewController *template;
template = [[TQHViewController alloc]init];
template.view.frame = CGRectMake(20, 1000, 280, 450);
And you can also set the frame for the subView and decide the size of the subview. if you want animation from the bottom use UIViewwithanimation.
[UIView animateWithDuration:0.9f
delay:0.1f
usingSpringWithDamping:0.65f
initialSpringVelocity:0.1f
options:UIViewAnimationOptionCurveEaseOut animations:^{
template.view.frame = CGRectMake(20, 63, 280, 450);
[self.view addSubview:overlayWindow];
}
completion:^(BOOL finished) {
//Completion Block
}];
Use like this so your functionalities will not be lost and make nill after the usage.
If anything wrong feel free to comment it.
I am creating a fairly simple animation of several buttons and images in my app. Basically it looks like a menu that unfolds.
I use auto-layout storyboard to manage the view and I have set proper constraints so it looks the same on every devices.
I have two buttons and two images over these buttons, when first show,
NSLog(#"Button position is %#", NSStringFromCGRect(_toclass.frame));
NSLog(#"Image position is %#", NSStringFromCGRect(_revel2.frame)); I get the answer : Button position is {{0, 153}, {600, 133}} and Image position is {{254, 179}, {92, 60}}.
I set the following variables and perform the first animation :
Hprofile = 20;
Hclass = 153;
Htuto = 2 * Hclass;
Hicones = 26;
[UIView animateWithDuration:1.2
delay:0
options:(UIViewAnimationOptions) UIViewAnimationCurveEaseInOut
animations:^{
[_toclass setFrame:CGRectMake(0, -Htuto, self.view.bounds.size.width, _toclass.frame.size.height)];
[_revel2 setFrame:CGRectMake(_revel2.frame.origin.x, -Htuto+Hicones, 92, 60)];
}
completion:^(BOOL finished){
}];
After this animation (that works fine) is done, there is another button that you can use to come back to the previous settings :
[UIView animateWithDuration:1
delay:0
options:(UIViewAnimationOptions) UIViewAnimationCurveEaseInOut
animations:^{
[_toclass setFrame:CGRectMake(0, Hclass, self.view.bounds.size.width, 133)];
[_revel2 setFrame:CGRectMake(_revel2.frame.origin.x, Hclass+Hicones, 92, 60)];
}
completion:^(BOOL finished){
NSLog(#"Button position is %#", NSStringFromCGRect(_toclass.frame));
NSLog(#"Image position is %#", NSStringFromCGRect(_revel2.frame));
}];
After this animation the buttons are in the correct place but the images are not.
I get the answer : Button position is {{0, 123}, {320, 102.5}} and Image position is {{114, 179}, {92, 60}}.
I imagine there is some conflict between the animation and the auto-layout constraints, but I can't figure it out.
Help !
Thank you for your time.
If you are using auto layout you should not change frames anymore, you should work with constraints.
As far as I can understand from your code, you want to move your button and image up and down. The correct way would be to create an IBOutlet from the top offset constraints in the storyboard (for both the button and the image) and change the constant on them so that it fits your animation.
Something like this instead of the first frame modification.
[UIView animateWithDuration:1.2
delay:0
options:(UIViewAnimationOptions) UIViewAnimationCurveEaseInOut
animations:^{
[self.buttonTopOffsetConstraint setConstant:-Htuto];
[self.imageTopOffsetConstraint setConstant:(-Htuto+Hicones)];
[self.view layoutIfNeeded];
}];
Let me know if you need more help or something is unclear. Good luck!
Does anyone know how to achieve the present view controller's view to shrink and put another one over it with a transparency? It is achieved in Tweetbot 3 when you tap on your avatar in the top left on the navigation bar. Should I take a snapshot for example?
In order to achieve this effect you will have to rebuild your view stack from scratch.
So as there is no possibility to change the viewController.view's frame, you'll have to add a kind of container subview a little like this:
#implementation ViewController
#synthesize container;
- (void)viewDidLoad {
[super viewDidLoad];
container = [[UIView alloc] initWithFrame:self.view.frame];
[self.view addSubview:container];
// add all views later to this insted of self.view
// continue viewDidLoad setup
}
Now if you have that, you can animate the shrinking behavior like so:
[UIView animateWithDuration:.5 animations:^{
container.frame = CGRectMake(10, 17, self.view.frame.size.width-20, self.view.frame.size.height-34);
}];
Okay, I assume you are developing for iOS 7, so we'll make use of some new APIs here (for earlier versions there are alternative frameworks). Now since WWDC UIView's got a resizableSnapshotViewFromRect:(CGRect) afterScreenUpdates:(BOOL) withCapInsets:(UIEdgeInsets) method returning a single UIView object.
[UIView animateWithDuration:.5 animations:^{
container.frame = CGRectMake(10, 17, self.view.frame.size.width-20, self.view.frame.size.height-34);
} completion:^(BOOL finished) {
UIView *viewToBlur = [self.view resizableSnapshotViewFromRect:container.frame afterScreenUpdates:YES withCapInsets:UIEdgeInsetsZero];
}];
If you do not want to rewrite your view management, you can also first take a snapshot of your main view this way, set it to the container and then animate only the image. But remember, you can not interact with the captured view then.
When you've got that, you can download the two category files from this repo (They're from WWDC, so directly from Apple!). Basically, what they do is, they add some cool new methods to the UIView class, of which we'll use applyDarkEffect. I haven't tested this, maybe another method fits your needs better here.
Anyways if we implement that into the block and maybe also add a UIImageView to display the blurred overlay, it should look something like this:
[UIView animateWithDuration:.5 animations:^{
container.frame = CGRectMake(10, 17, self.view.frame.size.width-20, self.view.frame.size.height-34);
} completion:^(BOOL finished) {
UIView *viewToBlur = [self.view resizableSnapshotViewFromRect:container.frame afterScreenUpdates:YES withCapInsets:UIEdgeInsetsZero];
UIImage *image = [viewToBlur applyDarkEffect];
UIImageView *blurredView = [[UIImageView alloc] initWithFrame:self.view.frame];
[self.view addSubview:blurredView];
// optionally also animate this, to achieve an even smoother effect
[blurredView setImage:image];
}];
You can then add your SecondViewController's view on top of the stack, so that it's delegate methods will still be called. The bounce effect of the incoming account view can be achieved via the new UIView animation method animateWithDuration:(NSTimeInterval) delay:(NSTimeInterval) usingSpringWithDamping:(CGFloat) initialSpringVelocity:(CGFloat) options:(UIViewAnimationOptions) animations:^(void)animations completion:^(BOOL finished)completion (more on that in the documentation)
I hope that will help you with your project.
I'm having trouble changing my button text after animation.
Defined in my .h file
#property (weak, nonatomic) IBOutlet UIButton *btnCheck;
I call this method when i want to animate the button location change
- (void)updateViews {
if(checkedIn){
[UIView animateWithDuration:0.3f
delay:0.0f
options:UIViewAnimationOptionTransitionNone
animations:^{
btnClear.hidden = YES;
[btnCheck setFrame:CGRectMake(90, btnCheck.frame.origin.y, btnCheck.frame.size.width, btnCheck.frame.size.height)];
}
completion:nil];
}else{
[UIView animateWithDuration:0.3f
delay:0.0f
options:UIViewAnimationOptionTransitionNone
animations:^{
[btnCheck setFrame:CGRectMake(20, btnCheck.frame.origin.y, btnCheck.frame.size.width, btnCheck.frame.size.height)];
}
completion:^(BOOL finished){
btnClear.hidden = NO;
}];
}
checkedIn = !checkedIn;
}
That works perfect, pics included below for reference:
The problem is as soon as i try change the name of the button it jumps back to its original frame.
I change the button text in another method like this,
btnCheck.titleLabel.text = #"test";
And as soon as i change that the button jumps back
What's causing the button frame to be reset?
I've tried changing it before the animation,during and on completion. It animates to the new location and jumps back.
This will probabily not answer your question, but I'll show you a better way to change a frame when you want to change only one property in your frame
CGRect buttonFrame = [btnCheck frame];
buttonFrame.origin.x = newXOrigin;
[UIView animateWithDuration:0.3f
animations:^{
[btnCheck setFrame:buttonFrame];
}];
I prefer this method, because you don't have to create a new CGRect and copy paste all the unmodified frame attributes. Ow and you might wanna get the hidden assignment out of the animation block, since that cannot be animated
You should not change UIButton's title that way. Instead, try setting it's title using setTitle:forState: method. Try this, and let me know if this was helpful, Good Luck!
It was Autolayout that caused the problem. Disabled that and everything worked
I created some animations in my project. Basically, I use UIView animate and CGAffineTransform, but a very strange thing happened and I have no idea. Hope someone can help me solve this problem. Thanks in advance.
This is the strange thing:
After the user clicks on a button, the button slides off screen and another two buttons slide on the screen (I just changed the center point of these buttons to achieve this animation). And, some time later, a view on the screen start shaking (I use CGAffineTransform to achieve this).
At this moment, the strange thing happens - the button that previous slid off screen show up at its original position again and the other two buttons disappear (No animation, just shows up and disappear).
The following is the related code,
1) Button slide off and slide in animation related code
- (IBAction)start:(id)sender
{
// 1. Slide in cancel and pause button
[UIView animateWithDuration:0.5f animations:^{
[startButton setCenter:CGPointMake(startButton.center.x + 300.0f, startButton.center.y)];
[cancelButton setCenter:CGPointMake(cancelButton.center.x + 300.0f, cancelButton.center.y)];
[pauseButton setCenter:CGPointMake(pauseButton.center.x + 300.0f, pauseButton.center.y)];
} completion:^(BOOL finished) {
if (finished) {
NSLog(#"Move finished");
}
}];
}
2) The view shaking animation related code
- (void)shakeView:(UIView *)viewToShake
{
CGFloat t = 2.0;
CGAffineTransform translateRight = CGAffineTransformTranslate(CGAffineTransformIdentity, t, 0.0);
CGAffineTransform translateLeft = CGAffineTransformTranslate(CGAffineTransformIdentity, -t, 0.0);
viewToShake.transform = translateLeft;
[UIView animateWithDuration:0.07 delay:0.0 options:UIViewAnimationOptionAutoreverse|UIViewAnimationOptionRepeat animations:^{
[UIView setAnimationRepeatCount:2.0];
viewToShake.transform = translateRight;
} completion:^(BOOL finished) {
if (finished) {
[UIView animateWithDuration:0.05 delay:0.0 options:UIViewAnimationOptionBeginFromCurrentState animations:^{
viewToShake.transform = CGAffineTransformIdentity;
} completion:nil];
}
}];
}
This isn't weird, it's a common problem with
auto layout. If you move UI elements by changing frames, then as soon as something else takes place that requires laying out views, the moved views will revert to the position defined by their constraints. To fix it, you either need to turn off auto layout, or do your animations by changing constraints not frames.
I have tried your code in my test project. The problem is probably because you are using Autolayout in your xib.
Please checking your xib file and uncheck the Autolayout property.