Flutter Set Rounded Corner to ElevatedButton

To set rounded corner border to ElevatedButton we have to implement RoundedRectangleBorder() property on shape. It allow us to add radius property on Button widget which makes the button corner radius rounded.

Flutter Set Rounded Corner to ElevatedButton:

1. Implement shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(50.0)) on ElevatedButton.

ElevatedButton(
        style: ElevatedButton.styleFrom(
          fixedSize: const Size(160, 50),
          backgroundColor: Colors.purple,
          textStyle: const TextStyle(
            fontSize: 21,
          ),
          shape:
              RoundedRectangleBorder(borderRadius: BorderRadius.circular(50.0)),
        ),
        onPressed: temp,
        child: const Text(
          'Button',
          textAlign: TextAlign.center,
        ),
      ),

2. Source code for main.dart file:

import 'package:flutter/material.dart';

void main() => runApp(const App());

class App extends StatelessWidget {
  const App({super.key});

  void temp() {
    print('onPress Called...');
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        home: Scaffold(
            body: Center(
      child: ElevatedButton(
        style: ElevatedButton.styleFrom(
          fixedSize: const Size(160, 50),
          backgroundColor: Colors.purple,
          textStyle: const TextStyle(
            fontSize: 21,
          ),
          shape:
              RoundedRectangleBorder(borderRadius: BorderRadius.circular(50.0)),
        ),
        onPressed: temp,
        child: const Text(
          'Button',
          textAlign: TextAlign.center,
        ),
      ),
    )));
  }
}

Screenshot: