抖动的图像不适合

时间:2019-10-12 16:15:51

标签: flutter dart flutter-layout

Container(
  width:
  MediaQuery.of(context).size.width / 4.4,
  height:
  MediaQuery.of(context).size.height / 10,
  decoration: BoxDecoration(
    border: Border.all(
        color: Colors.black12,
        width: 1.5,
        style: BorderStyle.solid),
    borderRadius:
    BorderRadius.all(Radius.circular(20)),
  ),
  child: (TmpBytesImage == null)
      ? Icon(Icons.camera_alt,
      color: Colors.black26)
      : Image.memory(TmpBytesImage,
      fit: BoxFit.fill),
),

我原本希望用图片填充Container

但图像看起来像忽略BoxDecoration

enter image description here

如何使图像看起来像Container

2 个答案:

答案 0 :(得分:0)

enter image description here


只需使用Card,给它shape,然后将Container放入其中。简单的例子:

Card(
  elevation: 12,
  shape: RoundedRectangleBorder(
    borderRadius: BorderRadius.all(Radius.circular(20)),
  ),
  child: ClipRRect(
    borderRadius: BorderRadius.all(Radius.circular(20)),
    child: Container(
    padding: EdgeInsets.all(20),
      width: MediaQuery.of(context).size.width / 2,
      height: MediaQuery.of(context).size.height / 4,
      child: Image.asset(
        chocolateImage,
        fit: BoxFit.fill,
      ),
    ),
  ),
),

答案 1 :(得分:0)

尝试在容器装饰内添加图片

喜欢这个

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<body>
  <table>
    <thead>
      <tr>
        <td>Name</td>
        <td>Price</td>
        <td></td>
      </tr>
    </thead>
    <tbody>
      
    </tbody>
  </table>
</body>
</html>