Flutter Drawer Animation Behavior

Question

I can see that flutter's navbar default animation is from left to right but somehow in my app the default is bottom to up. here's navbar code.

import 'package:flutter_svg/flutter_svg.dart';
import 'package:provider/provider.dart';

import 'package:frontend/src/providers/auth.provider.dart';
import 'package:frontend/src/services/auth_service.dart';

class Navbar extends StatefulWidget {
  @override
  _NavbarState createState() => _NavbarState();
}

class _NavbarState extends State<Navbar> {
  String nombres = '';

  @override
  void initState() {
    super.initState();
    Future.delayed(Duration.zero, () {
      getDatosCliente();
    });
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      color: Colors.white,
      width: MediaQuery.of(context).size.width,
      child: Drawer(
        
        child: ListView(
          children: [/*menu items*/]
 
        ),
      ),
    );
  }

 

 
  List<Widget> _itemMenuFunction(
      String texto, IconData icon, void Function()? onTap) {
    return [
      ListTile(
        contentPadding: EdgeInsets.symmetric(
          horizontal: MediaQuery.of(context).size.height * 0.025,
        ),
        leading: Icon(
          icon,
          color: Color.fromRGBO(80, 80, 80, 1),
          size: MediaQuery.of(context).size.height * 0.037,
        ),
        title: Text(
          texto,
          style: TextStyle(
            fontSize: 20,
            color: Color.fromRGBO(123, 123, 123, 1),
          ),
        ),
        onTap: onTap,
      ),
      SizedBox(
        height: MediaQuery.of(context).size.height * 0.025,
      ),
    ];
  }
}

This is the result not what i'm specting, to be clear im not specifing this behabior anywhere, and somehow I suspect some other widget is overriding this behavior.

Thank U very much.

and this is how i call it from other pages

  @override
  Widget build(BuildContext context) {
    Size size = MediaQuery.of(context).size;
    return Scaffold(
      extendBodyBehindAppBar: true,
      drawer: Navbar(),
      body: BackgroundWhite(/*inside body code*/)
 
    );
  }

Answer 1

Can you try removing the root widget Container() and have Drawer() as the root widget in NavBar() ?

The reason being that drawer attribute in Scaffold() could be expecting Drawer() object which would handle default animations of drawer behaviour.

Answer 2

I just discovered the reason for this behaviour: I wasn't using the app bar default menu button. Instead, I was using another one because of the app design. The solution is to change the design to use the app bar. After this it goes from left to right as expected.

      appBar: AppBar(title: Text('test')),
      drawer: Navbar(),
      body: BackgroundWhite(
        child: SingleChildScrollView(
          child: Column(
            children: [
              MenuLogoBar(size: size) /*this was the original menu buttton*/
            ],
      )))