import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
home: Scaffold(
//标题栏
appBar: AppBar(
title: const Text("Drawer Demo"),
),
//内容区域
body: HomeContent(),
drawer: Drawer(
child: Column(
children: <Widget>[
Row(
children: <Widget>[
Expanded(
//给Drawer加上头布局
child: UserAccountsDrawerHeader(
//头像
currentAccountPicture: CircleAvatar(
backgroundImage: NetworkImage(
"https://profile.csdnimg.cn/B/3/3/1_m0_38013946"),
),
accountName: Text("GalenWu"),
accountEmail: Text("*******@qq.com"),
otherAccountsPictures: <Widget>[
//其他账号头像
CircleAvatar(
backgroundImage: NetworkImage(
'https://t8.baidu.com/it/u=3571592872,3353494284&fm=79&app=86&size=h300&n=0&g=4n&f=jpeg'),
)
],
decoration: BoxDecoration(
image: DecorationImage(
image: NetworkImage(
'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fku.90sjimg.com%2Fback_pic%2F04%2F67%2F81%2F66587f16ae593e0.jpg%21%2Ffwfh%2F804x482%2Fquality%2F90%2Funsharp%2Ftrue%2Fcompress%2Ftrue%2Fwatermark%2Ftext%2FOTDorr7orqE%3D%2Ffont%2Fsimkai%2Falign%2Fsoutheast%2Fopacity%2F20%2Fsize%2F50&refer=http%3A%2F%2Fku.90sjimg.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1639730040&t=d437e738a695ad0c62bfa947eeacdebb'),
fit: BoxFit.cover,
)),
))
],
),
const ListTile(
leading: CircleAvatar(
child: Icon(Icons.home, color: Colors.red),
),
title: Text("我的空间"),
trailing: Icon(Icons.chevron_right),
),
//分割线
const Divider(),
const ListTile(
leading: CircleAvatar(
child: Icon(Icons.people, color: Colors.blue),
),
title: Text("用户中心"),
trailing: Icon(Icons.chevron_right),
),
const Divider(),
const ListTile(
leading: CircleAvatar(
child: Icon(Icons.settings, color: Colors.yellow),
),
title: Text("设置中心"),
trailing: Icon(Icons.chevron_right),
),
const Divider(),
],
),
),
),
//主题
theme: ThemeData(primarySwatch: Colors.green),
);
}
}
class HomeContent extends StatelessWidget {
//自定义方法
List<Widget> getData() {
List<Widget> list = [];
for (var i = 0; i < 20; i++) {
list.add(ListTile(
title: Text("我是第$i个列表"),
));
}
return list;
}
@override
Widget build(BuildContext context) {
return ListView(
children: this.getData(),
);
}
}
Flutter Drawer制作抽屉菜单
最新推荐文章于 2023-02-06 19:49:01 发布