【Swift】UIをニューモーフィズムにする

概要

アプリのデザインをニューモーフィズム(Neumorphism)にする方法をまとめる。

ライブラリを使用する

実装方法

import EMTNeumorphicView

例　DatePickerの裏に配置したViewに修飾を加える場合

    let LIGHTSHADOWOPACITY: Float = 0.3 // 明るい影
    let DARKSHADOWOPACITY: Float = 0.5  // 暗い影
    let ELEMENTDEPTH: CGFloat = 6       // 影の深さ
    let edged = false                   // 縁取りをつけるかどうか

    @IBOutlet var datePickerView: EMTNeumorphicView!
    
    // UIパーツのデザインを指定する
    private func createButtons() {

        if let datePickerView = datePickerView {
            datePickerView.neumorphicLayer?.cornerRadius = 15
            datePickerView.neumorphicLayer?.lightShadowOpacity = LIGHTSHADOWOPACITY
            datePickerView.neumorphicLayer?.darkShadowOpacity = DARKSHADOWOPACITY
            datePickerView.neumorphicLayer?.edged = edged
            datePickerView.neumorphicLayer?.elementDepth = ELEMENTDEPTH
            datePickerView.neumorphicLayer?.elementBackgroundColor = UIColor.Background.cgColor
        }

完成形