繁体   English   中英

构建卡片小部件[Flutter]

[英]Building a card widget [Flutter]

我试图在扑朔迷离中建立自己的卡,但是我不断收到未定义孩子的错误。

我要制作的卡片类型可以在这里看到

是否也可以将我链接到一个教程,该教程正确解释了何时使用child和child,因为这似乎是我目前的问题。

我的代码如下所示:

    List<Widget> cardlist = <Widget>[
  new Card(
    child: new Column(
      children: <Widget>[
        new Row(
          child: new CircleAvatar(
            backgroundImage: new AssetImage('images/pic.jpg'),
            radius: 100.0,
          ),
        )
      ],
      child: new Row(
        child: new CircleAvatar(
          backgroundImage: new AssetImage('images/pic.jpg'),
          radius: 100.0,
        ),
        child: new Text(
          'News Location',
          style: new TextStyle(
            fontSize: 20.0,
            fontWeight: FontWeight.bold,
            color: Colors.black,
          ),
        ),
      ),
      child: new Image.asset(
        'images/lake.jpg',
        height: 240.0,
        fit: BoxFit.cover,
      ),
      child: new Text(
        'News Headline',
        style: new TextStyle(
          fontSize: 20.0,
          fontWeight: FontWeight.bold,
          color: Colors.black,
        ),
      ),
      child: new Text(
        'News Summary',
        style: new TextStyle(
          fontSize: 20.0,
          fontWeight: FontWeight.bold,
          color: Colors.black,
        ),
      ),
      child: new Row(
        child: new CircleAvatar(
          backgroundImage: new AssetImage('images/pic.jpg'),
          radius: 100.0,
        ),
        child: new Text(
          'News Source',
          style: new TextStyle(
            fontSize: 20.0,
            fontWeight: FontWeight.bold,
            color: Colors.black,
          ),
        ),
        child: new Text(
          '12 hours ago',
          style: new TextStyle(
            fontSize: 20.0,
            fontWeight: FontWeight.bold,
            color: Colors.black,
          ),
        ),

      ),
    ),
  )
];

我认为您想要类似下面的内容,虽然不确定它是否正确,但是应该为您提供一个起点。 基本上,您需要了解何时使用子级,何时使用子级以及正确的语法。 只需考虑一下您正在使用的小部件,以及它是否可以包含一个(子级)或多个(子级)子级小部件,或者查看文档以了解所需内容:)

body: new Center(
        child: new Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            new Card(
              child: new Column(                
                children: [
                  new Row(
                    children: [
                      new CircleAvatar(
                        backgroundImage: new AssetImage('images/pic.jpg'),
                        radius: 100.0,
                      ),
                    ]
                  ),
                ]
              ),
            ),
            new Card(
              child : new Row(
                children : [
                  new CircleAvatar(
                    backgroundImage: new AssetImage('images/pic.jpg'),
                    radius: 100.0,
                  ),
                  new Text(
                    'News Location',
                    style: new TextStyle(
                      fontSize: 20.0,
                      fontWeight: FontWeight.bold,
                      color: Colors.black,
                    ),
                  ),
                ]
              ),
            ),
            new Card(
              child: new Column(                
                children: [
                  new Image.asset(
                    'images/lake.jpg',
                    height: 240.0,
                    fit: BoxFit.cover,
                  ),
                  new Text(
                    'News Headline',
                    style: new TextStyle(
                      fontSize: 20.0,
                      fontWeight: FontWeight.bold,
                      color: Colors.black,
                    ),
                  ),
                  new Text(
                    'News Summary',
                    style: new TextStyle(
                      fontSize: 20.0,
                      fontWeight: FontWeight.bold,
                      color: Colors.black,
                    ),
                  ),
                  new Row(
                    children : [
                      new CircleAvatar(
                        backgroundImage: new AssetImage('images/pic.jpg'),
                        radius: 100.0,
                      ),
                      new Text(
                        'News Source',
                        style: new TextStyle(
                          fontSize: 20.0,
                          fontWeight: FontWeight.bold,
                          color: Colors.black,
                        ),
                      ),
                      new Text(
                        '12 hours ago',
                        style: new TextStyle(
                          fontSize: 20.0,
                          fontWeight: FontWeight.bold,
                          color: Colors.black,
                        ),
                      ),
                    ]
                  ),
                ]
              ),
            ),
          ],
        ),
      ),

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM