SwiftUI 4 introduced ShadowStyle which is used to style shadows. It provides two static functions for custom shadow styles.
.drop(color:radius:x:y)
creates a custom drop shadow style. Drop shadow draw behind the source content by blurring, tinting and offsetting its per-pixel alpha values.
.inner(color:radius:x:y)
creates a custom inner shadow style. Inner shadows draw on top of the source content by blurring, tinting, inverting and offsetting its per-pixel alpha values.
In this article, we will use these two ShadowStyles to create a Neumorphic button.
Let’s start by defining the view.
struct DevTechieNeumorphicButtonExample: View { }
We will add two color properties, one for off white color and another for shadow color.
let offWhiteColor = Color(red: 236/255, green: 234/255, blue: 235/255)let shadowColor = Color(red: 197/255, green: 197/255, blue: 197/255)
For view’s body, we will ZStack which will host off white color to act as a background for our view. We also want to ignore safe area so Color view can expand to cover the entire screen.
struct DevTechieNeumorphicButtonExample: View {
let offWhiteColor = Color(red: 236/255, green: 234/255…