Home > Software engineering >  Custom bottom navigation bar notch problem in iphone 12 mini
Custom bottom navigation bar notch problem in iphone 12 mini

Time:10-04

Custom bottom navigation bar show above notch in phone 12 mini

How to make custom navigation bar like default navigation bar to adopt notch problem

Code:

Scaffold(
        floatingActionButtonLocation: FloatingActionButtonLocation
            .startDocked, //specify the location of the FAB
        floatingActionButton: FloatingActionButton(
          backgroundColor: Colors.blue,
          onPressed: () {
            print('OK');
          },
          tooltip: "start FAB",
          child: Container(
            height: 60,
            margin: EdgeInsets.all(15.0),
            child: Icon(Icons.add),
          ),
          elevation: 4.0,
        ),
        bottomNavigationBar: BottomAppBar(
          child: Container(
            color: Colors.lightBlue,
            height: 60,
          ),
        ));

CodePudding user response:

enter image description here

This is how I resolved it but here I am not going to used bottomNavigationBar Widget

 
Scaffold(
        floatingActionButtonLocation: FloatingActionButtonLocation
            .startDocked, //specify the location of the FAB
        floatingActionButton: FloatingActionButton(
          backgroundColor: Colors.blue,
          onPressed: () {
            print('OK');
          },
          tooltip: "start FAB",
          child: Container(
            height: 60,
            margin: EdgeInsets.all(15.0),
            child: Icon(Icons.add),
          ),
          elevation: 4.0,
        ),
        bottomNavigationBar: BottomAppBar(
          color: Colors.blue,
          child: Row(
            mainAxisSize: MainAxisSize.max,
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Container(
                color: Colors.lightBlue,
                height: 50,
              ),
            ],
          ),
        ));  

CodePudding user response:

please try safearea widget its really helpfull

CodePudding user response:

please try safearea widget its really helpfull

import 'package:flutter/material.dart';

class BaseScaffold extends StatelessWidget {
  Widget child;

  BaseScaffold({Key? key, required this.child}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return SafeArea(
      child:your widget,
    );
  }
}
  • Related