Skip to content

Rounded rectangle with smoother transition between straight and curved parts used in macOS and iOS.

License

Notifications You must be signed in to change notification settings

widgetbakery/cupertino_rrect

Repository files navigation

Rounded rectangle with smoother transition between straight and curved parts used in macOS and iOS.

Below is a cupertino rounded rectangle (squircle) in blue color overlayed on top of a regular rounded rectangle with the same corner radius (100) in red:

Path algorithm is based on this article.

Usage

Creating "Cupertino" rounded rectangle path:

  import 'package:cupertino_rrect/cupertino_rrect.dart';

  final path = Path();
  path.addCupertinoRRect(rrect);

Using CupertinoRectangleBorder:

  import 'package:cupertino_rrect/cupertino_rrect.dart';

  Container(
    decoration: ShapeDecoration(
      shape: CupertinoRectangleBorder(
        borderRadius: BorderRadius.circular(radius),
      ),
    ),
  ),

Additional information

Example app is located in example directory. Also available online.

About

Rounded rectangle with smoother transition between straight and curved parts used in macOS and iOS.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Sponsor this project

 

Packages

No packages published