Widget Drawer en Flutter

El widget Drawer se utiliza como un sub enrutador adicional que consta de varios enlaces a otras rutas (es decir, páginas) en la misma aplicación. Tiene un movimiento horizontal desde el borde del scaffold que navega por el enlace a diferentes rutas en la aplicación Flutter. Todos los elementos secundarios de un widget Drawer suelen estar en ListView e inicialmente, solo DrawerHeader está presente en la interfaz de usuario, que cuando se toca se extiende horizontalmente.

Constructores:

Syntax:
Drawer({Key key, double elevation: 16.0, Widget child, String semanticLabel}) 

Propiedades:

• child: Los widgets debajo de este widget en el árbol.
• hashCode: el código hash para este objeto.
• key: controla cómo un widget reemplaza a otro widget en el árbol.
• runtimeType: una representación del tipo de tiempo de ejecución del objeto.
• evaluation: la coordenada Z en la que colocar este drawer en relación con su padre.
• semanticLabel: la etiqueta semántica del diálogo que utilizan los marcos de accesibilidad para anunciar las transiciones de pantalla cuando se abre y se cierra el drawer.

• build (contexto BuildContext) → Widget: este método especifica la parte de la interfaz de usuario representada por el widget. Este método se llama cuando el widget Drawer se inserta en el árbol en un BuildContext dado y cuando cambian las dependencias del widget Drawer .

Implementación

@override
Widget build(BuildContext context) {
  assert(debugCheckHasMaterialLocalizations(context));
  String? label = semanticLabel;
  switch (Theme.of(context).platform) {
    case TargetPlatform.iOS:
    case TargetPlatform.macOS:
      break;
    case TargetPlatform.android:
    case TargetPlatform.fuchsia:
    case TargetPlatform.linux:
    case TargetPlatform.windows:
      label = semanticLabel ?? MaterialLocalizations.of(context).drawerLabel;
  }
  return Semantics(
    scopesRoute: true,
    namesRoute: true,
    explicitChildNodes: true,
    label: label,
    child: ConstrainedBox(
      constraints: const BoxConstraints.expand(width: _kWidth),
      child: Material(
        elevation: elevation,
        child: child,
      ),
    ),
  );
}

Ejemplo y aplicación en código

import 'package:flutter/material.dart';

void main() => runApp(const MyApp());

class MyApp extends StatelessWidget {
  static const String _title = "Ejemplo del Drawer";

  const MyApp({Key? key}) : super(key: key);
  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      title: _title,
      home: MyStatefulWidget(),);
  }}
class MyStatefulWidget extends StatefulWidget {
  const MyStatefulWidget({Key? key}) : super(key: key);
  @override
  _MyStatefulWidgetState createState() => _MyStatefulWidgetState();
}
class _MyStatefulWidgetState extends State<MyStatefulWidget> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(appBar: AppBar(
      title: const Text("BigCode"),
      backgroundColor: Colors.green,),
    drawer: Drawer(
      child: ListView(
        padding: EdgeInsets.zero,
        children: const <Widget>[DrawerHeader(
          decoration: BoxDecoration(
              color: Colors.green,),
        child: Text("Drawer Header",
          style: TextStyle(
              color: Colors.white,
              fontSize: 30,),),),
        ListTile(
          leading: Icon(Icons.message),
          title: Text("Message"),),
        ListTile(
          leading: Icon(Icons.account_circle),
          title: Text("Profile",),),
      ListTile(
        leading: Icon(Icons.settings),
        title: Text("Settings",),), ],),),);}}