How to Create a Circle Shape in Flutter

Sometimes, the user interface of a mobile app can be complex. We may need to add custom shapes for design purposes. In this Flutter example, Iet’s see how to create a round shape in flutter easily.

You can create a circle in flutter easily using Container, BoxDecoration and BoxShape widgets as given below.

Container(
      width: 300.0,
      height: 300.0,
      decoration: new BoxDecoration(
        color: Colors.blue,
        shape: BoxShape.circle,
      ),)

Following is the complete Flutter circle shape example.

import 'package:flutter/material.dart';
void main() => runApp(App());

class App extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Circle Example',
      home: FlutterExample(),
    );
  }
}

class FlutterExample extends StatelessWidget {
  FlutterExample({Key key}) : super(key: key);


  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: Center(child:Container(
      width: 300.0,
      height: 300.0,
      decoration: new BoxDecoration(
        color: Colors.blue,
        shape: BoxShape.circle,
      ),),));
}

}

The output is as given below.

I hope this simple flutter tutorial will be helpful for you.