Create Button in Flutter – SwiftUI – Compose

mobile academy

Flutter:


import 'package:flutter/material.dart';

class CustomButton extends StatelessWidget {
  const CustomButton({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return ElevatedButton(
      style: ElevatedButton.styleFrom(
        shape: const RoundedRectangleBorder(
          borderRadius: BorderRadius.all(Radius.circular(8))
        )
      ),
      onPressed: () {

      }, 
      child: const Text('Next'),
    );
  }
}

SwiftUI:

import SwiftUI

struct ButtonView: View {
    var body: some View {
        Button {
            print("button clicked")
        } label: {
            Text("Next")
                .font(.system(size: 18))
                .frame(width: 220, height: 50)
                .background(Color.pink)
                .foregroundColor(Color.white)
                .cornerRadius(8)           
            
        }

    }
}

struct ButtonView_Previews: PreviewProvider {
    static var previews: some View {
        ButtonView()
    }
}

Compose:

@Composable
fun CustomButton(label: String) {
    Button(
        colors = ButtonDefaults.buttonColors(backgroundColor = Color.Red, contentColor = Color.White),
        modifier = Modifier
            .clip(RoundedCornerShape(8))
            .width(220.dp)
            .padding(8.dp),

        onClick = {

        }
    ) {
        Text(text = label)

    }
}
Select your currency
USD United States (US) dollar