Skip to content

[CircularNotchedRectangle] Add option for convex shape. #49973

@domske

Description

@domske

Use case

A convex shape is an alternative to the current fixed concave circular notch shape. It's just an inverted notch.
For example if you have an non-extended body and a BottomAppBar with the notch shape.
The body have a image or map as background. Not you see that the body ends on the bottom app bar. Because the background (e.g. white)is shining through the notch. Now we have to options:

  1. Extend the body by setting the attribute extendBody of Scaffold.
  2. Use an inverted notch. (this proposal) Just another shape. Or an option to the existing shape.

Proposal

It's really simple to invert the notch.

  1. Add a boolean option convex to the class CircularNotchedRectangle in package flutter/../notched_shape.dart.
//class CircularNotchedRectangle extends NotchedShape {
  final bool convex;
  const CircularNotchedRectangle({this.convex = false});
//}
  1. Change some code (only 3 lines) to invert the path if the convex option is set:
//class CircularNotchedRectangle extends NotchedShape {
  //@override
  //Path getOuterPath(Rect host, Rect guest) {
    final double p2yA = math.sqrt(r * r - p2xA * p2xA) * (convex ? -1 : 1);
    final double p2yB = math.sqrt(r * r - p2xB * p2xB) * (convex ? -1 : 1);

    //return Path()
    //..
      clockwise: convex,
    //..
    //)
  //}
//}

The question is: Do you want options here? If not you have to clone this shape. I prefer the option way. No duplicated code and easy to understand.

See current source code

Default notch shape (concave) without body extended.

concave notch and not extended body

Default notch shape (concave) with body extended.

concave notch and extended body

New optional notch shape (convex) without body extended.

convex notch and not extended body

Metadata

Metadata

Assignees

No one assigned

    Labels

    P3Issues that are less important to the Flutter projectc: proposalA detailed proposal for a change to Flutterframeworkflutter/packages/flutter repository. See also f: labels.team-frameworkOwned by Framework teamtriaged-frameworkTriaged by Framework team

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions