Instance Method インスタンスメソッド

shadow(color:radius:x:y:)

Adds a shadow to this view. 影をこのビューに加えます。

Declaration 宣言 

func shadow(color: Color = Color(.sRGBLinear, white: 0, opacity: 0.33), radius: CGFloat, x: CGFloat = 0, y: CGFloat = 0) -> some View

Return Value 戻り値

A view that adds a shadow to this view. あるビュー、それはこのビューに影を加えたものです。

Parameters パラメータ

color

The shadow’s color. 影の色。

radius

A measure of how much to blur the shadow. Larger values result in more blur.

x

An amount to offset the shadow horizontally from the view.

y

An amount to offset the shadow vertically from the view.

Discussion 議論

Use this modifier to add a shadow of a specified color behind a view. You can offset the shadow from its view independently in the horizontal and vertical dimensions using the x and y parameters. You can also blur the edges of the shadow using the radius parameter. Use a radius of zero to create a sharp shadow. Larger radius values produce softer shadows.

The example below creates a grid of boxes with varying offsets and blur. Each box displays its radius and offset values for reference.


struct Shadow: View {
    let steps = [0, 5, 10]


    var body: some View {
        VStack(spacing: 50) {
            ForEach(steps, id: \.self) { offset in
                HStack(spacing: 50) {
                    ForEach(steps, id: \.self) { radius in
                        Color.blue
                            .shadow(
                                color: .primary,
                                radius: CGFloat(radius),
                                x: CGFloat(offset), y: CGFloat(offset))
                            .overlay {
                                VStack {
                                    Text("\(radius)")
                                    Text("(\(offset), \(offset))")
                                }
                            }
                    }
                }
            }
        }
    }
}

A three by three grid of blue boxes with shadows.

The example above uses primary as the color to make the shadow easy to see for the purpose of illustration. In practice, you might prefer something more subtle, like gray. If you don’t specify a color, the method uses a semi-transparent black.