如何在ios swift中的視圖控制器中的每個頁面頂部堆疊圓形視圖？

Question

我有一個要實現的設計，其中三個圓形視圖堆疊在一起。 我不知道如何實現這一點，因為當我將它們放在彼此面前時它不起作用。 我正在使用故事板並以編程方式調整視圖的設置。 如何做到這一點？

這是我很難嘗試和實現的設計。

Answer 1

好的，所以我玩了一點故事板，我設法重新創建了你想要的東西。

結果是

故事板是

最后的代碼是

import UIKit

class ViewController: UIViewController {


    @IBOutlet weak var redView: UIView!
    @IBOutlet weak var yellowView: UIView!
    @IBOutlet weak var blueView: UIView!


    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view.
        UIView.animate(withDuration: 0.0) {
            UIView.addCornerRadiusToViews(views: [self.redView, self.yellowView,self.blueView], cornerRadius: 50)
            self.redView.dropShadow(color: UIColor.black, offSet: CGSize(width: 5.0, height: 5.0))
            self.yellowView.dropShadow(color: UIColor.black, offSet: CGSize(width: 5.0, height: 5.0))
            self.blueView.dropShadow(color: UIColor.black, offSet: CGSize(width: 5.0, height: 5.0))


            self.view.layoutIfNeeded()
        }
    }
}

extension UIView {

    func dropShadow(color: UIColor, opacity: Float = 0.5, offSet: CGSize, radius: CGFloat = 50, scale: Bool = true) {
        layer.masksToBounds = false
        layer.shadowColor = color.cgColor
        layer.shadowOpacity = opacity
        layer.shadowOffset = offSet
        layer.shadowRadius = radius
        layer.shadowPath = UIBezierPath(rect: self.bounds).cgPath
        layer.shouldRasterize = true
        layer.rasterizationScale = scale ? UIScreen.main.scale : 1
    }

    static func addCornerRadiusToViews(views: [UIView], cornerRadius: CGFloat) {
        views.forEach { (view) in
            view.layer.cornerRadius = cornerRadius
            view.layer.masksToBounds = true
        }
    }

}

您可以將 roundCorner 值和陰影偏移值更改為像素完美。