Button

Tetiklendiği zaman aksiyon almamızı sağlayan bir kontrol bileşeni.

Kullanım

// 1) En temel kullanım
// Bu kullanımda text'e müdahil olmaktan feragat etmiş oluyoruz.
Button("Button Title") {
    // Aksiyon
}
.padding()
.background(Color.green)

// 2) Burada ise Text'i istediğimiz gibi düzenleyebiliriz.
Button(action: {
    // Aksiyon
}) {
    Text("Button Title")
        .fontWeight(.bold)
        ...
        ...
}

Custom Style

struct MyButtonStyle: ButtonStyle {
    func makeBody(configuration: Configuration) -> some View {
        LinearGradient(
            gradient: .init(colors: [.red, .orange]),
            startPoint: .leading,
            endPoint: .trailing
        )
        .clipShape(Capsule())
        .overlay(
            // ** Burada asıl Text'i yerleştiriyoruz.
            configuration.label
                .foregroundColor(.white)
        )
        .frame(height: 50) // Default height
        .padding() // Default padding
    }
}

// Custom Style kullanımı
Button("Tap Me !!") {
    // Aksiyon
}
.buttonStyle(MyButtonStyle())
.font(.system(size: 20, weight: .bold, design: .monospaced))

Custom style neticemiz aşağıdaki gibi gözlemlenebilir.

custom styled button

Mesela uygulama içinde sık kullanılan tasarımlar var ise, bu tarz Custom Style oluşturarak kod tekrarından kurtulabiliriz.