首页 > 解决方案 > Swift - 具有最小分段的动画线性图

问题描述

我有一个线性图视图,基本上只有三个视图。它们代表投资组合中某些资产的百分比。因此,当我单击一个按钮时,我会调用update(multipliers: [CGFloat])并开始动画。但是,我遇到了一些问题。想象一下,如果我有 10000 美元的股票、5000 美元的债券和 1 美元的 ETF。ETF 视图根本不可见,因为它太小了。但即使在这种情况下,我也想显示一个 10px 或其他宽度的视图。我怎样才能做到这一点?另外,我的调试器一直在警告我

无法同时满足约束。以下列表中的至少一个约束可能是您不想要的。

这是可以理解的,但由于乘数和常数与宽度不匹配,我认为这是不可修复的。

那么,我该如何解决这个问题呢?

import UIKit

class StripView: UIView {
    
    var stocksConstraint = NSLayoutConstraint()
    var bondsConstraint = NSLayoutConstraint()
    var etfConstraint = NSLayoutConstraint()
    
    let stocksView: UIView = {
        let view = UIView()
        view.backgroundColor = .lightGray
        view.layer.cornerRadius = 4
        return view
    }()
    
    let bondsView: UIView = {
        let view = UIView()
        view.backgroundColor = .lightGray
        view.layer.cornerRadius = 4
        return view
    }()
    
    let etfView: UIView = {
        let view = UIView()
        view.backgroundColor = .lightGray
        view.layer.cornerRadius = 4
        return view
    }()
    
    override init(frame: CGRect) {
        super.init(frame: frame)
        
        backgroundColor = .clear
        layer.cornerRadius = 4
        layer.masksToBounds = true
        
        setupViews()
    }
    
    required init?(coder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }
    
    func update(multipliers: [CGFloat]) {
        stocksView.removeConstraint(stocksConstraint)
        stocksConstraint = stocksView.widthAnchor.constraint(equalTo: widthAnchor, multiplier: multipliers[0])
        stocksConstraint.isActive = true
                
        bondsView.removeConstraint(bondsConstraint)
        bondsConstraint = bondsView.widthAnchor.constraint(equalTo: widthAnchor, multiplier: multipliers[1])
        bondsConstraint.isActive = true
        
        
        etfView.removeConstraint(etfConstraint)
        etfConstraint = etfView.widthAnchor.constraint(equalTo: widthAnchor, multiplier: multipliers[2])
        etfConstraint.isActive = true
        
        UIView.animate(withDuration: 1.0) {
            
            self.layoutIfNeeded()
            
            self.stocksView.backgroundColor = .systemRed
            self.bondsView.backgroundColor = .systemGreen
            self.etfView.backgroundColor = .systemBlue
            
        }
        
    }
    
    func setupViews() {
        
        let views = [stocksView, bondsView, etfView]
        
        views.forEach {
            $0.translatesAutoresizingMaskIntoConstraints = false
            addSubview($0)
        }
        
        stocksConstraint = stocksView.widthAnchor.constraint(equalTo: widthAnchor, multiplier: 0.33)
        bondsConstraint = bondsView.widthAnchor.constraint(equalTo: widthAnchor, multiplier: 0.33)
        etfConstraint = etfView.widthAnchor.constraint(equalTo: widthAnchor, multiplier: 0.33)
        
        
        NSLayoutConstraint.activate([
            stocksView.topAnchor.constraint(equalTo: topAnchor),
            stocksView.bottomAnchor.constraint(equalTo: bottomAnchor),
            stocksView.leadingAnchor.constraint(equalTo: leadingAnchor),
            stocksConstraint,
            
            bondsView.topAnchor.constraint(equalTo: topAnchor),
            bondsView.bottomAnchor.constraint(equalTo: bottomAnchor),
            bondsView.leadingAnchor.constraint(equalTo: stocksView.trailingAnchor, constant: 2),
            bondsConstraint,
            
            etfView.topAnchor.constraint(equalTo: topAnchor),
            etfView.bottomAnchor.constraint(equalTo: bottomAnchor),
            etfView.leadingAnchor.constraint(equalTo: bondsView.trailingAnchor, constant: 2),
            etfConstraint
        ])
        
    }
    
}

标签: iosswift

解决方案


推荐阅读