In here I removed the style which I was added to each tab. After that added a gradient to BoxDecoration. In here I used LinearGradient with two colours. You can change the gradient-based on your preferences.
Square style can be done by changing small code in the previous one. BorderRadius of the boxDecoration can be changed by adding 10 for both leftTop and rightTop. Then I change the appbar backgroundColor to the red to make it look better.
Diamond tab style can be done by adding ShapeDecoration with BeveledRectangleBorder for the shape parameter.BeveledRectangleBorder will allow you to add flatten corner instead of round corners.
The line segments that connect the rectangle’s four sides will begin and at locations offset by the corresponding border radius, but not farther than the side’s center. If all the border radii exceed the sides’ half widths/heights the resulting shape is diamond made by connecting the centers of the sides.
BeveledRectangleBorder – flutter.dev
In here I used borderRadius as 10 to make it look like this.
Likewise, by changing the borderRadius of the BeveledRectangleBorder, you can achieve different styles. In here I used borderRadius as 20. You can try different styles by changing this borderRadius value.
I hope you get a better understanding of how to change the tab style by a few lines of code. If you are like to watch this in action, please watch the video mentioned below. Don’t forget to subscribe my channel