見出し画像

【Flutter】コンテンツ表示可能領域に表示するWidget『SafeArea』

Flutter初心者がアプリ開発学習で挫折しないために、基本的なWidgetについて簡単かつ実践的に解説する記事を更新しています。
記事の最後にFlutterのオンライン講座のリンクも載せていますので、ぜひそちらもご覧ください。

Scaffoldのbodyプロパティに直接Textを表示しようとすると、本来の表示範囲外に表示されてしまいます。

Widget build(BuildContext context) {
 return Scaffold(
     body: Text('SafeArea', style: TextStyle(fontSize: 30.0)),
 );
}

画像1

本来の表示範囲のみに表示したいので、SafeAreaで囲います。

Widget build(BuildContext context) {
 return SafeArea(
   child: Scaffold(
       body: Text('SafeArea', style: TextStyle(fontSize: 30.0)),
   ),
 );
}


この記事が気に入ったらサポートをしてみませんか?