按钮按动画

时间:2012-10-17 11:54:42

标签: iphone objective-c ios ipad uianimation

所以我搜索了很多,但我找不到问题的答案。

我想创建一个具有两个图像的按钮,第一个图像是按钮处于正常状态,另一个图像处于突出显示状态。问题是我希望这些图像以动画方式改变,例如第一个图像淡出,当第二个图像淡入时。它们会以动画时间保持不变的方式改变。

我想到的唯一方法是,制作一个自定义按钮,添加几个ImageViews和按钮触地事件,一个ImageView淡入,其他淡出,按钮触摸事件,我可以做相反的事情。但这种方法似乎并不合适。有没有更好的选择,我没有看到?

5 个答案:

答案 0 :(得分:6)

UIButton *myButton = [UIButton buttonWithType:UIButtonTypeRoundedRect];
    myButton.frame = CGRectMake(80, 50, 150, 40);
    [myButton setTitle:@"Say, Hi!" forState:UIControlStateNormal];
    [myButton setBackgroundImage:[UIImage imageNamed:@"xyz.png"] forState:UIControlStateNormal];
    [myButton addTarget:self action:@selector(buttonClicked:) forControlEvents:UIControlEventTouchUpInside];
    [self.view addSubview:myButton];


-(IBAction)buttonClicked:(UIButton *)sender
{
    [UIView animateWithDuration:0.7f
                     animations:^
     {
         [sender setAlpha:0.5f];
     }
                     completion:^(BOOL finished)
     {
         [sender setAlpha:1.0f];
        [sender setBackgroundImage:[UIImage imageNamed:@"abc.png"] forState:UIControlStateNormal];   }
     ];
}

您可以相应地设置动画持续时间和alpha。

答案 1 :(得分:5)

我是按照以下方式完成的,就像Ilker Baltaci描述的那样: 我将UIButton子类化(虽然它不建议因为它是一个类集群)并为它添加了一个函数:

- (void) blinkAndFlipButtonAnimationWithText: (NSString*) buttonText {
    [UIView animateWithDuration: 0.2 delay: 0 options: UIViewAnimationOptionCurveLinear 
                     animations: ^{ 
                         self.alpha = 0.1;
                     } 
                     completion: ^(BOOL finished) {
                         [UIView animateWithDuration: 0.2 delay: 0 options: UIViewAnimationOptionCurveLinear 
                                          animations: ^{ 
                                              self.alpha = 1;
                                          } 
                                          completion: ^(BOOL finished) {
                                              [UIView transitionWithView: self duration: 0.25 options: (UIViewAnimationOptionTransitionFlipFromBottom | UIViewAnimationOptionCurveEaseInOut)
                                                              animations: ^{ 
                                                                  [self setTitle: buttonText forState: UIControlStateNormal];
                                                              } 
                                                              completion: ^(BOOL finished) { 
                                                                  if ([self.delegate respondsToSelector: @selector(primaCustomButtonDidFinishFlipAnimation:)]) {
                                                                      [self.delegate primaCustomButtonDidFinishFlipAnimation: self];
                                                                  } 
                                                              }
                                               ];
                                          }
                          ];
                     }
     ];
}

很多块动画级联,丑陋我知道! 但无论如何,您可以根据需要调整动画块并排除委托回调。

然后在按下按钮的IBAction / target-action方法中,只需调用方法,如:

- (IBAction) facebookButtonPresse: (id) sender {
    [self.facebookButton blinkAndFlipButtonAnimationWithText: @"+3"];
}

答案 2 :(得分:2)

如果你想要按钮的动画淡出/淡出我可以用UIImageview替换你的自定义按钮,它与初始uibutton具有相同的背景图像。这将是第一个按钮的动作。当用uiview替换按钮时,可以将淡出动画应用于UIImageview,从初始backgorund图像到新的(选定版本)。当动画结束时,在完成块中开始另一个动画,将选定的iamge淡化为正常背景iamge。然后第二个动画结束删除你的uiimageview并添加你的按钮。

//将你的uiimageviews声明为ivars

            UIImageView *imageViewnormal = [[UIimageView alloc] initWithImage:normalIamge];
            UIImageView *imageViewhighlighted = [[UIimageView alloc] initWithImage:highlightImage];

在按钮UIControlEventTouchDown的操作中

             // make your button invisible
             yourbutton.alpha = 0;
             //add to same rect 2 imageviews with initial and selected backgrounds of uibutton

            imageViewnormal.alpha = 1;
            imageViewhighlighted.alpha = 0;

           [self.view addSubview:imageViewhighlighted];
           [self.view addSubview:imageViewnormal];

            // newImageViewWithInitialBackground needs to be inserted secondly and alpha value 1
           // newImageViewWithSelectedBackground has alpha 0 and is behind newImageViewWithInitialBackground

        [UIView animateWithDuration:0.3
                         animations:^
         {
             imageViewnormalalpha = 0;
             imageViewhighlighted.alpha = 1;
         }
                         completion:^(BOOL finished)
         {



         }];

在按钮的UIControlEventTouchUpInside操作中

[UIView animateWithDuration:0.3
                              animations:^
              {

             imageViewnormal.alpha = 1;
             imageViewhighlighted.alpha = 0;                  

              }
                              completion:^(BOOL finished)
              {

               //Remove both of the uiimageviews aand make your button visible
             [imageViewnormal removeFromSuperview];
             [mageViewhighlighted removeFromSuperview];
             yourbutton.alpha  = 1;     

              }];

答案 3 :(得分:2)

使用以下代码,它正常工作,我在我的项目中使用了这段代码:

    UIButton *myButton=[UIButton buttonWithType:UIButtonTypeRoundedRect];
    myButton.frame=CGRectMake(40, 20, 80, 25);
    [myButton setImage:[UIImage imageNamed:@"normalImage.png"] forState:UIControlStateNormal];
    [myButton setImage:[UIImage imageNamed:@"highlightedImage.png"] forState:UIControlStateHighlighted];
    [myButton addTarget:self action:nil forControlEvents:UIControlEventTouchUpInside];
    [self.view addSubview:myButton];

答案 4 :(得分:2)

xCode 7,iOS9

//for zoom in
    [UIView animateWithDuration:0.5f animations:^{

        self.sendButton.transform = CGAffineTransformMakeScale(1.5, 1.5);
    } completion:^(BOOL finished){}];
// for zoom out
        [UIView animateWithDuration:0.5f animations:^{

            self.sendButton.transform = CGAffineTransformMakeScale(1, 1);
        }completion:^(BOOL finished){}];