The latest iphones have a notch design, you know the little black strip at the top of the phone.
In the screen shot below the image bleeds into the notch area.

This is an excerpt of what the code currently looks like
Widget build(BuildContext context) {
return Container(
child: MaterialApp(
debugShowCheckedModeBanner: false,
title: 'Flutter Demo',
home: Container(
// more code
), //end home
), //end matertial app
); //end container
} //end build
Once a fix is added this how the screen looks

The solution to fix this is quite simple, just wrap the outer most container in the snippet above inside a SafeArea widget
Widget build(BuildContext context) {
return SafeArea(
child: Container(
child: MaterialApp(
debugShowCheckedModeBanner: false,
title: ‘Flutter Demo’,
home: Container(
// more code
), //end home
), //end matertial app
),
);
} //end build
Code
You can download the code here
If you find this article useful, please consider sharing it and also giving the repo a star on github.
Sign up to be notified of new posts. I promise i won’t spam you.