UIStackView 中的 Lottie AnimationView 大小不明确

问题描述

我正在尝试将 5 个动画视图添加到 UIStackView,但我有布局问题:“AnimationView 的宽度和水平位置不明确”。所以我的 stackView 不能正常工作。 这是我创建动画视图的函数(我也尝试手动设置动画视图的框架 - 没有任何反应):

extension AnimationView  {
    public func configureCustomAnimationView(with animation: Animation?,speed: CGFloat) -> AnimationView {
        let animationView = AnimationView()
        animationView.animation = animation
        animationView.animationSpeed = speed
        animationView.translatesAutoresizingMaskIntoConstraints = false
        return animationView
    }
}

在我的 viewController 中,我创建了动画视图的 5 个属性

    private var sTaroneAnimation = AnimationView().configureCustomAnimationView(with: Animation.starsAnimation,speed: 1)
    
    private var starTwoAnimation = AnimationView().configureCustomAnimationView(with: Animation.starsAnimation,speed: 1)
    
    private var starThreeAnimation = AnimationView().configureCustomAnimationView(with: Animation.starsAnimation,speed: 1)
    
    private var starFourAnimation = AnimationView().configureCustomAnimationView(with: Animation.starsAnimation,speed: 1)
    
    private var starFiveAnimation = AnimationView().configureCustomAnimationView(with: Animation.starsAnimation,speed: 1)

我的堆栈视图:

    private var staRSStack: UIStackView = {
        let staRSStack = UIStackView()
        staRSStack.alignment = .center
        staRSStack.axis = .horizontal
        staRSStack.distribution = .equalCentering
        staRSStack.translatesAutoresizingMaskIntoConstraints = false
        return staRSStack
    }()
    public override func viewDidLoad() {
        super.viewDidLoad()
        staRSStack.addArrangedSubview(sTaroneAnimation)
        staRSStack.addArrangedSubview(starTwoAnimation)
        staRSStack.addArrangedSubview(starThreeAnimation)
        staRSStack.addArrangedSubview(starFourAnimation)
        staRSStack.addArrangedSubview(starFiveAnimation)
}

解决方法

将您的 stackView 更改为:

private var starsStack: UIStackView = {
    let starsStack = UIStackView()
    starsStack.alignment = .center
    starsStack.axis = .horizontal
    starsStack.distribution = .fillequally
    starsStack.translatesAutoresizingMaskIntoConstraints = false
    return starsStack
}()