Search code examples
flutterflutter-animation

I want my flutter container to have similar kind of squirecircle ui like on css

enter image description here

i am trying to create similar squircle box on flutter like css but no option to change top-center, botom-center, left-center and right-center border. is there any workaround to do so.

no option to achieve similar results.

import 'package:flutter/material.dart';

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

  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(22), color: Colors.amber),
    );
  }
}
Solution

  • Flutter provide a way to clip a widget's borders which appears like continuous rectangle border.

    If you seek a smooth clip, there are some packages that provide that. look at that answer