iOS翻译和缩放动画

问题描述

我正在研究UIButton动画，其中：

I'm working on UIButton animation where:

UIButton 设置在底部中心屏幕缩小到小尺寸

The UIButton is set in the bottom center of the screen and scaled to a small size

_menuBtn.transform = CGAffineTransformMakeScale(0.1f, 0.1f);

当应用程序启动时，它应该移动到屏幕左下方，因为它会缩放或增长原来的大小。

When the app starts it should be moving to the bottom left side of the screen as it scales or grow to its original size.

- (void)viewDidLoad
{
    [super viewDidLoad];

    _menuBtn.frame = CGRectMake(160, 513, 30, 30);
    _menuBtn.superview.frame = CGRectMake(160, 513, 30, 30);

    _menuBtn.transform = CGAffineTransformMakeScale(0.1f, 0.1f);
    NSLog(@"_menuBtn: %@ ; _menuBtn.superview: %@", _menuBtn, _menuBtn.superview);
    [UIView beginAnimations:nil context:nil];
    [UIView setAnimationDelegate:self];
    [UIView setAnimationDuration:5];
    [UIView setAnimationCurve:UIViewAnimationCurveEaseOut];
    CGAffineTransform scaleTrans  = CGAffineTransformMakeScale(1.0f, 1.0f);
    CGAffineTransform lefttorightTrans  = CGAffineTransformMakeTranslation(-200.0f,0.0f);
    _menuBtn.transform = CGAffineTransformConcat(scaleTrans, lefttorightTrans);
    [UIView commitAnimations];

}

问题

当动画开始时，按钮开始从屏幕的右下方开始移动，而不是在它应该是的底部中心。有什么帮助吗？

When the animation starts the button starts moving from the bottom right side of the screen and not in the bottom center where it is and should be. Any help ?

日志结果

NSLog(@"%@", _myBtn);

2013-08-14 09:22:38.913 GJCoolNavi[339:c07] <UIButton: 0x813ea30; frame = (0 0; 0 0); opaque = NO; autoresize = TM+BM; layer = <CALayer: 0x813eaf0>>

在做动画之前......以及动画之后的结果是：

thats before doing the animation...and the result after the animation is:

2013-08-14 09:30:25.719 GJCoolNavi[612:c07] <UIButton: 0x71206d0; frame = (160 294; 0 0); opaque = NO; autoresize = TM+BM; animations = { transform=<CABasicAnimation: 0x7536a80>; position=<CABasicAnimation: 0x7537dd0>; }; layer = <CALayer: 0x7120790>>

推荐答案

你为什么不这样做......

Why don't you do this...

_menuBtn.transform = CGAffineTransformMakeScale(0.1, 0.1);

[UIView animateWithDuration:5.0
options:UIViewAnimationOptionCurveEaseOut
animations:^(){
    _menuBtn.transform = CGAffineTransformMakeScale(1.0, 1.0);
    _menuBtn.center = self.view.center;
}
completion:nil];

我会避免使用转换移动内容。改为改变框架。

I'd avoid moving stuff using a transform. Change the frame instead.

编辑

- (void)viewDidLoad
{
    [super viewDidLoad];
}

- (void)viewDidAppear:(BOOL)animated
{
    [super viewDidAppear:animated];

    // for convenience I'm pulling these values out in to variables.
    float buttonWidth = _menuBtn.frame.size.width;
    float buttonHeight = _menuBtn.frame.size.height;
    float viewWidth = self.view.frame.size.width;
    float viewHeight = self.view.frame.size.height;

    // set the button frame to be the bottom center
    // note you shouldn't have to do this as Interface Builder should already place it there.
    // place the button in the horizontal center and 20 points from the bottom of the view.
    _menuBtn.frame = CGRectMake((viewWidth - buttonWidth) * 0.5, viewHeight - buttonHeight - 20, buttonWidth, buttonHeight);

    // scale the button down before the animation...
    _menuBtn.transform = CGAffineTransformMakeScale(0.1, 0.1);

    // now animate the view...
    [UIView animateWithDuration:5.0
                          delay:0.0
                        options:UIViewAnimationOptionCurveEaseOut
                     animations:^{
                         _menuBtn.transform = CGAffineTransformIdentity;
                         _menuBtn.frame = CGRectMake(viewWidth - buttonWidth - 20, viewHeight - buttonHeight - 20, buttonWidth, buttonHeight);
                     }
                     completion:nil];
}

试试这个，让我知道会发生什么。

Try this and let me know what happens.

这篇关于iOS翻译和缩放动画的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！