> For the complete documentation index, see [llms.txt](https://lochiwei.gitbook.io/ios/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://lochiwei.gitbook.io/ios/swiftui/view/modifier/examples/neumorphic.md).

# .neumorphic()

{% tabs %}
{% tab title="💈範例" %}
{% embed url="<https://youtu.be/LYgECFIVNII>" %}

```swift
struct ContentView: View {
    
    @State private var isPressed: Bool = false
    let color = Color.red
    
    var body: some View {
        Button{
            self.isPressed.toggle()
        } label: {
            Label("Hello", systemImage: "person")
                // 🌀 .neumorphic()
                .neumorphic(isPressed: $isPressed, color: color)
        }
        .frame(maxWidth: .infinity, maxHeight: .infinity)
        .background(color)
        .edgesIgnoringSafeArea(.all)
    }
}
```

{% endtab %}

{% tab title="🌀 .neumorphic()" %}

```swift
import SwiftUI

// ⭐ view modifier (with @Binding)
struct Neumorphic: ViewModifier {
    
    var color: Color
    @Binding var isPressed: Bool              // ⭐ Binding
    
    var s: CGFloat { isPressed ? 5: 15 }      // positive shadow offset
    var r: CGFloat { isPressed ? 7: 10 }      // shadow radius
    var k: CGFloat { isPressed ? 0.95 : 1}    // scale
    
    func body(content: Content) -> some View {
        content
            .padding(20)
            .background(
                ZStack {
                    RoundedRectangle(cornerRadius: 10, style: .continuous)
                        .shadow(color: .white, radius: r, x: -s, y: -s)
                        .shadow(color: .black, radius: r, x: s, y: s)
                        .blendMode(.overlay)
                    RoundedRectangle(cornerRadius: 10, style: .continuous)
                        .fill(color)
                }
            )
            .scaleEffect(k)
            .foregroundColor(.primary)
            .animation(.spring())
    }
}

// ⭐ view.neumorphic()
extension View {
    public func neumorphic(isPressed: Binding<Bool>, color: Color) -> some View {
        modifier(Neumorphic(color: color, isPressed: isPressed))
    }
}
```

{% endtab %}

{% tab title="📗 參考" %}

* [ ] Sarun ⟩ [SwiftUI ButtonStyle](https://sarunw.com/posts/swiftui-buttonstyle/)
  {% endtab %}

{% tab title="👥 相關" %}

* [Button](/ios/swiftui/control/button.md)
  {% endtab %}
  {% endtabs %}