In Flutter, how can I create a shape like this XML shape I created in android java app

I created an android app in java and I had this xml shape in it:

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<corners android:radius="20dp"/>
<padding android:left="10dp" android:right="10dp" android:top="10dp" android:bottom="10dp"/>
<stroke android:width="1dp" android:color="@color/DodgerBlue"/>
<solid android:color="@color/White" />

enter image description here

Now I am creating a flutter app, so I am trying to create the same shape in flutter, but I had no luck.

Can someone guide me on how to do this ?



  • The simplest way to add border radius and border width is a container using BoxDecoration

    import 'package:flutter/material.dart';
    void main() {
      runApp(const App());
    class App extends StatelessWidget {
      const App();
      Widget build(BuildContext context) {
        return MaterialApp(
          home: Scaffold(
              body: Center(
            child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
      Widget _simpleBorder() => Container(
            width: 200,
            height: 50,
            decoration: BoxDecoration(
                borderRadius: BorderRadius.circular(20),
                border: Border.all(color: Colors.blue)),


    There are more advanced ways using shapes in Flutter. If this does not solve your question I can provide more info on shapes