[SwiftUI]Image(画像)に影をつけるには？

どうも、ちょげ(@chogetarou)です。

Imageの画像に影をつける方法を紹介します。

方法

Imageの画像に影をつけるには、shadow修飾子を使います。

具体的には、Imageにshadow修飾子を付与します。

shadow修飾子の引数には、影の設定を指定します。

Image("image")
    .shadow(・・・)

shadow修飾子を付与することで、Imageに影をつけることが出来ます。

//大きさの設定
Image("image")
    .shadow(radius: 大きさ)

//色と大きさの設定
Image("image")
    .shadow(color: 色, radius: 大きさ)

//色と大きさと位置の設定
Image("image")
    .shadow(color: 色, radius: 大きさ, x: 横方向の位置, y: 縦方向の位置)

使用例

struct ContentView: View {
    var body: some View {
        VStack {
            Image(systemName: "heart")
                .resizable()
                .scaledToFit()
                .padding()
                .shadow(radius: 10)
            
            Image(systemName: "heart")
                .resizable()
                .scaledToFit()
                .padding()
                .shadow(color: .red, radius: 10)
        }
    }
}