对flutter中,ExpsionPanel的简单改造
因为项目有大量的下拉面板,而默认的组件(默认的padding、颜色、大小)不是我们UI设计上想要的,但是每个地方都要去改又很麻烦。于是我就想,可以对这个组件进行定制化改造,传入一些颜色、参数、图标大小之类的参数(当然还有其他方法,比如继承默认组件,然后根据ui设计进行兼容开发),使其符合我们的UI设计,并且减少时间研究此组件的时间(因为项目分三个人开发)
研究了下该组件的源码,对其进行了以下改造:
ExpansionPanelCustomList(
animationDuration: Duration(milliseconds: 500),
expansionCallback: (panelIndex, isExpanded) {
allPlanListBloc.caculateWholePlanHeight(panelIndex);
isAllExpanded = isExpanded;
eventBuses.fire(WholeExpanded(isExpanded));
setState(() {
isHwolePanel = true;
currentPanelIndex =
(currentPanelIndex != panelIndex) ? panelIndex : -1;
});
},
//就是传了个parms参数,如果不传都有默认值
parms: {
'type': 'custom',//用默认的,考虑到不影响默认的样式
'backgroundcolor': 0xffff7200,//下拉的背景颜色
'iconcolor': 0xffffffff,//下拉icon的颜色
'iconsize': 36.0,//下拉icon的大小
},
children: mList.map((i){
return ExpansionPanelCustom(
headerBuilder: (context,isExpanded){
return Container();
},
body:Container(),
isExpanded: currentPanelIndex==i,
);
}).toList(), ),
改造完的效果图:

以下是详细的做法:
1、去组件库拷贝这两个文件到ui/widgets下
2、根据具体ui设计修改源码
3、使用:导入放文件的位置
;
使用代码参考以上实例
对flutter中,ExpsionPanel的简单改造的更多相关文章
- 在Flutter中嵌入Native组件的正确姿势是...
引言 在漫长的从Native向Flutter过渡的混合工程时期,要想平滑地过渡,在Flutter中使用Native中较为完善的控件会是一个很好的选择.本文希望向大家介绍AndroidView的使用方式 ...
- Flutter 中 JSON 解析
本文介绍一下Flutter中如何进行json数据的解析.在移动端开发中,请求服务端返回json数据并解析是一个很常见的使用场景.Android原生开发中,有GsonFormat这样的神器,一键生成Ja ...
- 《ASP.NET MVC 5 破境之道》:第一境 ASP.Net MVC5项目初探 — 第三节:View层简单改造
第一境 ASP.Net MVC5项目初探 — 第三节:View层简单改造 MVC默认模板的视觉设计从MVC1到MVC3都没有改变,比较陈旧了:在MVC4中做了升级,好看些,在不同的分辨率下,也能工作得 ...
- mvp 在 flutter 中的应用
在 Android 应用程序开发过程中,我们经常会用到一些所谓的架构方法,如:mvp,mvvm,clean等.之所以这些方法会被推崇是因为他们可以大大的解耦我们的代码的功能模块,让我们的代码在项目中后 ...
- 理解 Flutter 中的 Key
概览 在 Flutter 中,大概大家都知道如何更新界面视图: 通过修改 Stata 去触发 Widget 重建,触发和更新的操作是 Flutter 框架做的. 但是有时即使修改了 State,Flu ...
- flutter 中的样式
flutter 中的样式 样式 值 width 320.0 height 240.0 color Colors.white,Colors.grey[300] textAlign TextAlign.c ...
- flutter中的异步机制Future
饿补一下Flutter中Http请求的异步操作. Dart是一个单线程语言,可以理解成物理线路中的串联,当其遇到有延迟的运算(比如IO操作.延时执行)时,线程中按顺序执行的运算就会阻塞,用户就会感觉到 ...
- Flutter中管理路由栈的方法和应用
原文地址:https://www.jianshu.com/p/5df089d360e4 本文首先讲的Flutter中的路由,然后主要讲下Flutter中栈管理的几种方法. 了解下Route和Navig ...
- Flutter中的日期插件date_format 中文 国际化 及flutter_cupertino_date_picker
今天我们来聊聊Flutter中的日期和日期选择器. Flutter中的日期和时间戳 //日期时间戳转换 var _nowTime = DateTime.now();//获取当前时间 print(_no ...
随机推荐
- linux下通过命令行把文件拷贝到U盘上
常用linux,往U盘拷贝文件是常用的一种方法.下面这个方法是笔者亲测有效,暂时记录下来. 1.插入U盘,fdisk -l查看U盘是哪个设备(比如/dev/sdb1)然后mount /dev/sdb ...
- 1+x 证书 Web 前端开发 css 专项练习
官方QQ群 1+x 证书 Web 前端开发 css 专项练习 http://blog.zh66.club/index.php/archives/192/
- 【TCP/IP网络编程】:02套接字类型与协议设置
本篇文章主要介绍创建套接字函数相关的3个输入参数的含义,它们最终确定了套接字通信所采用的协议.同时,也简单对比了TCP和UDP传输方式的区别. 什么是协议?协议是对话中使用的通信规则,而在计算机领域则 ...
- pytest框架之parametries数据驱动参数化
在测试用例的前面加上:@pytest.mark.parametrize('参数名', 列表数据) 参数名:用来接收每一项数据,并作为测试用例的参数 列表参数:一组测试数据(元组.列表.字典) 方式一: ...
- webwork遍历数组标签
WebWork中提供了一个<ww:iterator></ww:iterator>标签用于遍历数组. 01 如果数组中是普通类型,比如String.int等类型,可以通过标签中的 ...
- laravel集成workerman,使用异步mysql,redis组件时,报错EventBaseConfig::FEATURE_FDS not supported on Windows
由于laravel项目中集成了workerman,因业务需要,需要使用异步的mysql和redis组件. composer require react/mysql composer require c ...
- DbgUiConnectToDbg(ntdll.dll)函数逆向
暂时未解决问题: 1. [fs+0F24h]中存储着什么东西. 答案:其存放着被调试程序的DbgObject句柄._NtCreateDebugObject(ntoskrnl.exe)函数逆向分析 该 ...
- python基础(28):isinstance、issubclass、type、反射
1. isinstance和issubclass 1.1 isinstance isinstance(obj,cls)检查是否obj是否是类 cls 的对象 class Foo(object): pa ...
- 干货:Wireshark使用技巧-显示规则
- 显示规则使用 在Wireshark界面对已经抓取的报文在界面的显示进行控制的规则,称为显示规则,显示规则只是让一部分不符合规则的报文不被显示,但未被丢弃,这些报文仍然存在在Wireshark的系统 ...
- tcp滑动窗口和读写缓冲区
最近突然忘记了 滑动窗口的原理,在网上找到了比较好的视频,现在在这里同大家分享: 注:反正进程间切换 视频链接: https://www.youtube.com/watch?v=R6ArbkVj-N8 ...