尝试使用自定义 MyMenu 小部件将旧代码迁移到空安全

Question

我制作了一个自定义的 MyMenu 小部件，其中包含：标题、imageUrl、形状和页面。逻辑是，如果没有可用的图像，则应使用默认图标。

    class MyMenu extends StatelessWidget {
    MyMenu({this.title, this.icon, this.shape, this.page, this.imageUrl = ''}) {
    if (icon != null) {
      assert(imageUrl == null || imageUrl.isEmpty);
    } else if (imageUrl != null && imageUrl.isEmpty) {
      assert(icon == null);
    }
   }

  final page;
  final String title;
  final IconData icon;
  final String imageUrl;
  final MaterialColor shape;

  @override
  Widget build(BuildContext context) {
    return Card(
      margin: EdgeInsets.all(9.0),
      child: InkWell(
        onTap: () => Navigator.push(
          context,
          MaterialPageRoute(builder: (context) => page),
        ),
        splashColor: Colors.amberAccent,
        child: Center(
          child: Column(
            mainAxisSize: MainAxisSize.min,
            children: <Widget>[
              Visibility(
                visible: icon != null && imageUrl.isEmpty,
                child: Icon(
                  icon,
                  size: 80.0,
                  color: shape,
                ),
                replacement: Image.asset(
                  imageUrl,
                  width: 80,
                  height: 80,
                ),
              ),
              Expanded(child: Text(title, style: new TextStyle(fontSize: 17.0)))
            ],
          ),
        ),
      ),
    );
  }
}






class Menus extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      child: GridView.count(
        crossAxisCount: 3,
        children: <Widget>[
          MyMenu(
            title: "Sony",
            imageUrl: 'assets/images/sony.png',
            shape: Colors.brown,
            page: SonyPage(),
          ),
          MyMenu(
            title: "Panasonic",
            imageUrl: 'assets/images/panasonic.png',
            shape: Colors.grey,
            page: PanasonicPage2(),
          ),
    ],
      ),
    );
  }
}

错误：由于参数 'title, icon & shape' 的类型，参数 'title, icon & shape' 的值不能为 'null'，但隐式默认值为 'null'。尝试添加显式非 'null' 默认值或 'required' 修饰符。当我添加 'required' 时，图标出现问题，因为 'Menus' class.

实际上不需要它

当我添加默认值时，其他问题开始出现。我需要帮助以更好的方式来做到这一点。谢谢。

Answer 1

根据您的要求，将 required 添加到除图标之外的所有字段。像这样：

MyMenu({required this.title, this.icon,required this.shape,required this.page, this.imageUrl = ''})

现在在声明时，使图标可以为空。

final page;
final String title;
final IconData? icon;  // <-- make this change
final String imageUrl;
final MaterialColor shape;

尝试使用自定义 MyMenu 小部件将旧代码迁移到空安全

Trying to migrate old code to null safety with a custom MyMenu widget

flutter

flutter-layout

flutter-animation