SafeArea Widget in Flutter

Properties

 

  • top
  • bottom
  • left
  • right
  • child
  • maintainBottomViewPadding
  • minimum

 

Example 1:

 

import 'package:flutter/material.dart';


void main() => runApp(DemoApp());


class DemoApp extends StatefulWidget {

  @override

  State<StatefulWidget> createState() {

    return DemoAppState();

  }

}


class DemoAppState extends State<DemoApp> {

  @override

  Widget build(BuildContext context) {

    return const MaterialApp(

      home: Scaffold(

        body: SafeArea(

          child: Text(

            'Hello',

            style: TextStyle(

              color: Colors.blue,

              fontSize: 50,

            ),

          ),

        ),

      ),

    );

  }

}

 

Example 2:

 

import 'package:flutter/material.dart';


void main() => runApp(DemoApp());


class DemoApp extends StatefulWidget {

  @override

  State<StatefulWidget> createState() {

    return DemoAppState();

  }

}


class DemoAppState extends State<DemoApp> {

  @override

  Widget build(BuildContext context) {

    return const MaterialApp(

      home: Scaffold(

        body: SafeArea(

          top: false,

          child: Text(

            'Hello',

            style: TextStyle(

              color: Colors.blue,

              fontSize: 50,

            ),

          ),

        ),

      ),

    );

  }

}

 

Example 3:

 

import 'package:flutter/material.dart';


void main() => runApp(DemoApp());


class DemoApp extends StatefulWidget {

  @override

  State<StatefulWidget> createState() {

    return DemoAppState();

  }

}


class DemoAppState extends State<DemoApp> {

  @override

  Widget build(BuildContext context) {

    return const MaterialApp(

      home: Scaffold(

        body: SafeArea(

          top: false,

          minimum: EdgeInsets.all(100),

          child: Text(

            'Hello',

            style: TextStyle(

              color: Colors.blue,

              fontSize: 50,

            ),

          ),

        ),

      ),

    );

  }

}


Video Link:

 
Post a Comment (0)
Previous Post Next Post