1

我正在尝试创建一个小部件，它是一个容器并接受两个参数，即图像的路径和图像的标题。到目前为止的小部件代码是：


class CharacterBox extends StatelessWidget {
  final String imagePath;
  final String characterName;
  CharacterBox(this.imagePath, this.characterName);
  @override
  Widget build(BuildContext context) {
    final CharacterBox args = ModalRoute.of(context).settings.arguments;
    return Container(
      margin: EdgeInsets.all(20.0),
      height: 200,
      width: 100,
      child: Column(
        children: [
          Expanded(
            child: Image(
              image: AssetImage(args.imagePath),
              alignment: Alignment.center,
              fit: BoxFit.contain,
            ),
          ),
          Container(
            margin: EdgeInsets.all(5.0),
            child: Text(
              args.characterName,
              style: TextStyle(color: Colors.white),
            ),
          )
        ],
      ),
      decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(5.0),
          color: Color.fromARGB(255, 252, 70, 82)),
    );
  }
}

我正在使用以下内容来传递参数：

body: SafeArea(
          child: Row(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: <Widget>[
              CharacterBox("assets/artwork.png", "Character"),
            ],
          ),
        ),

但是我收到错误消息：

The getter 'imagePath' was called on null.
Receiver: null
Tried calling: imagePath

我想这与 ModalRoute 声明有关，因为我是使用此文档进行的。但是，我仍然没有安静地得到它。

4

3 回答 3

1

您使用的args.imagePath应该只是imagePath Remove final CharacterBox args = ModalRoute.of(context).settings.arguments;，因为您已经通过构造函数传递了参数。

为了提高代码的可读性和性能，我建议以下：

您可以附加const在构造函数上。为了清楚起见，我将更改为此并使用名称参数：

class CharacterBox extends StatelessWidget {
  final String imagePath;
  final String characterName;
  const CharacterBox({
    Key key,
    this.imagePath,
    this.characterName
  }) : super(key: key);
于 2020-11-22T09:04:38.307 回答
0

不需要写args.imagePath和args.characterName

你可以直接称它为imagePathandcharacterName

     Image(
          image: AssetImage(imagePath),
          alignment: Alignment.center,
          fit: BoxFit.contain,
        ),

这是为了在颤振中使用路线名称导航

于 2020-11-22T09:07:04.880 回答
0

因为你正在传递论点constructor而不是Navigator

你可以直接使用imagePath和characterName喜欢

     Image(
      image: AssetImage(imagePath),
      alignment: Alignment.center,
      fit: BoxFit.contain,
    ),

您也可以从构建功能中删除此行，这是不必要的

final CharacterBox args = ModalRoute.of(context).settings.arguments;

它用于获取在Navigationlike期间传递的参数

Navigator.of(context).pushNamed('/characterBoxPage',arguments:);

在这里你可以阅读更多关于Navigate with arguments

但在您的情况下，它类似于通常在构造函数中发生的函数调用和参数传递。

如果您需要更多帮助，请在评论中告诉我

于 2020-11-22T10:52:48.963 回答