当前位置: 首页 > news >正文

flutter->Scaffold左侧/右侧侧边栏和UserAccountsDrawerHeader的使用

//appBar的 leading/actions   和 Scaffold的drawer/endDrawer  冲突只能存在一个

 

import 'package:flutter/material.dart';void main() {runApp(MyApp());
}class MyApp extends StatelessWidget {const MyApp({super.key});@overrideWidget build(BuildContext context) {return const MaterialApp(title: 'contaniner', home: HomePage());}
}class HomePage extends StatefulWidget {const HomePage({super.key});@overrideState<HomePage> createState() => _HomePageState();
}class _HomePageState extends State<HomePage> {final _leftList = List.generate(20,(index) => const Column(children: [ListTile(leading: CircleAvatar(child: Icon(Icons.swipe_left, size: 30)),title: Text('左侧数据'),trailing: Icon(Icons.keyboard_arrow_right),),Divider()],),);final _rightList = List.generate(20,(index) => const Column(children: [ListTile(leading: CircleAvatar(child: Icon(Icons.swipe_right, size: 30)),title: Text('右侧数据'),selectedColor: Colors.green,trailing: Icon(Icons.keyboard_arrow_right),),Divider()],),);static const Widget _userImage = CircleAvatar(backgroundImage: NetworkImage('https://img0.baidu.com/it/u=2462933260,1879339806&fm=253&fmt=auto&app=138&f=JPEG?w=800&h=500'),radius: 200 //设置半径);@overrideWidget build(BuildContext context) {return Scaffold(drawer: Drawer(child: Column(children: [Container(width: double.infinity,child: const UserAccountsDrawerHeader(decoration: BoxDecoration(// color: Colors.green,image: DecorationImage(fit: BoxFit.cover,image: NetworkImage('https://img1.baidu.com/it/u=413643897,2296924942&fm=253&fmt=auto&app=138&f=JPEG?w=800&h=500'),),),accountName: Text('小刀刀'),accountEmail: Text('49701361@qq.com'),currentAccountPicture: _userImage,otherAccountsPictures: [_userImage,_userImage,],),),Expanded(child: ListView(children: [..._leftList],),),],),),endDrawer: Drawer(child: Column(children: [Container(width: double.infinity,child: const DrawerHeader(decoration: BoxDecoration(color: Colors.green),child: Text("左侧侧数据"),),),Expanded(child: ListView(children: [..._rightList],),),],),),appBar: AppBar(title: const Center(child: Text('flutter bar')),// leading: IconButton(//   onPressed: () => print("我是图标按钮1"),//   icon: Icon(Icons.ac_unit), //设置图标//   color: Colors.red, //设置按钮颜色//   splashColor: Colors.yellow, //设置水波纹//   highlightColor: Colors.purple, //设置高亮的颜色//   tooltip: '我是提示信息', //提示信息// ),// actions: const [//   Icon(Icons.settings),//   Icon(Icons.vaccines),// ],backgroundColor: Colors.cyan[800],elevation: 0.0,centerTitle: true,),//带索引的集合循环body:HomeWidget());}
}class HomeWidget extends StatelessWidget {const HomeWidget({super.key});@overrideWidget build(BuildContext context) {// return const Text('我是首页数据', style: TextStyle(color: Colors.red));return ListView(children: List.generate(20,(index) => ListTile(leading: Icon(Icons.access_alarm, size: 30),title: Text('测试$index'),subtitle: Text('子标题$index'),selected: index == 1,selectedColor: Colors.green,trailing: Icon(Icons.keyboard_arrow_right),),));}
}

相关文章:

  • pytorch升级打怪(八)
  • 使用 Dify 和 AWS Bedrock 玩转 Anthropic Claude 3
  • 鸿蒙ArkTS实战开发-Native XComponent组件的使用
  • 机器学习 - 准备数据
  • 总结: HQL语句
  • 软考 系统架构设计师系列知识点之系统性能(1)
  • Hive自定义GenericUDF函数
  • 【AI生成文章】flutter ChangeNotifierProvider 实用场景举例
  • RIP,EIGRP,OSPF的区别
  • 医学预测变量筛选的几种方法(R语言版)
  • 2024年阿里云2核4G服务器价格30元、165元和199元1年
  • AI智能分析网关V4在养老院视频智能监控场景中的应用
  • File的学习2
  • ChatGPT无法登录,提示我们检测到可疑的登录行为?如何解决?
  • 南京大学AI考研,宣布改考408!
  • [case10]使用RSQL实现端到端的动态查询
  • Bytom交易说明(账户管理模式)
  • Fabric架构演变之路
  • node-sass 安装卡在 node scripts/install.js 解决办法
  • Quartz初级教程
  • Redis学习笔记 - pipline(流水线、管道)
  • 从零开始在ubuntu上搭建node开发环境
  • 道格拉斯-普克 抽稀算法 附javascript实现
  • 基于MaxCompute打造轻盈的人人车移动端数据平台
  • 基于Vue2全家桶的移动端AppDEMO实现
  • 马上搞懂 GeoJSON
  • 通过npm或yarn自动生成vue组件
  • ​Spring Boot 分片上传文件
  • ​渐进式Web应用PWA的未来
  • ​软考-高级-信息系统项目管理师教程 第四版【第14章-项目沟通管理-思维导图】​
  • ​直流电和交流电有什么区别为什么这个时候又要变成直流电呢?交流转换到直流(整流器)直流变交流(逆变器)​
  • #我与Java虚拟机的故事#连载04:一本让自己没面子的书
  • (11)工业界推荐系统-小红书推荐场景及内部实践【粗排三塔模型】
  • (AngularJS)Angular 控制器之间通信初探
  • (超详细)语音信号处理之特征提取
  • (附源码)springboot家庭财务分析系统 毕业设计641323
  • (附源码)ssm高校社团管理系统 毕业设计 234162
  • (附源码)计算机毕业设计SSM疫情居家隔离服务系统
  • (教学思路 C#之类三)方法参数类型(ref、out、parmas)
  • (论文阅读26/100)Weakly-supervised learning with convolutional neural networks
  • (七)Java对象在Hibernate持久化层的状态
  • (译)2019年前端性能优化清单 — 下篇
  • (转)甲方乙方——赵民谈找工作
  • (轉貼) VS2005 快捷键 (初級) (.NET) (Visual Studio)
  • . NET自动找可写目录
  • .Net Framework 4.x 程序到底运行在哪个 CLR 版本之上
  • .NET MAUI学习笔记——2.构建第一个程序_初级篇
  • .net图片验证码生成、点击刷新及验证输入是否正确
  • [].slice.call()将类数组转化为真正的数组
  • [20170705]lsnrctl status LISTENER_SCAN1
  • [202209]mysql8.0 双主集群搭建 亲测可用
  • [AI]文心一言出圈的同时,NLP处理下的ChatGPT-4.5最新资讯
  • [Android View] 可绘制形状 (Shape Xml)
  • [BT]BUUCTF刷题第9天(3.27)
  • [c#基础]值类型和引用类型的Equals,==的区别