将图像添加到 Flutter答案

【问题标题】：Adding image to Flutter将图像添加到 Flutter
【发布时间】：2021-06-08 20:37:22
【问题描述】：

这是我第一次使用 Flutter，当我尝试添加图像时，它并没有很好地工作。首先，我尝试通过 Image.assets('assets/lpp_bezpozadine.png') 将 Image 添加到 child:Container - 没有用然后我尝试制作一个单独的方法：

class LppImage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    AssetImage assetImage = AssetImage('assets/lpp_bezpozadine.png');
    Image image = Image(image: assetImage);
    return Container(
      child: image,
    );
  }
}

我试图从中调用孩子：-但它说我不能使用孩子？？

我已将图片添加到 pubspec.yaml 中，如下所示：

assets:
    - assets/lpp_bezpozadine.png

所以，如果有人可以帮助我解决这个问题，因为我刚刚开始颤抖。提前感谢这是我的代码：

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    const darkBlueColor = const Color(0xff131f40);
    const lightBlueColor = const Color(0xff445c9e);
    return Scaffold(
      body: Center(
        child: Container(
          decoration: BoxDecoration(
            gradient: LinearGradient(
              colors: [
                darkBlueColor,
                lightBlueColor,
              ],
              stops: [0.5, 1],
              begin: const FractionalOffset(0.5, 0.2),
              end: const FractionalOffset(1, 1),
            ),
          ),
        ),
      ),
    );
  }
}

当我尝试添加子项时出现错误日志，它显示将其转换为子项：

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    const darkBlueColor = const Color(0xff131f40);
    const lightBlueColor = const Color(0xff445c9e);
    return Scaffold(
      body: Center(
       children: <Widget>[
          LppImage(),
        ],
        child: Container(
          decoration: BoxDecoration(
            gradient: LinearGradient(
              colors: [
                darkBlueColor,
                lightBlueColor,
              ],
              stops: [0.5, 1],
              begin: const FractionalOffset(0.5, 0.2),
              end: const FractionalOffset(1, 1),
            ),
          ),
        ),
      ),
    );
  }
}

【问题讨论】：

能找到图片吗？如果您可以发布特定的错误日志会很好
@Stijn2210 好的，我会添加它
我认为你没有添加错误日志。
是的，你没有添加错误日志，但我确实发现了一个错误，所以我根据它编辑了我的答案。

标签： android ios image flutter

【解决方案1】：

我不知道flutter是否能够找到图像，因为没有错误日志，但这是使用资产图像的正确方法：

class LppImage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      child: Image.asset('assets/lpp_bezpozadine.png'),
    );
  }
}

接下来，我看到您正在尝试将Center 与children 一起使用。 Center 只接受 child。所以这就是你将如何使用它：

Center(
  child: LppImage(),
),

如果您想使用多个孩子，您应该考虑使用Column，以便您可以这样做：

Column(
   children: [
      Center(
         child: LppImage(),
      ),
      Container(),
   ],
),

【讨论】：

好的，我用专栏做了，但现在我的背景不见了，我该怎么办？
将 LppImage 设置为容器的子容器，容器带有装饰和渐变
它部分工作，现在它有背景，但与以前相比，背景在整个屏幕上作为单独的单元与图像相比，它被裁剪了
嗯，这是一个不同的问题。图像问题现在解决了吗？
嗯，是的，但不是 rly，这就像说我修好了你的汽车引擎，但你的空调现在不工作了。所以现在我有图像但没有背景，背景但没有图像或仅附有背景的图像

【解决方案2】：

您是否尝试过重新启动完整的应用程序？有时热重载时看不到资产。

【讨论】：

所以来自文档：Center({Key?key, double?widthFactor, double?heightFactor, Widget?child}) ;中心小部件没有子级。我认为你需要使用一个列并添加到孩子：LppImage（），容器（装饰：BoxDecoration（.....））等