Нижняя внутренняя тень с закругленными углами

Question

Я пытаюсь воспроизвести следующий дизайн, и я борюсь с нижней внутренней тенью.

Я не нашел решения, отвечающего требованиям:

• только снизу
• содержится в округлом виде

и, в идеале, решение, работающее с UIButton.

Answer 1

Хотя это возможно, это немного сложнее, и вам потребуется рисовать тени, используя CGPath: https://developer.apple.com/documentation/quartzcore/calayer/1410771-shadowpath

Возможно, более простым способом было бы использовать изображение с изменяемым размером: https://developer.apple.com/documentation/uikit/uiimage/1624102-resizableimage

Вы бы сделали изображение меньшего размера, как показано ниже, а затем просто измените его размер, чтобы увеличить кадр следующим образом:

let resized = mockImage.resizableImage(withCapInsets: UIEdgeInsets(top: 16, left: 16, bottom: 16, right: 56), resizingMode: .stretch)

Answer 2

Я создал расширение кнопки для вас, чтобы добавить нижнюю тень. Пожалуйста, проверьте это. Вам просто нужно вызвать функцию bottomShadow () с вашей кнопкой refrence

например.

override func viewDidLoad() {
    super.viewDidLoad()
    // Do any additional setup after loading the view.
    self.button?.bottomShadow()
}


/*Button Extension*/

 extension UIButton {
    func bottomShadow() {
        let shadowHeight: CGFloat = 5.0
        let shadowframe = CGRect.init(x: 0, y: self.bounds.height - shadowHeight, width: self.bounds.width, height: shadowHeight)
        let path = UIBezierPath(roundedRect: shadowframe, byRoundingCorners: [.topLeft , .topRight], cornerRadii: CGSize(width: self.layer.cornerRadius, height: self.layer.cornerRadius))
        let mask = CAShapeLayer()
        mask.fillColor = UIColor.lightGray.cgColor
        mask.path = path.cgPath
        self.layer.addSublayer(mask)
    }
}