侧边栏Drawer栏刷新
创始人
2024-03-23 08:28:49
0

Drawer的父类为StatelessWidget,不可刷新,今天来讲一下刷新的办法
需求:点击A用户,弹出侧边栏,侧边栏展示用户的数据。
需要使用StreamBuilder。但是使用stream发数据是行不通的,因为数据传递不进去。
但是使用StreamBuilder依旧可以收到通知。所以流程就需要改变一下
一、点击按键后刷新Drawer并展示
1、使用StatefulWidget
2、在state里创建备用数据,本例为SSML ssml=SSML();
3、点击按键,更新备用数据:ssml = ssmlList[index];
4、通知StreamBuilder:streamController.add(‘event’);
5、StreamBuilder接到通知,使用备用数据重新构造

二、刷新Drawer面板上的内容
具体为使用StatefulBuilder自带的setState方法,不要使用公共的,作为区别,名字改为setStateB。代码片段为_changeRate方法

class DrawerTest extends StatefulWidget {final File file;const DrawerTest(this.file, {super.key});@overrideState createState() {return _DrawerTestState();}
}class _DrawerTestState extends State {SSML ssml = SSML();StreamController streamController = StreamController.broadcast();List ssmlList = [];@overridevoid initState() {ssmlList.add(SSML()..name = 'dan');ssmlList.add(SSML()..name = 'ada');super.initState();}final GlobalKey _ssKey = GlobalKey();@overrideWidget build(BuildContext context) {return Scaffold(key: _ssKey,drawer: _getDrawer(),appBar: AppBar(leading: IconButton(onPressed: () {Navigator.pop(context);},icon: const Icon(Icons.arrow_back)),title: const Text('Drawer测试'),),body: SafeArea(child: Container(color: Colors.white10,padding: const EdgeInsets.all(15),child: ListView.builder(itemCount: ssmlList.length,itemBuilder: (context, index) {return ElevatedButton(onPressed: () {ssml = ssmlList[index];streamController.add('event'); //通知StreamBuilder该刷新了_ssKey.currentState!.openDrawer();},child: Text('${ssmlList[index].name}打开左边栏'));}),)));}StreamBuilder _getDrawer() {return StreamBuilder(stream: streamController.stream,builder: (context, shot) {return Drawer(child: StatefulBuilder(builder: (context, setStateB) {return _changeRate(ssml);},));});}Widget _changeRate(SSML ssml) {return StatefulBuilder(builder: (context, setStateB) {return Row(mainAxisAlignment: MainAxisAlignment.spaceBetween,children: [Text('速度:${ssml.rate}'),Slider(value: ssml.rate.toDouble(),max: 500,min: -500,onChanged: (value) {setStateB(() {ssml.rate = value.toInt();});// setState(() {});})],);});}
}class SSML {late String name;int rate = 0;
}

相关内容

热门资讯

修复 爱普生 EPSON L4... L4151 L4153 L4156 L4158 L4163 L4165 L4166 L4168 L4...
【PdgCntEditor】解... 一、问题背景 大部分的图书对应的PDF,目录中的页码并非PDF中直接索引的页码...
监控摄像头接入GB28181平... 流程简介将监控摄像头的视频在网站和APP中直播,要解决的几个问题是:1&...
在Word、WPS中插入AxM... 引言 我最近需要写一些文章,在排版时发现AxMath插入的公式竟然会导致行间距异常&#...
protocol buffer... 目录 目录 什么是protocol buffer 1.protobuf 1.1安装  1.2使用...
【前端】‘??‘与‘||‘有什... 0 问题 经常写const data = res.data.a ?? ''或者const d...
Windows10添加群晖磁盘... 在使用群晖NAS时,我们需要通过本地映射的方式把NAS映射成本地的一块磁盘使用。 通过...
牛客计算器的改良(Python... 文章目录1.题目描述2.输入描述:3.输出描述:4.示例15.分析6.代码7.结语 链接࿱...
正大杯|市调大赛|2023备赛... 关键信息 同时随着精细化养宠趋势的深入,宠物消费类目日渐丰富。 本报告通过 Niuco...
QGIS下载在线地图(Goog... 前言 国内外有很多在线地图下载软件,但功能单一,基本上只能下载数据&#x...