I am trying to animate the reduction of size and width of a UIButton in this way:
[UIView animateWithDuration:0.5
delay:0.0
options: UIViewAnimationCurveEaseInOut
animations:^{
[button setFrame:CGRectMake(button.frame.origin.x, button.frame.origin.y, 0, 0)];
[button setCenter:CGPointMake(button.frame.origin.x, button.frame.origin.y)];
}
completion:^(BOOL finished){
...
The button is reducing in size, but the centre is not constant. I would like it to close on itself, if you know what I mean, like when you delete an IOS app
Use CGRectInset on the current frame to produce a new frame which is smaller (or larger) than the original while maintaining the center point.
[button setFrame:CGRectInset(button.frame, button.frame.size.width * 0.5, button.frame.size.height * 0.5)];
Use the original center:
CGPoint center = button.center;
button.frame = CGRectMake(button.frame.origin.x, button.frame.origin.y, 0, 0);
button.center = center;
[button setCenter:CGPointMake(button.frame.origin.x, button.frame.origin.y)];
Comment this one out and try. If it doesn't work get the centre point before animation and set the point exclusively as mentioned rmaddy.
You can also try :
[button setFrame:CGRectMake(button.frame.origin.x+button.frame.size.width/2, button.frame.origin.y+button.frame.size.height/2, 0, 0)];
In your code, it would be:
[UIView animateWithDuration:0.5
delay:0.0
options: UIViewAnimationCurveEaseInOut
animations:^{
[button setFrame:CGRectMake(button.frame.origin.x+button.frame.size.width/2, button.frame.origin.y+button.frame.size.height/2, 0, 0)];
}
completion:^(BOOL finished){
...
I've tested this and it "shrinks" the button maintaining the center throughout the animation.
[UIView animateWithDuration:0.5 delay:0.0 options:0
animations:^{
button.transform = CGAffineTransformMakeScale(0, 0);
} completion:^(BOOL finished) {
// ... remove button from super view?
}];
Related
I want to make something like this:
Reference of image.
What I do: two UIImagesView, one with UIViewContentModeLeft and another with UIViewContentModeRight. I have a slider where I can change image frames. The solution seems to be ok, but I am not sure if this is the "right" one. Other suggestions are welcome.
Thanks!
use single Imageview for your concept it is my suggestion If you feel free use this else use your concept else go some thirdparty, where you need for modify the transparent, add the one Transparent UIView above the ImageView . set the frame as of Transparent UIView for Show as (0, 0, ImageView.frame.size.width/2,ImageView.frame.size.height) , for Hide (ImageView.frame.origin.X - 40, 0, ImageView.frame.size.width/2,ImageView.frame.size.height)
for example
To Show
TransparentView.hidden = NO;
TransparentView.alpha = 0.1;
[UIView animateWithDuration:0.25 animations:^{
TransparentView.frame = CGRectMake(0,
0,
ImageView.frame.size.width/2,
ImageView.frame.size.height);
TransparentView.alpha = 1.0f;
} completion:^(BOOL finished) {
// do some
}];
To hide
[UIView animateWithDuration:0.25 animations:^{
TransparentView.frame = CGRectMake(0 - self.view.frame.size.width,
0,
ImageView.frame.size.width/2,
ImageView.frame.size.height);
[TransparentView setAlpha:0.1f];
} completion:^(BOOL finished) {
TransparentView.hidden = YES;
}];
I have a UIButton laid out using storyboard. The button just contains an image. When the button is clicked, I want to animate the size of the button - decrease in size and then bring it back to the original size again.
I used the following code -
[UIView animateWithDuration:2.0 animations:^{
_favButton.transform = CGAffineTransformMakeScale(0.5, 0.5);
}completion:^(BOOL finished) {
[UIView animateWithDuration:2.0 animations:^{
_favButton.transform = CGAffineTransformMakeScale(1, 1);
}];
}];
This code moves my button on the screen which I do not want. I want the center of the button to be fixed and the size be animated.
I have not used any Top Constraint in the storyboard for the button. How can I rectify this behaviour?
If you have auto layout turned on, you would need to turn it off.
But it doesn't seem to your problem here as per your description.
I would do the following to re-adjust to the center as it scales:
CGPoint cP = _favButton.center;
[UIView animateWithDuration:2.0 animations:^
{
_favButton.transform = CGAffineTransformMakeScale(0.5, 0.5);
_favButton.layer.position = cp;
}
completion:^(BOOL finished)
{
[UIView animateWithDuration:2.0 animations:^
{
_favButton.transform = CGAffineTransformMakeScale(1, 1);
_favButton.layer.position = cp;
}];
}];
Hope this helps.
SWIFT 3
button.transform = CGAffineTransform(scaleX: 0.1, y: 0.1)
I'm trying to translate a UIView for a distance using the following code:
CGAffineTransform transform = CGAffineTransformMakeTranslation(-100, -100);
[self.exposureHintView setTransform:transform];
[UIView animateWithDuration:2.0
delay:0.0
options:UIViewAnimationOptionBeginFromCurrentState
animations:^{
NSLog(#"Begin!");
CGAffineTransform newTrans = CGAffineTransformMakeTranslation(0, 0);
[self.exposureHintView setTransform:newTrans];
}
completion:^(BOOL finished) {
NSLog(#"End %d", finished);
}];
So basically, I'm justing trying to move the view from some point say (-100, -100) to where it should be (0, 0) relative to itself.
Since I wanted to animate it once the view appeared, so I put the code in viewDidAppear:. But when I run the code, nothing happened.
The self.exposureHintView here is a custom subclass of UIView, does it matter?
Why?
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:0.5];
[_AboutView setFrame:CGRectMake(0, 0, 320, 510)];
[UIView commitAnimations];
Use this code to change the position of your view
I think the problem here is you are create exposureHintView in storyboard or XIB file without code programmatically.
Try to do as the follows:
- (void)viewDidLoad
{
//Init exposureHintView
UIView* exposureHintView = [[UIView alloc]initWithFrame(sampleFrame)];
[self addSubView: exposureHintView];
//Set transform
CGAffineTransform transform = CGAffineTransformMakeTranslation(-100, -100);
[self.exposureHintView setTransform:transform];
//Commit animation
[UIView animateWithDuration:2.0 delay:0.0
options:UIViewAnimationOptionBeginFromCurrentState
animations:^{
NSLog(#"Begin!");
CGAffineTransform newTrans = CGAffineTransformMakeTranslation(0, 0);
[self.exposureHintView setTransform:newTrans];
}
completion:^(BOOL finished) {
NSLog(#"End %d", finished);
}];
The reason here is your could not set Frame or Transform or some another attribute of this UIView in >>ViewDidLoad when you using storyboard or XIB
I have a circle that users can touch, when you touch it it changes size then reverts back to its original size to indicate you touched it. I want users to be able to touch it as often as they like regardless of whether its currently animating or not. I updated my animation to use the UIViewAnimationOptionAllowUserInteraction flag which does allow me to touch it during the animation but it doesnt behave as I'd expect.
I think I need to somehow stop the currently playing animation, reset the size to normal and then play it again, is this correct and if so how do I do it? If not what do I do?
- (void)pop{
[view.layer removeAllAnimations];
[UIView animateWithDuration:0.2
delay:0.0
options:UIViewAnimationOptionAutoreverse | UIViewAnimationOptionCurveEaseOut | UIViewAnimationOptionAllowUserInteraction // reverse back to original value
animations:^{
// scale down 20%
self.transform = CGAffineTransformMakeScale(0.8, 0.8);
} completion:^(BOOL finished) {
self.transform = CGAffineTransformMakeScale(1, 1);
}];
}
self.btn = [[UIButton alloc] initWithFrame:CGRectMake(200, 200, 100, 30)];
[self.btn addTarget:self action:#selector(tapDown:) forControlEvents:UIControlEventTouchDown];
[self.btn addTarget:self action:#selector(tapUp:) forControlEvents:UIControlEventTouchUpInside];
- (IBAction)tapDown:(id)sender
{
[UIView animateWithDuration:0.2
delay:0.0
options: UIViewAnimationOptionCurveEaseOut | UIViewAnimationOptionAllowUserInteraction
animations:^{
// scale down 20%
self.btn.transform = CGAffineTransformMakeScale(0.8, 0.8);
} completion:nil];
}
- (IBAction)tapUp:(id)sender {
[UIView animateWithDuration:0.2
delay:0.0
options:UIViewAnimationOptionCurveEaseOut | UIViewAnimationOptionAllowUserInteraction // reverse back to original value
animations:^{
// scale up to 100%
self.btn.transform = CGAffineTransformMakeScale(1, 1);
} completion:nil];
}
Sure this is not what you want? When the player taps and pop is called the animation should start over?
- (void)pop{
self.transform = CGAffineTransformMakeScale(1, 1); // If you want the animation to start over you need to reset the size before staring it again
[view.layer removeAllAnimations];
[UIView animateWithDuration:0.2
delay:0.0
options: options:UIViewAnimationOptionAutoreverse | UIViewAnimationOptionCurveEaseOut| UIViewAnimationOptionAllowUserInteraction // reverse back to original value
animations:^{
// scale down 20%
self.transform = CGAffineTransformMakeScale(0.8, 0.8);
} completion:^(BOOL finished) {
self.transform = CGAffineTransformMakeScale(1, 1);
}];
}
I want to make a little zoom/fade animation for when the UIImageView shows up in my view, I already have the code for the fade effect:
banner.alpha = 0.0;
[UIView animateWithDuration:2.0 animations:^{
banner.alpha = 1.0;
}];
Now I want to know if there is another easy way to combine the fade effect with a little zoom effect, like the image becoming larger and filling up the frame as it fades in? Any ideas?
Thanks!
you can use CG_EXTERN CGAffineTransform CGAffineTransformMakeScale(CGFloat sx, CGFloat sy) to do the zoom effect
such as
banner.alpha = 0.0;
[UIView animateWithDuration:2.0 animations:^{
banner.alpha = 1.0;
banner.transform =CGAffineTransformMakeScale(1.3,1.3);
}];
You can also use the frame
banner.alpha = 0;
[UIView animateWithDuration:2.0f animations:^(void){
banner.alpha = 1.0f;
[banner setFrame:CGRectMake(0, 0, 1024, 748)];
}];
// With Completion
[UIView animateWithDuration:0.1f animations:^(void){
banner.alpha = 1.0f;
[banner setFrame:CGRectMake(0, 0, 1024, 748)];
}completion:^(BOOL finished) {
}];