• Stars
    star
    398
  • Rank 108,325 (Top 3 %)
  • Language
    Swift
  • License
    MIT License
  • Created over 4 years ago
  • Updated over 1 year ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

Craft that perfect SwiftUI button effect πŸ‘ŒπŸΌ

buttoncraft (SwiftUI App)

Experimenting with SwiftUI whilst creating a practical app to craft that perfect button style.

✈️ Testflight

https://testflight.apple.com/join/pZDhygQt

Last TestFlight bump: 27th January 2023

πŸ‘¨πŸ»β€πŸ’» Code outputted from app

struct MyButtonStyle: ButtonStyle {
    func makeBody(configuration: Self.Configuration) -> some View {
        configuration.label
            .background(Capsule()
                            .foregroundColor(configuration.isPressed ? Color.primary.opacity(0.75) : Color.primary))
            .scaleEffect(configuration.isPressed ? CGFloat(0.85) : 1.0)
            .rotationEffect(.degrees(configuration.isPressed ? 0.0 : 0))
            .blur(radius: configuration.isPressed ? CGFloat(0.0) : 0)
            .animation(Animation.spring(response: 0.35, dampingFraction: 0.35, blendDuration: 1), value: configuration.isPressed)
    }
}

extension Button {
    func myButtonStyle() -> some View {
        self.buttonStyle(MyButtonStyle())
    }
}

// to use
Button { } label: {
    Text("just like that")
        .font(Font.body.bold())
        .padding()
        .foregroundColor(Color.primary)
        .colorInvert()
}
.myButtonStyle()

Button { } label: {
    Image(systemName: "face.smiling")
        .font(Font.body.bold())
        .imageScale(.large)
        .padding()
        .foregroundColor(Color.primary)
        .colorInvert()
}
.myButtonStyle()

🧐 Features

  • πŸ”€ Randomise different settings for inspiration
  • Reset to my default style
  • Using the new iOS ColorPicker
  • Copy your perfect masterpiece as a code snippet to your clipboard

πŸ‘¨πŸ»β€βš–οΈ Disclaimer

This is posted as a way to share SwiftUI learnings (and is not production level code). Use it at your own risk.