动画显示按钮 [英] Animated display button

问题描述

我正在尝试创建一个基本的动画.我需要触摸一个按钮来隐藏或显示.

I'm trying to create a basic animation. I need to touch on a button to hide or show.

我写了这段代码来点击屏幕:

I wrote this code to tap on the screen:

func visibleControlButton(_ sender: UITapGestureRecognizer) {
    if (backButton!.isHidden) {
        _UIButtonHiddenAnimation.hiddenAnimation(button: self.backButton!, hide: false)
    } else {
        _UIButtonHiddenAnimation.hiddenAnimation(button: self.backButton!, hide: true)
    }
}

定义_UIButtonHiddenAnimation:

Definition _UIButtonHiddenAnimation:

 class _UIButtonHiddenAnimation {
    class func hiddenAnimation(button: UIButton, hide: Bool) {
        UIView.animate(withDuration: 0.2,
                       animations: {
                            hide ? (button.alpha = 0) : (button.alpha = 1.0)
                        },
                       completion: {
                            finished in hide ? (button.isHidden = true) : (button.isHidden = false)
                        })
    }
}

动画只是隐藏按钮.如何制作按钮的动画外观?

Animates just hide the button. How to make an animated appearance of a button?

推荐答案

问题是，如果按钮被隐藏，您将 alpha 动画设置为 1，但我们看不到——因为按钮被隐藏了！然后将 isHidden 设置为 false，按钮就会跳到视图中.

The problem is that if the button is hidden, you are animating the alpha to 1 but we cannot see that — because the button is hidden! Then you set isHidden to false and the button jumps into view.

解决方案:忘记所有关于 isHidden 的事情，只更改 alpha — 然后更改您的 if 测试以匹配您对按钮所做的操作，即简单地测试它的 alpha 值.因此(随着我们的进行整理):

The solution: forget all about isHidden and change only the alpha — and then change your if test to match what you are doing with the button, i.e. simply test against its alpha value. Thus (neatening things up as we go):

class _UIButtonHiddenAnimation {
    class func hiddenAnimation(button: UIButton, hide: Bool) {
        UIView.animate(withDuration: 0.2, animations: {
            button.alpha = hide ? 0 : 1.0
        })
    }
}

func visibleControlButton(_ sender: UITapGestureRecognizer) {
    _UIButtonHiddenAnimation.hiddenAnimation(
        button: self.backButton!, hide: backButton!.alpha > 0.1)
}

这篇关于动画显示按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！