此篇文章用来记录学习Flutter 和 Dart 相关知识
零.Dart基本数据类型
Dart 是一种静态类型的编程语言,它提供了一系列基本数据类型,用于存储和操作不同种类的数据。以下是 Dart 中的一些基本数据类型以及它们的详细介绍:
1. 整数类型(Integer):
Dart 提供了两种整数类型:int 和 num。
int 表示整数,可以存储正数、负数和零。
num 是 int 和 double 的超类型,可以用来表示整数和浮点数。
int age = 30;
num temperature = 98.6;
2. 浮点数类型(Double):
Dart 中的浮点数类型为 double,用于表示带有小数点的数值。
double pi = 3.14159;
3.字符串类型(String):
字符串类型用于表示文本数据。
字符串可以由单引号或双引号包围。
String greeting = 'Hello, Dart!';
4.布尔类型(Boolean):
布尔类型只有两个值:true 和 false,用于表示逻辑真值和假值。
bool isDartFun = true;
5.列表类型(List):
列表是有序的数据集合,可以包含不同类型的元素。
列表使用方括号 [] 定义,并可以通过索引访问元素。
List<int> numbers = [1, 2, 3, 4, 5];
6.映射类型(Map):
映射是一组键值对的集合,其中每个键都与一个值相关联。
映射使用大括号 {} 定义。
Map<String, int> grades = {'Alice': 90, 'Bob': 85, 'Carol': 92};
7.符号类型(Symbol):
符号类型用于表示运行时的标识符或运算符。
符号使用 # 符号前缀定义。
Symbol mySymbol = #myIdentifier;
8.空类型(Null):
Dart 有一个特殊的数据类型 Null,表示一个空值或缺失值。
在非空安全(null-safe)的 Dart 中,所有的变量默认都不可以为 null,需要使用 ? 明确标记为可为 null。
String? nullableString = null; // 可为 null 的字符串
9.动态类型(Dynamic):
dynamic 是 Dart 中的一个特殊类型,可以存储任意类型的数据。
使用 dynamic 声明的变量可以在运行时改变其类型。
dynamic dynamicVariable = 42;
dynamicVariable = 'Hello';
这些是 Dart 中的一些基本数据类型。Dart 还支持更多高级数据类型,例如函数、类、枚举等,以便更灵活地处理各种数据和逻辑。此外,Dart 2.12 引入了非空安全(null safety)功能。
注意
Dart 中没有专门的字节数据类型,而是使用 int 来表示字节值,因为 Dart 的整数类型 int 可以存储 8 位的无符号整数,正好对应一个字节。如果你需要表示多个字节的数据,可以使用列表 (List) 或字节数组 (Uint8List,通常需要导入 dart:typed_data 库)。
一.Dart 一些语法
const
:关键字,用于声明一个编译时常量
变量声明
const int x = 5;构造函数: 用于声明一个可以在编译时确定值的常量构造函数。
class MyClass {final int value;const MyClass(this.value);
}数组和映射字面量: 可以用 const 声明编译时常量的数组和映射。
const List<int> numbers = [1, 2, 3];
const Map<String, int> scores = {'John': 100, 'Jane': 90};
继承关系
dart有三种方式,分别是extends(继承),with(混入) ,implements(实现),三种可以混合使用,其中with,implements后可以多继承,用逗号隔开,extends后面只能跟一个,优先级顺序为with>extends>implements,当with,implements后跟了多个的时候,优先级最右边大于左边,依次类推,例如extends a with b,c implements d,h,优先级为c>b>a>h>d;
函数可选参数
与java不同,dart中不支持重载,java支持方法重载,dart想要实现java类似的效果,可以通过可选参数来实现
selectFunction("张三");
selectFunction("李四",type: 1);
selectFunction("王五",type: 1,money: 83.2);void selectFunction(String name,{int? type,double? money}){print("名字:$name--类型:$type--金额:$money");
}
//注意dart可选参数必须要加?来表示该参数默认值为null,如果去掉?可以手动写个默认值,例如
void selectFunction(String name,{int type = 0,double? money}){print("名字:$name--类型:$type--金额:$money");
}
//输出结果:名字:张三--类型:null--金额:null
//名字:李四--类型:1--金额:null
//名字:王五--类型:1--金额:83.2
二.Flutter 中的一些基础小部件
Center
(居中对齐小部件):
Center小部件用于在可用空间内使其子小部件水平和垂直居中对齐。它接受一个需要居中的子小部件。Center小部件将扩展以填充父小部件的所有可用空间,并在该空间内居中其子小部件。
Center(child: Text('Hello, Flutter!',style: TextStyle(fontSize: 24.0),),
)
Text
(文本小部件):
Text小部件用于在屏幕上显示一行文本。可以自定义文本的样式,例如字体大小、颜色和对齐方式。通过将字符串传递给Text小部件的data参数,可以设置文本的内容。
常用的Text属性:
data(String)
:要显示的文本内容。style(TextStyle)
:定义文本的样式,如字体、大小、颜色等。textAlign(TextAlign)
:指定文本在水平方向上的对齐方式。
–TextAlign.left:文本左对齐。
–TextAlign.right:文本右对齐。
–TextAlign.center:文本居中对齐。
–TextAlign.justify:文本两端对齐,会调整单词和字之间的间隔。textDirection(TextDirection)
:指定文本的方向,如从左到右或从右到左。textScaleFactor(double)
:指定文本的缩放比例。maxLines(int)
:指定允许的最大行数,超过将使用"…"截断。overflow(TextOverflow)
:定义文本溢出时的处理方式。softWrap(bool)
:指定文本是否自动换行。
body: Center(child: Text('Hello, Flutter!',style: TextStyle(fontSize: 24,fontWeight: FontWeight.bold,color: Colors.blue,),),),
Button
(按钮)
RaisedButton
RaisedButton 是一个具有凸起效果的按钮,通常用于主要操作。
它具有各种自定义属性,如 onPressed、child、color、disabledColor、textColor 等,以定制外观和行为。
RaisedButton(onPressed: () {// 按钮被点击时执行的操作},child: Text('Submit'),
)
FlatButton
FlatButton 是一个扁平化的按钮,通常用于次要操作。
它有类似于 RaisedButton 的自定义属性,可以根据需求进行定制。
FlatButton(onPressed: () {// 按钮被点击时执行的操作},child: Text('Cancel'),
)
OutlineButton
OutlineButton 是一个带有边框的按钮,通常用于取消操作或与背景区分。
它也有类似于 RaisedButton 的自定义属性,以便自定义外观和行为。
OutlineButton(onPressed: () {// 按钮被点击时执行的操作},child: Text('Clear'),
)
FloatingActionButton
FloatingActionButton 是一个圆形的浮动操作按钮,常用于应用程序的主要操作。
它也具有各种自定义属性和样式,可以根据需求进行调整。
FloatingActionButton(onPressed: () {// 按钮被点击时执行的操作},child: Icon(Icons.add),
)
IconButton
IconButton 是一个只包含图标的按钮,通常用于具有图标表示的操作。
它也有各种自定义属性和样式,以便自定义外观和行为。
IconButton(onPressed: () {// 按钮被点击时执行的操作},icon: Icon(Icons.favorite),
)
Container
(容器小部件):
Container小部件是一个多用途灵活的小部件,可以包含其他小部件。允许自定义属性,如宽度、高度、填充、边距、颜色等,以控制其子小部件的布局和外观。它还可以对子小部件应用变换、装饰和约束。
Container(width: 200.0,height: 100.0,color: Colors.blue,child: Center(child: Text('Hello, Flutter!',style: TextStyle(fontSize: 24.0, color: Colors.white),),),
)
Row
和Column
(行和列小部件):
这些布局小部件用于将其子小部件按水平(Row)或垂直(Column)线排列。它们可以包含多个子小部件,并根据子小部件的属性和可用空间自动调整大小和位置。可以使用特定参数控制子小部件的对齐方式、间距和调整大小的行为。
Row小部件具有以下一些常用的属性:
children(List<Widget>)
:需要包含在Row中的子部件列表。mainAxisAlignment(MainAxisAlignment)
:子部件在主轴方向上的对齐方式,默认是start。crossAxisAlignment(CrossAxisAlignment)
:子部件在交叉轴方向上的对齐方式,默认是start。mainAxisSize(MainAxisSize)
:Row在主轴方向上的大小约束,默认是MainAxisSize.max。textDirection(TextDirection)
:子部件的文本方向,默认是TextDirection.ltr。verticalDirection(VerticalDirection)
:子部件在垂直方向上布局的方向,默认是VerticalDirection.down。
body: Row(mainAxisAlignment: MainAxisAlignment.center, // 在水平方向上居中对齐crossAxisAlignment: CrossAxisAlignment.start, // 在垂直方向上上对齐mainAxisSize: MainAxisSize.min, // 占用尽可能少的水平空间textDirection: TextDirection.ltr, // 子部件的文本方向从左到右verticalDirection: VerticalDirection.down, // 从上到下布局children: [Text('First Item',style: TextStyle(fontSize: 24),),SizedBox(width: 20), // 在子部件之间增加间距Text('Second Item',style: TextStyle(fontSize: 24),),Container(color: Colors.blue,width: 200,height: 200,child: Text('Third Item',style: TextStyle(fontSize: 24, color: Colors.white),),),],),
Column小部件具有以下一些常用的属性:
children(List<Widget>)
:需要包含在Column中的子部件列表。mainAxisAlignment(MainAxisAlignment)
:子部件在主轴方向上的对齐方式,默认是start。crossAxisAlignment(CrossAxisAlignment)
:子部件在交叉轴方向上的对齐方式,默认是start。mainAxisSize(MainAxisSize)
:Column在主轴方向上的大小约束,默认是MainAxisSize.max。verticalDirection(VerticalDirection)
:子部件在垂直方向上布局的方向,默认是VerticalDirection.down。
body: Column(mainAxisAlignment: MainAxisAlignment.center, // 在垂直方向上居中对齐crossAxisAlignment: CrossAxisAlignment.start, // 在水平方向上左对齐mainAxisSize: MainAxisSize.min, // 占用尽可能少的垂直空间verticalDirection: VerticalDirection.down, // 从上到下布局children: [Text('First Item',style: TextStyle(fontSize: 24),),SizedBox(height: 20), // 在子部件之间增加间距Text('Second Item',style: TextStyle(fontSize: 24),),Container(color: Colors.blue,width: 200,height: 200,child: Text('Third Item',style: TextStyle(fontSize: 24, color: Colors.white),),),],),
Image
(图像小部件):
Image小部件用于在屏幕上显示图像。它支持各种图像来源,例如本地资源、网络图像和内存图像。可以自定义其属性,如大小、缩放和对齐方式,以及处理加载和错误状态。
Image(image: AssetImage('assets/images/flutter_logo.png'),width: 100.0,height: 100.0,
)
StatelessWidget
和StatefulWidget
StatelessWidget:
StatelessWidget是一种无状态的小部件,意味着它在创建后是不可变的,不会随时间改变。它基于构建函数的输入参数,一旦构建完成,就渲染出静态的用户界面。简单来说,StatelessWidget没有内部状态(state)。
import 'package:flutter/material.dart';class MyWidget extends StatelessWidget {final String text;MyWidget({required this.text});Widget build(BuildContext context) {return Container(child: Text(text),);}
}
StatefulWidget:
StatefulWidget是一种有状态的小部件,它的内部状态可以随时间变化,所以它可以在创建后重新构建。StatefulWidget由两个部分组成:一个是State对象,用于保存和管理小部件的状态,另一个是StatefulWidget类本身,用于构建小部件的UI。
import 'package:flutter/material.dart';class CounterWidget extends StatefulWidget { _CounterWidgetState createState() => _CounterWidgetState();
}class _CounterWidgetState extends State<CounterWidget> {int _counter = 0;void _incrementCounter() {setState(() {_counter++;});}Widget build(BuildContext context) {return Column(children: [Text('Counter: $_counter'),ElevatedButton(onPressed: _incrementCounter,child: Text('Increment'),),],);}
}
GestureDetector
用于处理用户手势和触摸事件。它可以用于识别和响应各种手势,如点击、长按、拖动、缩放和滑动等。GestureDetector 可以包裹任何其他小部件,并通过回调函数来响应不同的手势事件。
GestureDetector 的常用属性和介绍:
onTap
: 当用户轻触手势时触发的回调函数。onDoubleTap
: 当用户双击手势时触发的回调函数。onLongPress
: 当用户长按手势时触发的回调函数。onLongPressMoveUpdate
: 当用户在长按手势的情况下移动时触发的回调函数。onVerticalDragDown
: 当用户在垂直方向开始拖动手势时触发的回调函数。onVerticalDragEnd
: 当用户在垂直方向结束拖动手势时触发的回调函数。onScaleStart
: 当用户开始缩放手势时触发的回调函数。onScaleUpdate
: 当用户进行缩放手势时触发的回调函数。behavior
: 用于指定如何识别和处理手势事件的 HitTestBehavior。
使用示例:
import 'package:flutter/material.dart';class MyGestureDetector extends StatelessWidget {Widget build(BuildContext context) {return GestureDetector(// 点击事件onTap: () {print('onTap');},// 双击事件onDoubleTap: () {print('onDoubleTap');},// 长按事件onLongPress: () {print('onLongPress');},// 缩放手势onScaleStart: (details) {print('onScaleStart: ${details.focalPoint}');},onScaleUpdate: (details) {print('onScaleUpdate: ${details.focalPoint}, ${details.scale}');},onScaleEnd: (details) {print('onScaleEnd: ${details.velocity}');},// 拖动手势onPanStart: (details) {print('onPanStart: ${details.globalPosition}');},onPanUpdate: (details) {print('onPanUpdate: ${details.globalPosition}');},onPanEnd: (details) {print('onPanEnd: ${details.velocity}');},// 指针击中测试behavior: HitTestBehavior.opaque,// 点击区域的命中测试hitTestBehavior: HitTestBehavior.translucent,// 排除特定手势excludeFromSemantics: true,// 双击事件的时间窗口doubleTapTimeout: Duration(milliseconds: 300),// 长按事件的时间窗口longPressTimeout: Duration(milliseconds: 500),// 长按事件的触发间隔longPressMoveUpdateDelay: Duration(milliseconds: 200),// 其它属性dragStartBehavior: DragStartBehavior.start,child: Container(width: 200,height: 200,color: Colors.blue,),);}
}
三.对齐 widgets
mainAxisAlignment
和crossAxisAlignment
是用于定位和对齐子部件的属性,它们通常用于Flex、Row和Column等布局小部件中。
mainAxisAlignment的值可以是以下之一:
- MainAxisAlignment.start:将子部件沿主轴的起始位置对齐。
- MainAxisAlignment.end:将子部件沿主轴的结束位置对齐。
- MainAxisAlignment.center:将子部件沿主轴的中心位置对齐。
- MainAxisAlignment.spaceBetween:将子部件均匀地分布在主轴上,使它们之间的间距相等,第一个子部件放置在起始位置,最后一个子部件放置在结束位置。
- MainAxisAlignment.spaceAround:将子部件均匀地分布在主轴上,使它们之间和两端的间距相等。
- MainAxisAlignment.spaceEvenly:将子部件均匀地分布在主轴上,使它们之间的间距和两端的间距相等。
mainAxisAlignment使用示例:
Row(mainAxisAlignment: MainAxisAlignment.spaceBetween,children: [Container(color: Colors.red, width: 50, height: 50),Container(color: Colors.green, width: 50, height: 50),Container(color: Colors.blue, width: 50, height: 50),],
)
crossAxisAlignment的值可以是以下之一:
- CrossAxisAlignment.start:将子部件沿副轴的起始位置对齐。
- CrossAxisAlignment.end:将子部件沿副轴的结束位置对齐。
- CrossAxisAlignment.center:将子部件沿副轴的中心位置对齐。
- CrossAxisAlignment.stretch:将子部件沿副轴拉伸以填充可用空间。
- CrossAxisAlignment.baseline:将子部件的基线与副轴上的基准线对齐,需要在子部件上设置基线对齐方式(如TextBaseline)。
crossAxisAlignment使用示例:
Column(crossAxisAlignment: CrossAxisAlignment.center,children: [Container(color: Colors.red, width: 50, height: 50),Container(color: Colors.green, width: 50, height: 50),Container(color: Colors.blue, width: 50, height: 50),],
)
四.调整widgets大小
Expanded widget
用于在父部件的剩余可用空间中扩展一个子部件。它通常与Flex、Column或Row等灵活的布局小部件一起使用,以便在父部件中使用弹性盒子模型进行布局。
当Expanded小部件包装在一个子部件周围时,它会将该子部件填充并扩展到可用空间的剩余部分,以沿着主轴方向占据所有剩余的空间。这使得子部件能够灵活地从父部件中分配和占据可用空间,而不受其自身固定大小的限制。
使用示例
Row(children: [Container(color: Colors.red, width: 50, height: 50),Expanded(child: Container(color: Colors.green),),Container(color: Colors.blue, width: 50, height: 50),],
)
Flex
Flex用于创建灵活的布局,可以根据可用空间的大小动态调整子部件的大小。可以将 Flex 小部件作为Expanded的子部件,并通过指定flex属性来控制子部件在可用空间中的分配比例。
可以简单理解为LinearLayout中的权重
使用示例
Row(children: [Container(color: Colors.red, width: 50, height: 50),Expanded(flex: 2,child: Container(color: Colors.green),),Expanded(flex: 1,child: Container(color: Colors.blue),),],
)
当一个Expanded组件包含在一个垂直方向(或水平方向)的Flex容器(如Column或Row)中时,该Expanded组件会将其子组件填充到相应方向上的所有可用空间。如果有多个垂直方向的Expanded组件,则它们会按照它们的flex属性(默认为1)来分配可用空间。
换句话说,Expanded组件在默认情况下会尽可能地扩展,以填充Flex容器中剩余的可用空间,但具体的高度取决于Flex容器的大小和其他子组件的约束条件
五.通用布局 widgets
标准 widgets
-
Container:向 widget 增加 padding、margins、borders、background color 或者其他的“装饰”。
-
GridView:将 widget 展示为一个可滚动的网格。
-
ListView:将 widget 展示为一个可滚动的列表。
-
Stack:将 widget 覆盖在另一个的上面。
Material widgets
-
Card:将相关信息整理到一个有圆角和阴影的盒子中。
-
ListTile:将最多三行的文本、可选的导语以及后面的图标组织在一行中。
六.输入表单
TextField
(文本框)
用于接收用户输入文本的小部件,它提供了一个可编辑的文本框,用户可以在其中输入、编辑和选择文本。
常用的属性及其作用:
controller
: 一个 TextEditingController 对象,用于控制文本输入框的值,获取输入的内容或设置初始值。focusNode
: 一个 FocusNode 对象,用于管理输入框的焦点。decoration
: InputDecoration 类型的对象,用于定义输入框的外观,包括标签文本、提示文本、边框样式等。keyboardType
: TextInputType 枚举类型,指定键盘的类型,以匹配输入的预期内容,如文本、数字、URL、电子邮件等。textInputAction
: TextInputAction 枚举类型,定义了与输入框关联的操作按钮的行为,如完成、下一步、搜索等。onChanged
: 输入内容变化时的回调函数,接受最新的输入值作为参数,通常用于实时校验或更新状态。onSubmitted
: 用户提交输入后的回调函数,接受最终的输入值作为参数。obscureText
: bool 值,用于指定是否要隐藏输入内容,常用于密码输入框。maxLines
: int 值,用于指定输入框的最大行数。maxLength
: int 值,用于指定最大输入长度。enabled
: bool 值,用于指定输入框是否可编辑。autofocus
: bool 值,用于指定是否自动获取焦点。textAlign
: TextAlign 枚举类型,指定文本内容的对齐方式,如左对齐、右对齐、居中等。cursorColor
: Color 对象,指定光标的颜色。cursorWidth
: double 值,用于指定光标的宽度。
使用示例:
import 'package:flutter/material.dart';class MyTextField extends StatefulWidget { _MyTextFieldState createState() => _MyTextFieldState();
}class _MyTextFieldState extends State<MyTextField> {TextEditingController _controller = TextEditingController();FocusNode _focusNode = FocusNode();void dispose() {_controller.dispose();_focusNode.dispose();super.dispose();}Widget build(BuildContext context) {return TextField(controller: _controller,focusNode: _focusNode,decoration: InputDecoration(labelText: 'Enter your name',hintText: 'John Doe',prefixIcon: Icon(Icons.person),suffixIcon: IconButton(icon: Icon(Icons.clear),onPressed: () {_controller.clear();},),border: OutlineInputBorder(),),keyboardType: TextInputType.text,textInputAction: TextInputAction.done,onChanged: (value) {print('Input: $value');},onSubmitted: (value) {print('Submitted: $value');_focusNode.unfocus();},);}
}
关于TextEditingController和FocusNode的介绍:
TextEditingController
TextEditingController是一个控制文本输入的类,它提供了一些方法和属性来获取和修改TextField中输入的文本。主要作用包括:
- 可以获取TextField中的文本内容:使用text属性可以获取TextField中当前的文本内容。
- 可以设置TextField的初始值或修改文本内容:使用text属性可以设置TextField的初始值,也可以通过textEditingController.text = newText来修改文本内容。
- 可以监听文本变化:可以通过注册addListener()方法来监听TextField中的文本变化,以便执行特定的操作。
FocusNode
FocusNode是用于处理TextField焦点的类,它允许管理应用程序中的焦点,并监听焦点变化事件。主要作用包括:
- 管理TextField的焦点:通过将TextField的focusNode属性设置为FocusNode对象,可以管理TextField的焦点。例如,可以使用focusNode.requestFocus()请求焦点,并使用focusNode.unfocus()取消焦点。
- 监听焦点变化:可以通过注册addListener()方法来监听焦点的变化,以便在焦点状态发生变化时执行特定的操作,比如显示或隐藏键盘。
- 控制键盘行为:通过设置keyboardType和textInputAction属性,可以控制键盘的类型(例如纯文本、数字等)和键盘完成按钮的样式(例如完成、下一个等)。
TextFormField (表单文本框)
TextFormField 是一个带有表单功能的文本输入字段小部件。它是基于 TextField 的封装,并提供了一些额外的功能,如表单验证和错误处理。
常用属性及其作用:
-
controller: 一个 TextEditingController 对象,用于控制文本输入框的值,获取输入的内容或设置初始值。
-
focusNode: 一个 FocusNode 对象,用于管理输入框的焦点。
-
decoration: InputDecoration 类型的对象,用于定义输入框的外观,包括标签文本、提示文本、边框样式等。
-
keyboardType: TextInputType 枚举类型,指定键盘的类型,以匹配输入的预期内容,如文本、数字、URL、电子邮件等。
-
textInputAction: TextInputAction 枚举类型,定义了与输入框关联的操作按钮的行为,如完成、下一步、搜索等。
-
validator: 一个函数,接受输入的字符串,根据需求返回一个错误提示字符串,用于对输入内容进行验证。
-
onChanged: 输入内容变化时的回调函数,接受最新的输入值作为参数,通常用于实时校验或更新状态。
-
onFieldSubmitted: 用户提交输入后的回调函数,接受最终的输入值作为参数。
使用示例:
import 'package:flutter/material.dart';class MyForm extends StatefulWidget { _MyFormState createState() => _MyFormState();
}class _MyFormState extends State<MyForm> {final _formKey = GlobalKey<FormState>();TextEditingController _nameController = TextEditingController();Widget build(BuildContext context) {return Form(key: _formKey,child: TextFormField(controller: _nameController,decoration: InputDecoration(labelText: 'Name',hintText: 'Enter your name',),validator: (value) {if (value.isEmpty) {return 'Please enter your name';}return null;},onFieldSubmitted: (value) {if (_formKey.currentState.validate()) {// 执行提交操作}},),);}
}
七.关键词
part
用于将多个Dart文件组织在一起,以便更好地管理和维护代码。
part 指令是Dart语言的一部分,它允许你将一个Dart文件分成多个部分,并将它们组合在一起以形成一个完整的库。这对于将大型代码库分解为更小的可管理部分非常有用。
part ‘WeiBoCommentList.g.dart’; 表示当前的Dart文件是一个库的一部分,并且需要引入另一个名为 WeiBoCommentList.g.dart 的Dart文件,以共享一些代码或声明。
通常,part 指令在使用代码生成工具时非常有用,例如json_serializable或moor_generator。这些工具可以根据模型类自动生成代码,而将生成的代码放在单独的文件中,然后使用 part 指令将其引入到主要的模型文件中。
例如,假设 WeiBoCommentList.g.dart 包含自动生成的序列化或数据库访问代码,而 WeiBoCommentList.dart 包含模型类的定义。通过使用 part 指令,你可以将自动生成的代码与手动编写的代码分离开来,以便更轻松地维护和管理项目。
Completer
Completer 是一个用于处理异步操作的类,它允许你手动控制异步操作的完成和结果返回。Completer 的主要作用是创建一个 Future 对象,并允许你在某个后续时刻手动完成这个 Future,从而传递一个值或错误。
以下是 Completer 的主要作用:
-
手动完成 Future:使用 Completer,你可以创建一个未来的实例,并在需要的时候手动完成它。这对于异步操作,如网络请求、文件读写等,非常有用,因为你可以在操作完成后通过 Completer 将结果传递给等待的代码。
-
处理异步操作的结果:当你使用异步操作时,通常需要等待操作完成并获取结果。通过 Completer 创建的 Future,你可以使用 await 关键字或 .then() 方法等方式来等待操作完成,并获取其结果。
示例:
import 'dart:async';Future<void> fetchData() async {Completer<void> completer = Completer<void>();// 模拟一个异步操作,等待2秒钟后完成Future.delayed(Duration(seconds: 2), () {completer.complete(); // 手动完成Future});await completer.future; // 等待Future完成print('Data fetched successfully');
}void main() {fetchData();print('Fetching data...'); // 这一行会在异步操作完成前执行
}
StreamSubscription
StreamSubscription 是使用 Dart 中的流(Stream)的一种方式。流是一系列异步事件的序列,可以用于接收和处理来自异步操作(如网络请求、数据库查询等)的事件。
StreamSubscription 用于订阅流,并可以跟踪和取消订阅。当你订阅一个流时,你可以指定一个回调函数来处理流中发出的事件。回调函数会在每个事件到达时被调用,而不是等待整个流完成。
订阅流
要订阅流,首先需要获取一个流对象。在Flutter中,很多类(如StreamController、StreamTransformer等)都提供了流的实例化和管理。一旦获取到流对象,你可以使用stream.listen()方法订阅流,并提供一个回调函数来处理流中的事件。
Stream<int> countStream() async* {for (int i = 1; i <= 5; i++) {await Future.delayed(Duration(seconds: 1));yield i;}
}void main() {final stream = countStream();final subscription = stream.listen((data) {print('Received: $data');});// 取消订阅subscription.cancel();
}
上面的示例中,创建了一个简单的计数流countStream(),它每隔一秒产生一个整数。我们通过stream.listen()方法订阅了这个流,并提供了一个回调函数来处理每个事件。
取消订阅
当不再需要订阅流时,应该显式地取消订阅,以释放资源和停止事件的处理。可以调用StreamSubscription对象的cancel()方法来取消订阅。
final subscription = stream.listen((data) {print('Received: $data');
});// 取消订阅
subscription.cancel();
在上面的示例中,保存了StreamSubscription对象到subscription变量中,并在不再需要时调用了cancel()方法来取消订阅。
使用StreamSubscription的其他方法和属性
StreamSubscription提供了一些其他有用的方法和属性,用于管理订阅和检查流的状态,例如:
pause()
和resume()
:暂停和恢复订阅,以便控制事件的处理。onData()
:设置一个新的事件回调函数,替换原来的回调函数。onError()
:设置一个错误回调函数,用于处理流中的错误事件。onDone()
:设置一个完成回调函数,用于处理流结束时的事件。isPaused
:一个布尔值,表示当前订阅是否已暂停。
mixin
Mixin是一种强大的代码重用机制,它允许你将一个类的成员添加到另一个类中,而无需继承该类。Mixin提供了一种方式来在类之间共享代码,同时保持类之间的分离性。
1. 基本语法
class MyClass with MyMixin {// 类的成员和方法
}mixin MyMixin {// Mixin中的成员和方法
}
在上面的代码中,MyClass类通过with MyMixin语法引入了MyMixin的功能。
2. Mixin的特点
- Mixin类本身不能被实例化,它们只能被用作其他类的组成部分。
- 类可以使用多个Mixin,通过逗号分隔,这允许多个类的功能被组合到一个类中。
- Mixin可以有自己的属性和方法,这些属性和方法可以被包含Mixin的类访问和使用。
- 如果多个Mixin中有同名的方法或属性,那么包含Mixin的类必须通过显式指定使用哪个Mixin的方式来解决冲突。
- Mixin的顺序很重要,因为方法冲突时会按照Mixin的顺序来解析。
3. Mixin的应用场景
3.1. 接口实现
Mixin可以用于实现接口,允许一个类同时具有多个接口的功能。
class MyWidget with WidgetMixin, ClickableMixin {// ...
}
3.2. 功能复用
Mixin可以用于将通用功能添加到多个类中,避免重复编写相似的代码。
mixin LoggerMixin {void log(String message) {print(message);}
}class MyClass with LoggerMixin {// ...
}
3.3. 数据序列化与反序列化
Mixin可以用于为多个数据模型类添加数据序列化和反序列化的功能。
mixin JsonSerializable {Map<String, dynamic> toJson();void fromJson(Map<String, dynamic> json);
}class Person with JsonSerializable {// ...
}
3.4. 路由导航
在Flutter中,Mixin经常用于处理路由导航,以减少页面之间的代码冗余。
3.5. 状态管理
在Flutter中,StatefulWidget常常使用Mixin来添加状态管理的功能。
with
with关键字用于在类定义中混入(mixin)一个或多个 mixin 类。Mixin 是一种在 Dart 中实现代码重用的机制,它允许你将一个或多个 mixin 类的特性添加到一个类中,而无需继承这些 mixin 类。
使用方式:
class MyClass with Mixin1, Mixin2, ... {// 类的成员和方法
}
关于 with 关键字的详细介绍:
-
混入Mixin的类:with 后面可以跟一个或多个 mixin 类,用逗号分隔。这意味着你可以从多个 mixin 类中继承特性,将它们组合到一个类中,从而实现多重继承的效果。
-
Mixin的顺序:Mixin 的顺序很重要,因为如果多个 mixin 类中具有相同名称的属性或方法,类中将使用最后一个 mixin 中定义的属性或方法。这个规则确保了 mixin 类的顺序对类的行为产生影响。
-
Mixin的特性:通过使用 with 关键字,类将继承 mixin 类的属性、方法和功能,这些特性会被添加到类中。这允许你在不继承 mixin 类的情况下,使用 mixin 类的功能。
-
Mixin的用途:with 关键字通常用于以下情况:
- 实现接口:通过混入一个 mixin 类,类可以实现多个接口的功能。
- 代码复用:可以将通用功能添加到多个类中,以减少代码重复性。
- 实现混合功能:在不使用多重继承的情况下,将多个 mixin 类的功能组合在一个类中。
dynamic和Object
1、Object 是dart所有对象的根基类,也就是说所有类型都是Object的子类,所以任何类型的数据都可以赋值给Object声明的对象.
2、dynamic与var一样都是关键词,声明的变量可以赋值任意对象. 而dynamic与Object相同之处在于,他们声明的变量可以在后期改变赋值类型.
typedef
用于创建自定义类型别名(type alias)。类型别名允许你为现有的数据类型或函数签名定义一个新的名称,以便在代码中更清晰地表达类型或函数签名的含义
以下是关于typedef关键字的详细介绍:
- 为数据类型创建类型别名:
typedef IntList = List<int>;
typedef StringMap = Map<String, String>;
- 为函数签名创建类型别名:
对于回调函数或函数参数特别有用
typedef VoidCallback = void Function();
typedef BinaryOperation = int Function(int, int);
- 与高阶函数一起使用:
typedef FilterFunction<T> = bool Function(T);List<T> filterList<T>(List<T> list, FilterFunction<T> filter) {return list.where(filter).toList();
}
get
get关键字用于创建一个Getter方法,它允许你访问对象的属性或计算属性的值,就像访问类的实例变量一样。Getter方法通常用于获取对象的某个属性值,而不是直接访问实例变量,以提供更多的封装和控制。
1.创建Getter方法:通过在类中定义一个以get关键字开头的方法,你可以创建一个Getter方法,该方法用于获取某个属性的值。Getter方法的语法如下:
Type get propertyName {// 在这里计算和返回属性的值
}
其中,Type是属性的数据类型,propertyName是你希望暴露的属性名称。
2.延迟加载属性:Getter方法可以用于延迟加载属性的值。这意味着属性的值只有在首次访问Getter方法时才会计算,而不是在对象创建时。这对于节省资源和提高性能很有用。
class LazyLoader {List<int> _data = [1, 2, 3, 4];int get sum {// 计算并返回列表元素的总和return _data.reduce((a, b) => a + b);}
}
3.属性访问控制:使用Getter方法可以对属性的访问进行控制,例如,你可以在Getter方法中添加条件来检查属性的有效性,然后返回相应的值。
class Temperature {double _celsius;Temperature(this._celsius);double get celsius {if (_celsius < -273.15) {throw ArgumentError("Temperature cannot be below absolute zero.");}return _celsius;}
}
4.在子类中覆盖:Getter方法可以在子类中被覆盖,允许你根据需要自定义子类的属性访问行为。
class Parent {int get value => 42;
}class Child extends Parent { int get value => super.value * 2; // 在子类中覆盖Getter方法
}
未完待续…