programing

UIView 바운스 애니메이션을 만드는 방법은 무엇입니까?

sourcejob 2023. 8. 7. 22:30
반응형

UIView 바운스 애니메이션을 만드는 방법은 무엇입니까?

UIView에 대해 다음과 같은 CAT 전환이 있습니다.finalScoreView위에서 화면으로 들어갑니다.

CATransition *animation = [CATransition animation];
animation.duration = 0.2;
animation.type = kCATransitionPush;
animation.subtype = kCATransitionFromBottom;
animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseIn];

[gameOver.layer addAnimation:animation forKey:@"changeTextTransition"];
[finalScoreView.layer addAnimation:animation forKey:@"changeTextTransition"];

내려오면 한 번 튕겨지고 가만히 있게 하려면 어떻게 해야 하나요?위에서 화면으로 들어오다가 아래로 내려오면 튕겨야 합니다.

어떤 도움이라도 주시면 감사하겠습니다, 감사합니다!

보다 간단한 대안UIDynamicAnimatoriOS 7에서는 Spring Animation(새롭고 강력한 UIView 블록 애니메이션)으로 댐핑과 속도로 멋진 튕김 효과를 제공합니다.목표 C

[UIView animateWithDuration:duration
  delay:delay
  usingSpringWithDamping:damping
  initialSpringVelocity:velocity
  options:options animations:^{
    //Animations
    }
  completion:^(BOOL finished) {
    //Completion Block
}];

스위프트

UIView.animateWithDuration(duration,
     delay: delay,
     usingSpringWithDamping: damping,
     initialSpringVelocity: velocity,
     options: options,
     animations: {
            //Do all animations here
            }, completion: {
            //Code to run after animating
                (value: Bool) in
        })

스위프트 4.0

UIView.animate(withDuration:duration,
     delay: delay,
     usingSpringWithDamping: damping,
     initialSpringVelocity: velocity,
     options: options,
     animations: {
            //Do all animations here
            }, completion: {
            //Code to run after animating
                (value: Bool) in
        })

usingSpringWithDamping0.0 == 매우 탄력적입니다. 1.0은 오버슈팅 없이 부드럽게 감속합니다.

initialSpringVelocity는 대략 "원하는 초 단위로 나눈 거리"입니다. 1.0은 1초 동안 총 애니메이션 거리에 해당합니다.예를 들어, 총 애니메이션 거리가 200점이고 애니메이션 시작이 100pt/s의 뷰 속도와 일치하도록 하려면 0.5를 사용합니다.

자세한 튜토리얼 및 샘플 앱은 이 튜토리얼에서 확인할 수 있습니다.나는 이것이 누군가에게 유용하기를 바랍니다.

iOS7 및 UIKit Dynamics를 사용하면 더 이상 사용할 필요가 없습니다.CAKeyframeAnimations또는UIView애니메이션!

Apple의 UIKit Dynamics Catalog 앱을 살펴 보십시오.대신에, Tehanlax는 전체 프로젝트 github 함께 명확하고 간결한 튜토리얼을 가지고 있습니다.역학의 내부 및 외부에 대한 보다 자세한 튜토리얼을 원한다면 Ray Winderlich 튜토리얼이 좋습니다.항상 그렇듯이 Apple 문서는 훌륭한 첫 번째 단계이므로 문서에서 UIDynamic Animator Class 참조를 확인하십시오.

다음은 틴한랙스 튜토리얼의 코드입니다.

self.animator = [[UIDynamicAnimator alloc] initWithReferenceView:self.view];

UIGravityBehavior *gravityBehavior = 
                [[UIGravityBehavior alloc] initWithItems:@[self.redSquare]];
[self.animator addBehavior:gravityBehavior];
    
UICollisionBehavior *collisionBehavior = 
                [[UICollisionBehavior alloc] initWithItems:@[self.redSquare]]; 
collisionBehavior.translatesReferenceBoundsIntoBoundary = YES;
[self.animator addBehavior:collisionBehavior];
    
UIDynamicItemBehavior *elasticityBehavior = 
                [[UIDynamicItemBehavior alloc] initWithItems:@[self.redSquare]];
elasticityBehavior.elasticity = 0.7f;
[self.animator addBehavior:elasticityBehavior];

그리고 여기 결과가 있습니다.

Square bounce

UIKit Dynamics는 iOS7에 추가된 매우 강력하고 사용하기 쉬운 추가 기능으로, 보기 좋은 UI를 얻을 수 있습니다.

다른 예:

Button bounce

Slide bounce

Springy collection

WWDC spring collection

UIKit 역학을 구현하는 단계는 항상 동일합니다.

  1. 작성UIDynamicAnimator그리고 그것을 튼튼한 물건에 보관합니다.
  2. 하나 이상 만들기UIDynamicBehaviors각 동작에는 하나 이상의 항목(일반적으로 애니메이션을 만들 보기)이 있어야 합니다.
  3. 사용된 항목의 초기 상태를 확인합니다.UIDynamicBehaviors의 유효한 상태입니다.UIDynamicAnimator모의 실험

애니메이션 제작을 돕기 위해 만든 데모 프로젝트가 있습니다.맛있게 드세요!

스프링 댐핑 데모

enter image description here

- (IBAction)searchViewAction:(UIButton*)sender
{
  if(sender.tag == 0)
  {
    sender.tag = 1;

    CGRect optionsFrame2 = self.defaultTopView.frame;
    optionsFrame2.origin.x = -320;

    CGRect optionsFrame = self.searhTopView.frame;
    optionsFrame.origin.x = 320;
    self.searhTopView.frame = optionsFrame;

    [UIView animateWithDuration:1.0 delay:0.0 usingSpringWithDamping:0.5 initialSpringVelocity:1.0 options:0 animations:^{

        CGRect optionsFrame = self.searhTopView.frame;

        optionsFrame.origin.x = 0;
        self.searhTopView.frame = optionsFrame;
        self.defaultTopView.frame = optionsFrame2;
    } completion:^(BOOL finished) {
    }];        
}
else
{
    sender.tag = 0;

    CGRect optionsFrame2 = self.defaultTopView.frame;
    optionsFrame2.origin.x = 0;

    CGRect optionsFrame = self.searhTopView.frame;
    optionsFrame.origin.x = 320;

    [UIView animateWithDuration:1.0 delay:0.0 usingSpringWithDamping:0.5 initialSpringVelocity:1.0 options:0 animations:^{

        CGRect optionsFrame = self.searhTopView.frame;

        optionsFrame.origin.x = 320;
        self.searhTopView.frame = optionsFrame;
        self.defaultTopView.frame = optionsFrame2;
    } completion:^(BOOL finished) {
    }];
}
}

언급URL : https://stackoverflow.com/questions/21892105/how-to-create-a-uiview-bounce-animation

반응형