Flutter代码中出现蓝色下划线的原因是什么？

Flutter开发场景下，编辑器的下划线提示是Dart静态分析工具给出的反馈，不同颜色对应不同严重等级：

• 蓝色下划线属于提示/警告级别，仅说明代码存在潜在风险，不会阻断编译运行
• 红色下划线属于错误级别，说明代码存在语法或编译规则问题，会直接阻断编译

蓝色下划线的常见触发原因 #

1. 隐式类型提示：你声明的size变量没有显式指定类型，Dart分析器会给出提示，告知你存在隐式类型推断的潜在兼容性风险
2. 非空安全弱提示：如果size被声明为可空类型，分析器会提示你后续直接使用存在空访问风险
3. 废弃API提示：如果size是你调用的已标记废弃的属性/方法返回值，也会触发蓝色提示

翻倍后变为红色下划线的常见触发原因 #

1. 类型不匹配错误：如果size被推断为int类型，翻倍后你直接将其赋值给Container.width这类明确要求double类型的参数，Dart 2.12之后已经禁用隐式类型转换，int无法直接赋值给double类型参数，就会触发错误
2. 可空类型操作错误：如果size是可空类型，你没有做判空处理就直接执行*运算，Dart不允许对可空值直接使用算术操作符，会触发错误
3. 约束范围越界：如果size是符合父组件约束的数值，翻倍后超出了父组件允许的数值范围，也会触发错误提示

常见解决示例 #

如果是类型不匹配问题，修改方案如下：

// 方案1：显式声明size为double类型
double size = 10;

// 方案2：运算时显式转换为double
Container(
  width: (size * 2).toDouble(),
)

// 方案3：可空类型先判空再操作
size ??= 10;
Container(
  width: size * 2.0,
)

内容的提问来源于stack exchange，提问作者praw