小部件中的图像[颤动]

时间:2018-03-26 21:34:22

标签: dart flutter

我想制作一张卡片,一张卡片扑腾。在右侧是图像,在左侧是信息文本。我用CircleAvatar测试它,它几乎像我想要的那样工作,但我不想要一个圆圈,我想要一个方形图像。我删除了CircleAvatar部分并放入了一个新的容器和一个孩子,但我无法使用AssetImage,我唯一可以使用的是image.asset(' .jpg')。手机的图像差不多大,因为没有办法设置尺寸。使用CircleAvatar它是有效的,因为我将半径设置为大小。 当我尝试AssetImage()vscode对我说,我不能把它放在一个小部件中。 我希望你能帮助我(事情image.asset()不是正确的方法)。谢谢大家

    return new MaterialApp(      
  title: title,
  home: new Center(
    child: new Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: <Widget>[
        new Card(
          child: new Column(
            children: <Widget>[
              new Row(
                children: <Widget>[
                  new Container(
                    child:
                      new CircleAvatar(
                    backgroundImage: new AssetImage('images/lake.jpg'),
                    radius: 80.0,
                      child: new Container(
                        padding: const EdgeInsets.all(0.0),
                          child: new Text('Sight'),
                          ),
                      )
                  ),
                  ),
                  new Container(
                    child: new Text('long information text'),
                  )
                ],
              )
            ],
          ),
        )
      ],
    ),
  )  
);

} }

2 个答案:

答案 0 :(得分:8)

您应该可以为您的行执行此操作:

 Widget build(BuildContext context) {
    return new MaterialApp(
      title: 'Sample App',
      home: new Center(
        child: new Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            new Card(
              child: new Column(
                children: <Widget>[
                  new Row(
                    children: <Widget>[
                      new Container(
                        child: new Image.asset(
                          'images/lake.jpg',
                          height: 60.0,
                          fit: BoxFit.cover,
                        ),
                      ),
                      new Container(
                        child: new Text('long information text'),
                      ),
                    ],
                  ),
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }

答案 1 :(得分:0)

在您的评论中寻求答案!

您可以使用ClipRRect,

id

您也可以这样:

new ClipRRect(
    borderRadius: new BorderRadius.circular(8.0),
    child: new AssetImage('images/lake.jpg')
)