时间戳

首页 > 解决方案 > 如何快速为标签位置设置动画？

ios - 如何快速为标签位置设置动画？

问题描述

我只有一个简单的标签：

在此处输入图像描述

到目前为止，这是我的代码：

@IBOutlet weak var label: UILabel!


@IBAction func onTap(_ sender: Any) {


}

当我单击 tapGesture 时，我希望标签将其位置动画到屏幕底部，然后当我再次单击时动画到中心。基本上只是切换回来和第四。在我的 Xcode 项目中，我添加了一个上滑菜单，但遇到了一些麻烦，因为我还没有真正用 swift 的界面做任何事情。回答这个问题会让我走上我认为的正确轨道。

标签： iosswiftxcodeanimation

解决方案

你可以这样做：

class ViewController: UIViewController {

    private let label: UILabel = {
        let label = UILabel()
        label.translatesAutoresizingMaskIntoConstraints = false
        label.text = "My Label"
        label.font = UIFont.systemFont(ofSize: 24)
        return label
    }()
    
    private var labelIsDown = false
    
    private var bottomConstraint: NSLayoutConstraint!
    private var centerYConstraint: NSLayoutConstraint!
    private var centerXConstraint: NSLayoutConstraint!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        view.addSubview(label)
        
        let gestureRecognizer = UITapGestureRecognizer(target: self, action: #selector(respondToTap))
        label.isUserInteractionEnabled = true
        label.addGestureRecognizer(gestureRecognizer)
        
        setupLabelConstraints()
    }
    
    private func setupLabelConstraints() {
        bottomConstraint = label.bottomAnchor.constraint(equalTo: view.safeAreaLayoutGuide.bottomAnchor)
        centerYConstraint = label.centerYAnchor.constraint(equalTo: view.centerYAnchor)
        centerXConstraint = label.centerXAnchor.constraint(equalTo: view.centerXAnchor)
        
        centerXConstraint.isActive = true
        centerYConstraint.isActive = true
    }
    
    @objc private func respondToTap() {
        if labelIsDown {
            bottomConstraint.isActive = false
            centerYConstraint.isActive = true
        } else {
            centerYConstraint.isActive = false
            bottomConstraint.isActive = true
        }
        
        UIView.animate(withDuration: 0.5, animations: {
            self.view.layoutIfNeeded()
        }) { (_) in
            self.labelIsDown.toggle()
        }
    }
}

所以这里的关键是设置约束，然后动画它们的变化......
如果你想为基于故事板的项目获得相同的结果，我假设你必须为你的约束创建出口......

推荐阅读