Flutter：定位多个小部件或图像

Question

我对颤振相对较新，我正在学习。 我想完全按照下图实现。 图像中的所有组件，例如汽车、轮廓城市和背景形状都在单独的 png 文件中。 我必须将它们全部结合起来才能得到结果。

Answer 1

在颤振中实现这一点的最方便的方法之一是使用 Stack 小部件。 将您的 png-s 作为资产导入您的 pubspec 文件（有关此内容的更多信息，请参见https://docs.flutter.dev/development/ui/assets-and-images ），然后用您的图像填充您的堆栈并将它们定位为类似于这个例子。

Stack(
  children: <Widget>[
    Positioned(
        top: y,
        left: x,
        child: Container(
          height: h,
          width: w,
          decoration: BoxDecoration(
            image: DecorationImage(
              image: AssetImage('assets/images/<imagename>.png'),
              fit: BoxFit.<x>,
            ),
          ),
        )),
      Positioned(
        top: y2,
        left: x2 ,
        child: Container(
          height: h,
          width: w,
          decoration: BoxDecoration(
            image: DecorationImage(
              image: AssetImage('assets/images/<imagename>.png'),
              fit: BoxFit.<x>,
            ),
          ),
        )),
  ],
)

有关 Stack 的更多详细信息（ https://api.flutter.dev/flutter/widgets/Stack-class.html ）