Skip to content

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

Stars

Watchers

Forks

Releases

Sponsor this project

Packages

Used by

Contributors

Languages