将BarButtonItem旋转45度(动画)

时间:2017-01-20 22:30:53

标签: ios animation rotation uibarbuttonitem

看起来动画不是我的专长:/

在我的导航栏中,我有一个自定义的BarButtonItem,一个加号,用于向列表添加内容。我想将加号旋转45度,使其在按下时变为X,然后作为取消按钮。

我通过执行以下操作向BarButtonItem添加了一个按钮作为自定义视图:

@IBOutlet weak var addQuestionaryButton: UIBarButtonItem!
{
    didSet {
        let icon = UIImage(named: "add")
        let iconSize = CGRect(origin: CGPoint.zero, size: icon!.size)
        let iconButton = UIButton(frame: iconSize)
        iconButton.setBackgroundImage(icon, for: .normal)
        addQuestionaryButton.customView = iconButton
        iconButton.addTarget(self, action: #selector(QuestionaryListViewController.addClicked(_:)), for: .touchUpInside)
    }
}

这似乎工作正常。 现在,如果按下按钮,我会执行以下操作:

UIView.animate(withDuration: 0.5, animations:{
            self.addQuestionaryButton.customView!.transform = CGAffineTransform(rotationAngle: CGFloat(M_PI_4))
        })

我可以看到按钮开始旋转,但不知怎的,它变得完全变形了。看图片:

在:

Normal state, before it is pressed

后:

enter image description here

我不明白为什么会这样。 如何正确设置BarButtonItem的动画?

提前致谢。

问候

1 个答案:

答案 0 :(得分:4)

不知道为什么会发生这种情况(我的猜测是在进行转换时,customView的框架会搞乱)但是找到了解决方案。 只需将按钮放入另一个UIView,然后将此UIView设置为UIBarButtonItem的customView。

进行动画制作时,请勿旋转UIView,旋转按钮。

提醒:不要忘记设置此UIView的框架。

目标C中的示例代码:
INIT:

@interface ViewController ()
@property (nonatomic, strong) UIButton* itemButton;
@end

@implementation ViewController
- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.

    //button init
    self.itemButton = [[UIButton alloc] init];
    [self.itemButton setBackgroundImage:[UIImage imageNamed:@"imgName"] forState:UIControlStateNormal];
    self.itemButton.frame = CGRectMake(0, 0, 30, 30);

    //container for the button
    UIView* btnContainer = [[UIView alloc] init];
    btnContainer.frame = CGRectMake(0, 0, 30, 30);
    [btnContainer addSubview:self.itemButton];
    //set the container as customView of the UIBarButtonItem
    UIBarButtonItem* applyButton = [[UIBarButtonItem alloc] initWithCustomView:btnContainer];

    self.navigationItem.rightBarButtonItem = applyButton;
}

触发轮换的代码:

[UIView animateWithDuration:0.5 animations:^{
        self.itemButton.transform = CGAffineTransformRotate(self.itemButton.transform, M_PI_4);
}];