Flutter(九)——Drawer侧滑菜单与包管理

import 'package:flutter/material.dart';
class RightPage extends StatelessWidget {
  final String pageText;//确定右侧的文字
  RightPage(this.pageText);//构造函数传入设置页面的文字
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: AppBar(
        title: new Text(pageText),//该页面标题栏与文字相同
      ),
      body: Center(
        child: new Text(pageText),//该页面标题栏与文字相同
      ),
    );
  }
}

import 'package:flutter/material.dart';
import 'package:flutter_app/page/right_page.dart';
class LeftPage extends StatefulWidget{
  @override
  _LeftPageState createState() => new _LeftPageState();
}
class _LeftPageState extends State<LeftPage> {
  //头像与设置按钮图片
  String headImageUrl="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1580303478532&di=1478f90ea84d8431546853ee4b9b02d6&imgtype=0&src=http%3A%2F%2Fb-ssl.duitang.com%2Fuploads%2Fitem%2F201511%2F04%2F20151104140542_tBusS.jpeg";
  String profileImageUrl="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1580303491035&di=1abfac6069e86a510b8deec36e4be614&imgtype=0&src=http%3A%2F%2Fb-ssl.duitang.com%2Fuploads%2Fitem%2F201607%2F26%2F20160726185736_yPmrE.thumb.224_0.jpeg";
  //交换头像与设置图片的方法
  void exchangeImage() {
    String backupString = headImageUrl;
    this.setState((){
      headImageUrl = profileImageUrl;
      profileImageUrl = backupString;
    });
  }
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: AppBar(
        title: new Text("侧滑效果"),
      ),
      drawer: new Drawer(
        child: new ListView(
          children: <Widget>[
            new UserAccountsDrawerHeader(//左侧菜单上面的显示区域
                accountName: new Text("liyuanjinglyj"),//姓名或者昵称
                accountEmail: new Text("liyuanjinglyj@163.com"),//邮箱地址
                currentAccountPicture: new GestureDetector(//大头像点击事件
                  onTap: ()=>print("点击事件"),
                  child: new CircleAvatar(
                    backgroundImage: new NetworkImage(this.headImageUrl),
                  ),
                ),
              otherAccountsPictures: <Widget>[//设置图像的点击事件
                new GestureDetector(
                  onTap: ()=>this.exchangeImage(),//点击交换图片
                  child: new CircleAvatar(
                    backgroundImage: new NetworkImage(this.profileImageUrl),
                  ),
                )
              ],
              decoration: new BoxDecoration(//左侧菜单上面的显示区域背景，设置图片以及填充方式
                image: new DecorationImage(image: new NetworkImage("https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=3138597732,1722388446&fm=26&gp=0.jpg"),fit: BoxFit.fill)
              ),
            ),
            new ListTile(//一个固定高度的行，通常包含一些文本，以及一个行前或行尾图标。
              title: new Text("第一个菜单"),
              trailing: new Icon(Icons.accessibility),
              onTap: (){
                Navigator.of(context).pop();//出栈
                Navigator.of(context).push(//进栈
                    new MaterialPageRoute(
                        builder: (BuildContext context)=>new RightPage("第一个菜单"),
                    ));
              },
            ),
            new ListTile(
              title: new Text("第二个菜单"),
              trailing: new Icon(Icons.search),
              onTap: (){
                Navigator.of(context).pop();//出栈
                Navigator.of(context).push(//进栈
                    new MaterialPageRoute(
                        builder: (BuildContext context)=>new RightPage("第二个菜单页面")
                    ));
              },
            ),
            new Divider(),//分割线
            new ListTile(
              title: new Text("第三个菜单"),
              trailing: new Icon(Icons.playlist_add_check),
              onTap: ()=>Navigator.of(context).pop(),
            )
          ],
        ),
      ),
      body: new Center(
        child: new Text("主页面",style: new TextStyle(fontSize: 35.0),),
      ),
    );
  }
}

import 'package:flutter/material.dart';
import 'package:flutter_app/page/left_page.dart';
void main(){
  runApp(
    new MaterialApp(
      home: LeftPage(),
    ),
  );
}