Set Rounded Corner Radius Border on Image in Flutter Android iOS Example

Rounded corner border around image looks simple and cool in mobile apps. We would Set Rounded Corner Radius Border on Image in Flutter using BorderRadius.all(Radius.circular(double_value)) argument of BoxDecoration() function. We have to apply decoration on Container widget and put the image widget inside the container widget.

Contents in this project Set Rounded Corner Radius Border on Image in Flutter Android iOS Example:

1. Import material.dart package in your app’s main.dart file.

2. Call our main MyApp design class using void main runApp() method.

3. Create a class named as MyApp extends with StatelessWidget. This is our main view class.

4. Create Widget Build method with Scaffold widget. We would put all our content here in Scaffold widget body section.

5. Creating a SafeArea widget in body section of Scaffold widget and inside the Safe Area widget we would put a Center widget -> Column widget.

6. The column widget supports multiple children. Now finally we would make a Container widget and wrap the Image widget in it. We would apply the rounded border on Container widget because image widget dose not support border directly.

BorderRadius.all(Radius.circular(Double Value))

8. Complete source code for main.dart file:

Screenshot:

Set Rounded Corner Radius Border on Image in Flutter Android iOS Example

Leave a Reply

Your email address will not be published.