​老孟导读:最近文章更新拖后腿了,一直忙着网站改版的事情,今天总算落地了,全新的Flutter网站即将上线,敬请期待.网站目前收集197个组件的详细用法,还有150多个组件待整理. Stepper Stepper控件是一个展示一系列步骤进度的控件,用法如下: Stepper( steps: <Step>[ Step( title: Text('2020-4-23'), content: Text('今天是2020-4-23') ), Step( title: Text('2020-4-24')…

用css写一个简单的步骤进度条 html代码: <h4>南京游玩</h4> <ul class="step-list"> <li> <span class="step">第一天</span> <div class="content">中山陵</div> </li> <li> <span class="step&q…

Steps步骤条组件源码: steps.vue <template> <!--设置 simple 可应用简洁风格,该条件下 align-center / description / direction / space 都将失效.--> <div class="el-steps" :class="[ !simple && 'el-steps--' + direction, simple && 'el-steps--s…

Flutter中Expanded组件用法 Expanded组件可以使Row.Column.Flex等子组件在其主轴方向上展开并填充可用空间(例如,Row在水平方向,Column在垂直方向).如果多个子组件展开,可用空间会被其flex factor(表示扩展的速度.比例)分割. Expanded组件必须用在Row.Column.Flex内,并且从Expanded到封装它的Row.Column.Flex的路径必须只包括StatelessWidgets或StatefulWidgets组件(不能是其他类…

老孟导读:关于生命周期的文章共有2篇,第一篇是介绍 Flutter 中Stateful 组件的生命周期. 博客地址:http://laomengit.com/blog/20201227/Stateful%E7%BB%84%E4%BB%B6%E7%94%9F%E5%91%BD%E5%91%A8%E6%9C%9F.html 第二篇是 Flutter 中与平台相关的生命周期, 博客地址:http://laomengit.com/blog/20201227/%E7%9B%B8%E5%85%B3%E5%B…

前言 很多时候会依赖一些异步数据来动态更新UI,比如在打开一个页面时我们需要先从互联网上获取数据,在获取数据的过程中我们显示一个加载框,等获取到数据时我们再渲染页面:又比如想展示Stream(比如文件流.互联网数据接收流)的进度.当然,通过StatefulWidget完全可以实现上述这些功能.但由于在实际开发中依赖异步数据更新UI的这种场景非常常见,因此Flutter专门提供了FutureBuilder和StreamBuilder两个组件来快速实现这种功能. 接口描述 FutureBuilder…

前言 Color类中颜色以一个int值保存,显示器颜色是由红.绿.蓝三基色组成,每种颜色占8比特,存储结构如下: Bit(位) 颜色 0-7 蓝色 8-15 绿色 16-23 红色 24-31 Alpha(不透明度) Theme组件可以为Material APP定义主题数据(ThemeData).Material组件库里很多组件都使用了主题数据,如导航栏颜色.标题字体.Icon样式等.Theme内会使用InheritedWidget来为其子树共享样式数据. 接口描述 factory ThemeD…

前言 可以用ScrollController来控制可滚动组件的滚动位置. 接口描述 ScrollController({ // 初始滚动位置 double initialScrollOffset = 0.0, // 是否保持滚动位置 this.keepScrollOffset = true, this.debugLabel, }) 代码示例 // ScrollController // 可以用ScrollController来控制可滚动组件的滚动位置. import 'package:flutt…

前言 SingleChildScrollView类似于Android中的ScrollView,它只能接收一个子组件. 接口描述 const SingleChildScrollView({ Key key, this.scrollDirection = Axis.vertical, // 是否按照阅读方向相反的方向滑动,如:scrollDirection值为Axis.horizontal,如果阅读方向是从左到右(取决于语言环境,阿拉伯语就是从右到左). // reverse为true时,那么滑动方…

定义好一个有状态(或无状态)的组件之后,需要为其传递一些参数,希望组件能够更加灵活使用.那么,在 Flutter 中如何为其传递参数呢? 以下是 StatefulWidget 传递值的步骤,一共三步: 1.类中定义 final 全局变量: class QYInput extends StatefulWidget { final int minLines; } 2.构造函数中初始化变量: class QYInput extends StatefulWidget { final int minLin…