Flutter SafeArea Widget

SafeArea widget of flutter.

 what is Flutter's SafeArea widget?

Flutter’s SafeArea widget keeps pesky notification bars and phone notches from encroaching on your app's UI. It uses a MediaQuery to check the dimensions of the screen and pads its child Widget to match, making sure your app is safe on both iOS and Android.

In simple words, SafeArea is basically a padding widget, which adds any necessary padding to your app, based on the device it is running on. If your app’s widgets are overlaying any of the system’s features like notches, status bar, camera holes, or any other such features, then SafeArea would add padding around the app, as required.

 

Constructor:  

const SafeArea({
   Key key,
   bool left: true,
   bool top: true,
   bool right: true,
   bool bottom: true,
   EdgeInsets minimum: EdgeInsets.zero,
   bool maintainBottomViewPadding: false,
   @required Widget child}
)

Without safearea text clashes with the screen and

half of the text hide under camera setup of device

as shown in the above picture.

As you can see the difference of using the safearea widget that the

app title automatically get adjusted according

to the shape of the device.

we can also use flutter's safearea widget for the corner text

if needed and to prevent the

the clash of UI with screen design of the targeted device.