Flutter升级至2.12.0-3.0.0版本后设置Card边框报Color类型不匹配错误

该异常是Flutter 2.12.0 正式启用空安全（Null Safety）机制后触发的类型不兼容编译错误：

• 空安全规则下，Colors.blue 对应的MaterialColor类，通过方括号索引取色值的操作（即Colors.blue[xxx]），因为没有强校验保证传入的索引一定对应有效色值（例如传入不存在的索引Colors.blue[999]会直接返回null），所以该操作的返回值是可空类型 Color?。
• 而BorderSide类的color构造参数，在空安全规范下被定义为必须传入非空的Color类型，不支持传入可空的Color?值，因此直接传入索引取到的色值会触发类型不匹配报错。
• 在2.12之前的Flutter版本没有强制空安全校验，即便传入可空类型值也不会触发编译拦截，因此该问题仅在升级到支持空安全的SDK版本后才会暴露。

按推荐优先级排序：

• 优先级最高：使用MaterialColor提供的非空shade属性取对应色值，替代方括号索引取值的方式，比如将Colors.blue[300]改为Colors.blue.shade300，这种方式返回的是确定的非空Color类型，完全符合空安全要求，无空指针风险。
• 临时兼容：如果不想修改原有取色逻辑，可以在可空的色值表达式后添加非空断言运算符!，将可空值强制转为非空类型，比如写成Colors.blue[300]!——仅适用于能100%确定传入索引对应有效色值的场景。
• 动态取色兜底：如果需要根据变量动态传入色值索引，无法确定索引有效性的场景，可以通过空合并运算符??给可空值配置兜底默认值，比如Colors.blue[dynamicIndex] ?? Colors.blue，保证传入BorderSide的color参数永远是非空的。

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: Center(
          child: Card(
              shape: RoundedRectangleBorder(
                // 替换原可空的Colors.blue[300]为非空的shade300
                side: BorderSide(color: Colors.blue.shade300, width: 2.0),
                borderRadius: BorderRadius.circular(15.0),
              ),
              child: Text('Demo')),
        ),
      ),
    );
  }
}

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