flutter 中 SliverAppBar 上的圆形边框

Question

How do you make rounded bottom-corners on a SliverAppBar? I know of 2 ways, but they just don't quite cut it.

1: To use "shape: ContinuousRectangleBorder". The reason this doesn't cut it, is because it's not Circular, but this weird square-circle thing, so it doesn't look the right way. If it's possible to make it with this, and still retain the roundness to it, then please comment that:)

2: To make a container with rounded corners in the SliverAppBar. This is not quite it, because then when you scroll it disappears really early, and you just left with this empty white space in the top of the screen.

If you have any idea, please help. And remember this is a SliverAppBar, not a normal AppBar, there it would be easy.

Answer 1

The first way is the better and recommended way. You can use RoundedRectangleBorder instead of ContinuousRectangleBorder

You can also visit: https://api.flutter.dev/flutter/painting/RoundedRectangleBorder-class.html

You can also check: https://api.flutter.dev/flutter/painting/CircleBorder-class.html for CircleBorder