带有闪烁的小故障ios动画

时间:2018-04-23 23:42:43

标签: ios swift xcode uiviewanimation visual-glitch

制作iOS应用程序,当我在模拟器上运行代码时,故障是可以忍受的,但在iPhone上进行测试时,它们更加明显。我正在使用JHChainableAnimations制作它们,动画在屏幕上滞后并闪烁。我会发布一张图片,但我不知道如何上传最新的gif。

我研究解决了故障,我找到的解决方案是我的背景设置为一种颜色,我应该使用慢动画来解决它,但这两种都不合适。视图中的背景颜色为零,慢动画不起作用(我假设它是因为JHChainableAnimations不允许slomo动画)

如果这个问题是一个框架问题而不是另一个问题,那么我会喜欢关于优秀动画框架的pod建议!

以下是代码的图片:

Declarations in Class

viewDidLoad() part 1viewDidLoad() part 2

下面是动画的代码:

制作一堆circles collapse

的代码

使check mark slide从按钮后面退出以确认选择的代码

最后点击开始/操作按钮时出现的主要动画代码part 1part 2

编辑: 以下是代码中没有图像的一些重要部分:

折叠圈子:

@objc func animateCircleClose() {
    guard let circle1Animator = circle1Animator else {
        return
    }
    guard let circle2Animator = circle2Animator else {
        return
    }
    guard let circle3Animator = circle3Animator else {
        return
    }
    guard let circle4Animator = circle4Animator else {
        return
    }
    guard let circle5Animator = circle5Animator else {
        return
    }
    guard let topanimator = topanimator else {
        return
    }
    guard let botanimator = botanimator else {
        return
    }

    circle1Animator.make(scale: 0).animate(t: 0.8);
    circle2Animator.thenAfter(t: 0.2).make(scale: 0).animate(t: 0.4);
    circle3Animator.thenAfter(t: 0.4).make(scale: 0).animate(t: 0.4);
    circle4Animator.thenAfter(t: 0.6).make(scale: 0).animate(t: 0.4);
    circle5Animator.thenAfter(t: 0.8).make(scale: 0).animate(t: 0.4);

    botanimator.thenAfter(t: 1.2).move(y: -300).easeInBack.animate(t: 0.3);
    topanimator.thenAfter(t: 1.2).move(y: -300).easeInBack.animate(t: 0.3);
}

继续按钮动画:

@objc func animateHappyButton() {
    guard let happyBackingAnimator = happyBackingAnimator else {
        return
    }
    if(!selected){
        happyBacking.isHidden = false;
        happyBackingAnimator.move(x: -20).easeOut.animate(t: 0.3);
        selected = true;
        selectedHappy = true;
    }
    else if(selectedHappy){
        happyBackingAnimator.move(x: 20).easeOut.animate(t: 0.3);
        selected = false;
        happyBacking.isHidden = true;
        selectedHappy = false;
    }
    else{
        if(selectedWorried){
            animateWorriedButton();
        }
        if(selectedSad){
            animateSadButton();
        }
        if(selectedExcited){
            animateExcitedButton();
        }

        happyBacking.isHidden = false;
        happyBackingAnimator.move(x: -20).easeOut.animate(t: 0.3);
        selected = true;
        selectedHappy = true;
    }
}

这是最大的主要动画功能,为了你的眼睛,我省略了所有的守护语句,但你可以在截图中看到它们

@objc func animateView() {    
    circle1Animator.make(scale: 0.1).animate(t: 0);
    circle2Animator.make(scale: 0.1).animate(t: 0);
    circle3Animator.make(scale: 0.1).animate(t: 0);
    circle4Animator.make(scale: 0.1).animate(t: 0);
    circle5Animator.make(scale: 0.1).animate(t: 0);

    button.isUserInteractionEnabled = false
    let buttonAnimator = ChainableAnimator(view: button)

    topanimator.completion = { [unowned self] in

        self.circle1.isHidden = false;
        self.circle2.isHidden = false;
        self.circle3.isHidden = false;
        self.circle4.isHidden = false;
        self.circle5.isHidden = false;

        self.excitedButton.isHidden = false;
        self.happyButton.isHidden = false;
        self.sadButton.isHidden = false;
        self.worriedButton.isHidden = false;

        circle1Animator.make(scale: 10).easeOut.animate(t: 1);
        circle2Animator.make(scale: 10).easeOut.animate(t: 1);
        circle3Animator.make(scale: 10).easeOut.animate(t: 1);
        circle4Animator.make(scale: 10).easeOut.animate(t: 1);
        circle5Animator.make(scale: 10).easeOut.animate(t: 1);


        happyAnimator.move(x: -245).easeOut.animate(t: 0.3);
        excitedAnimator.thenAfter(t: 0.2).move(x: -245).easeOut.animate(t: 0.3);
        worriedAnimator.thenAfter(t: 0.4).move(x: -245).easeOut.animate(t: 0.3);
        sadAnimator.thenAfter(t: 0.6).move(x: -245).easeOut.animate(t: 0.3);

        self.tagMood.isHidden = false;
    }

    buttonAnimator.move(y: 50).easeInOutExpo.animate(t: 0.5)

    topimg.isHidden = false;
    botimg.isHidden = false;
    botanimator.move(y: -458).easeOutQuart.animate(t: 0.3);
    topanimator.move(y: 228).easeOutQuart.animate(t: 0.3);
    worriedAnimator.move(x: 285).animate(t: 0);
    excitedAnimator.move(x: 285).animate(t: 0);
    happyAnimator.move(x: 285).animate(t: 0);
    sadAnimator.move(x: 285).animate(t: 0);
}

1 个答案:

答案 0 :(得分:0)

所以问题出在框架上,当使用JHChainableAnimations时,你需要具体使用以下内容:

{{1}}

它自己的回购没有正确更新以解决问题,但将上述内容放入您的podfile中将会修复它