为什么图标小部件不接受 null？答案

【问题标题】：why icon widget wont accept null?为什么图标小部件不接受 null？
【发布时间】：2023-01-30 21:01:52
【问题描述】：

我创建了一个按钮小部件，我希望我的按钮图标是可选的。所以当我想为它写条件时，它不会接受它。这是我的代码：

import 'package:flutter/material.dart';

Widget CustomButtom({
  String? title,
  EdgeInsetsGeometry? paddin,
  EdgeInsetsGeometry? margin,
  double? width,
  double? height,
  Color? backgroundColor,
  dynamic? onPress,
  Color? fontColor,
  double? fontsize,
  double borderRaidius = 10,
  bool showIcon = true,
  Icon? buttonIcons,
}) {
  return Container(
    width: width,
    height: height,
    child: Directionality(
      textDirection: TextDirection.rtl,
      child: ElevatedButton.icon(
        style: ElevatedButton.styleFrom(
            backgroundColor: backgroundColor,
            shape: RoundedRectangleBorder(
              borderRadius: BorderRadius.circular(borderRaidius),
            )),
        onPressed: onPress,
        icon: showIcon? buttonIcons!:null,
        label: Text(
          '$title',
          style: TextStyle(fontSize: 20),
        ),
      ),
    ),
  );
}

这是我得到的错误

参数类型“图标？”无法分配给参数类型“Widget”。

【问题讨论】：

你需要使用 IconData 吗？参数和内部按钮中的图标，即图标：showIcon？图标（按钮图标！）：空，
“为什么？”。就是那样子。 icon 不允许是 null。如果您不需要图标，请不要使用ElevatedButton.icon
这是我在实用程序文件夹中创建的小部件，我希望能够继续使用它
或在 null 情况下提供默认图标

标签： flutter button widget icons

【解决方案1】：

我建议将它分成两个不同的小部件。当存在 showIcon false 时使用普通的 ElevatedButton，例如：

return Container(
  width: width,
  height: height,
  child: Directionality(
    textDirection: TextDirection.rtl,
    child: showIcon
        ? ElevatedButton.icon(
            style: ElevatedButton.styleFrom(
                backgroundColor: backgroundColor,
                shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(borderRaidius),
                )),
            onPressed: onPress,
            icon: buttonIcons!,
            label: Text(
              '$title',
              style: TextStyle(fontSize: 20),
            ),
          )
        : ElevatedButton(
            style: ElevatedButton.styleFrom(
                backgroundColor: backgroundColor,
                shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(borderRaidius),
                )),
            onPressed: onPress,
            child: Text(
              '$title',
              style: TextStyle(fontSize: 20),
            ),
          ),
  ),
);

请注意，当 showIcon 为 true 但 buttonIcons 为 null 时，您将获得异常。也许最好省略 showIcon 并只检查 buttonIcons 是 null 还是不在两者之间做出决定。所以像：

return Container(
  width: width,
  height: height,
  child: Directionality(
    textDirection: TextDirection.rtl,
    child: buttonIcons != null
        ? ElevatedButton.icon(
            style: ElevatedButton.styleFrom(
                backgroundColor: backgroundColor,
                shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(borderRaidius),
                )),
            onPressed: onPress,
            icon: buttonIcons,
            label: Text(
              '$title',
              style: TextStyle(fontSize: 20),
            ),
          )
        : ElevatedButton(
            style: ElevatedButton.styleFrom(
                backgroundColor: backgroundColor,
                shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(borderRaidius),
                )),
            onPressed: onPress,
            child: Text(
              '$title',
              style: TextStyle(fontSize: 20),
            ),
          ),
  ),
);

【讨论】：