So, I want to create this small wedge-like shaped in the center of the bottom of my app bar.
Here's the image, I have highlighted the part.
Thanks Guys, any kind of help is appreciated.
3 Answers
AppBar in Flutter has a shape argument in its constructor - you should leverage it. It receives ShapeBorder and all its descendants. In your case, I would suggest going with ContinuousRectangleBorder. Extend it and override its Path getOuterPath(Rect rect, {TextDirection textDirection}) method. In this method drawing lines and curves from point to point you should draw your AppBar shape manually. Here is an approximate example of how it should look like.
You can build your own AppBar Widget with whatever design you want. Just create a widget that implements PreferredSizeWidget.
This will force you to implement Size get preferredSize method. Here you just need to returns a Size, which represents your AppBar height.
You can do appBar: AppBar(title: Text('Map'), shape: ContinuousRectangleBorder(borderRadius: BorderRadius.circular(100)),),
this will give border to the appBar
Related