SwiftUI Button

SwiftUI buttons are not like Flutter buttons. They are also not like widgets. They call it control. So Button is a control in SwiftUI.

Controls enable user interaction with consistent APIs that adapt to their platform and context

Simple Button

Let's go ahead a create a simplest type of button in swiftui. Just put a Button (a control) inside VStack or HStack. Here you go

  VStack {
            Button{
                //your events go here
            }label: {
                //your views go here
            }
        }

In the above case inside label, you may show your view. And that would be your Button name. If you don't want to use label, you can mention the button name like below

        VStack {
            Button("Here"){
                //your events go here
            }
        }

But you won't be able to use Button name if you mention both in label and in the parenthesis of the button. You will get error like below

        VStack {
            Button("Here"){
                //your events go here
            }label: {
                Text("hi")
            }        
        }

Style Button

Once you know how Buttons work in SwiftUI, then it's easy to style them, they are just like other controls or view to style. Just add the below properties tag with Button curly braces.

.padding()
.background(.blue)
.foregroundColor(.white)
.clipShape(Capsule())

Of course you can add more of the functions and style your button as you want. Now your button may look like this

        VStack {
            Button{
                //your events go here
            }label: {
                 Text("Hello there").font(.system(size: 28))
            }.padding()
                .background(.blue)
                .foregroundColor(.white)
                .clipShape(Capsule())
        }

Here I have added font size to Text() view, so that it looks better.