잘 다양한 앱으로 보이는 입체적이고 둥근 버튼을 만들어 보았습니다.
이런 녀석입니다.

환경

Xcode12.4
Swift5

코드 전체

먼저 위에서 만든 버튼의 코드를 올려 둡니다.

import UIKit

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        // ボタン作成
        let customButton = UIButton()

        // スクリーンサイズ取得
        let screenWidth:CGFloat = self.view.frame.width
        let screenHeight:CGFloat = self.view.frame.height

        // ボタンサイズ指定
        let buttonWidth: CGFloat = 100
        let buttonHeight: CGFloat = 100

        // ボタンに反映（中央に位置調整）
        customButton.frame = CGRect(
            x: screenWidth/2-buttonWidth/2,
            y: screenHeight/2-buttonHeight/2,
            width: buttonWidth,
            height: buttonHeight)

        // ボタンの背景色
        customButton.backgroundColor = UIColor.white

        // アプリ標準のシステム画像を設定
        customButton.setImage(UIImage(systemName: "location.fill"), for: .normal)
        // 画像の色をdarkGrayに変更
        customButton.tintColor = .darkGray

        // 縦幅・横幅いっぱいに画像を表示
        customButton.contentHorizontalAlignment = .fill
        customButton.contentVerticalAlignment = .fill

        // ボタンを丸くする(サイズ/2で設定)
        customButton.layer.cornerRadius = 50
        // 画像を縮小する(マージンのようなもの)
        customButton.imageEdgeInsets = UIEdgeInsets(top: 30, left: 30, bottom: 30, right: 30)

        // 影の色
        customButton.layer.shadowColor = UIColor.black.cgColor
        // 影のぼかし？
        customButton.layer.shadowRadius = 3
        // 影の位置
        customButton.layer.shadowOffset = CGSize(width: 1.5, height: 1.5)
        // 影の濃さ
        customButton.layer.shadowOpacity = 0.3

        // ボタンをViewに追加
        view.addSubview(customButton)
    }
}

해설

버튼 만들기

우선 버튼을 만들어 이미지를 설정해 봅니다.
버튼의 배경색은 흰색으로 보이지 않으므로 일시적으로 lightGray로 설정.

// ボタン作成
let customButton = UIButton()

// スクリーンサイズ取得
let screenWidth:CGFloat = self.view.frame.width
let screenHeight:CGFloat = self.view.frame.height

// ボタンサイズ指定
let buttonWidth: CGFloat = 100
let buttonHeight: CGFloat = 100

// ボタンに反映（中央に位置調整）
customButton.frame = CGRect(
    x: screenWidth/2-buttonWidth/2,
    y: screenHeight/2-buttonHeight/2,
    width: buttonWidth,
    height: buttonHeight)

// ボタンの背景色を設定(わかりやすいように一時的にlightGrayを設定)
customButton.backgroundColor = UIColor.lightGray

// アプリ標準のシステム画像を設定
customButton.setImage(UIImage(systemName: "location.fill"), for: .normal)
// 画像の色をdarkGrayに変更
customButton.tintColor = .darkGray

// ボタンをViewに追加
view.addSubview(customButton)

외형은 이런 느낌입니다.

이미지를 가득 채우기

이미지를 크게하고 싶기 때문에 Aligment를 fill로 하여 가득 채우기

// 縦幅・横幅いっぱいに画像を表示
customButton.contentHorizontalAlignment = .fill
customButton.contentVerticalAlignment = .fill

조금 너무 큽니다만, 일단 이대로.

버튼을 둥글게

드디어 버튼을 둥글게합니다.
값은 버튼 크기/2로 설정하면 둥글게 됩니다.

// ボタンを丸くする(サイズ/2で設定)
customButton.layer.cornerRadius = 50

이미지가 튀어 나오고 있지만 둥글게되었습니다.
방금 Aligment의 설정을 했습니다만, 과연 cornerRadius 를 고려해 자동적으로 작아서는 안 되는군요.

이미지의 크기 조정

이미지를 줄이려면 UIEdgeInsets 를 추가합니다.
버튼과 이미지 사이에 마진을 넣는 것처럼, 값이 커질수록 간격이 커지고 이미지가 작아집니다.

// 画像を縮小する(マージンのようなもの)
customButton.imageEdgeInsets = UIEdgeInsets(top: 30, left: 30, bottom: 30, right: 30)

이미지의 크기가 좋은 느낌이되었습니다.

버튼에 그림자 붙이기

마지막으로 버튼을 입체적으로 보여주기 위해 그림자를 붙입니다.
버튼의 배경색은 흰색입니다.

// ボタンの背景色を白に戻す
customButton.backgroundColor = UIColor.white
// 影の色
customButton.layer.shadowColor = UIColor.black.cgColor
// 影のぼかし？
customButton.layer.shadowRadius = 3
// 影の位置
customButton.layer.shadowOffset = CGSize(width: 1.5, height: 1.5)
// 影の濃さ
customButton.layer.shadowOpacity = 0.3

입체적이고 둥근 버튼의 완성입니다.

보충: 그림자 속성 정보

이번에 설정한 shadow의 속성이 무엇인지 각각 봅니다.

그림자 색상(shadowColor), 그림자 농도(shadowOpacity)

그림자의 색과 짙은 색이 그대로입니다.
예를 들어, 빨간색으로 더 어두워 보겠습니다.

// 影の色
customButton.layer.shadowColor = UIColor.red.cgColor
// 影の濃さ
customButton.layer.shadowOpacity = 0.9

이런 느낌입니다.

그림자 흐림? (shadowRadius)

이어서 그림자 흐림? 그렇죠?
값을 늘리면 그림자가 퍼집니다.

// 影のぼかし？
customButton.layer.shadowRadius = 50

그림자가 오이타 퍼졌습니다.

그림자 위치(shadowOffset)

마지막으로 그림자의 위치에 관한 것입니다.
값을 늘리면 그림자가 멀어집니다.

// 影の位置
customButton.layer.shadowOffset = CGSize(width: 30, height: 30)

그림자가 버튼에서 크게 벗어났습니다.

끝

끝까지 읽어 주셔서 감사합니다.
미비와 보충 등 있으면 가르쳐 주시면 도움이됩니다.