2

en esta ocasión estoy intentando crear un drawer y lo puede esconder y mostrar programaticamente. Actualmente tengo un CustomScrollView con un SliverAppBar y Sliver list. con un boton de busqueda flotante. Ese boton de busqueda contiene un icono de menú que al ser presionado intento que muestre un drawer. Para hacer esto, intento no usar un AppBar en el scaffold. pong el drawer, pero me muestra el icono de la hamburguesa y no lo necesito así.

Así como esta esta imagen deseo el resultado

introducir la descripción de la imagen aquí

Pero al poner un drawer dentro del scaffold sale así. OJO que no tengo ningún appBar

introducir la descripción de la imagen aquí

Y aqui el código

  @override
     Widget build(BuildContext context) {
    return Scaffold(
      appBar: null,
      drawer: Container(child: const CustomDrawer()),
      body: CustomScrollView(
        slivers: <Widget>[
          SliverAppBar(
            elevation: 0,
            floating: true,
            pinned: true,
            title: Padding(
              padding: const EdgeInsets.only(top: 0),
              child: EntrySearchTextBoxWidget(
                onTap: () {
                  Navigator.push(
                    context,
                    FadeRoute(
                      page: const SearchPage(),
                    ),
                  );
                },
                leftIconButton:
                    IconButton(onPressed: () {}, icon: const Icon(Icons.menu)),
                label: const Text(
                  'Buscar equipo',
                  style: TextStyle(
                    fontSize: 18,
                  ),
                ),
                rightIconButton: IconButton(
                  onPressed: () {},
                  icon: const Icon(Icons.settings),
                ),
              ),
            ),
            toolbarHeight: 80,
            expandedHeight: 200,
            backgroundColor: Colors.transparent,
            centerTitle: true,
            excludeHeaderSemantics: true,
            // collapsedHeight: 180,
            flexibleSpace: FlexibleSpaceBar(
              background: Image.asset(
                'assets/images/portada/teko.png',
                fit: BoxFit.cover,
              ),
              title: SizedBox(
                width: double.infinity,
                // color: Colors.blue,
                child: Text(
                  'Recorrido de hoy ${tsToUi(format: 'EEEE, dd-MMMM-yyy')}',
                  style: const TextStyle(fontSize: 10),
                ),
              ),
            ),
          ),
          const SliverListSearchHistoryItems(),
        ],
      ),
    );
  }
}

Aqui en el código puse Drawer dentro de un container, haber si ayudaba pero nada. no funcionó.

Desde ya muchas gracias por su apoyo

2 respuestas 2

2

El SliverAppBar es el que trae el ícono por default también, así que podrías asignarle un leading (widget que va a la izquierda) vacío.

      SliverAppBar(
              leading: const SizedBox.shrink(),
              ...
            )

Update (como mencionó Jamt0 en los comentarios)

Podemos indicarle al SliverAppBar que no asuma el leading por defecto, así:

SliverAppBar( 

    automaticallyImplyLeading: false, 

... )
3
  • Para ese objetivo es mejor usar SliverAppBar( automaticallyImplyLeading: false, ... )
    – Jamt0
    Commented el 22 abr. 2023 a las 0:31
  • 1
    @Jamt0 excelente, me había olvidado de ese param xD Commented el 22 abr. 2023 a las 1:40
  • 1
    Muchas gracias por su ayuda, dejo como comentario que usando leading: const SizedBox.shrink() // creaba el espacio del icono del menu, pero no se mostraba. y solo era suficiente con automaticallyImplyLeading: false Muchas gracias a todos y a la comunidad..
    – YuberV
    Commented el 26 abr. 2023 a las 4:26
2

Creo que lo que te serviria es esto, si agregas un drawe automaticamente agrega el icono asi no tengas appBar, de esta manera desactivas ese comportamiento

 Scaffold(
  appBar: AppBar(
    automaticallyImplyLeading: false, // Oculta el botón mas a la izquierda
  ),

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.