在图像抖动，飞​​镖

Question

我有一张这样的图片

，我需要在此图像上添加小部件。看起来内容只是在移动屏幕上。我试图寻找一种方法，但我没有得到任何。我尝试使用这样的堆栈：

Container(
    child: Stack(
      children: <Widget>[
        Positioned(
          child: Container(
            padding: EdgeInsets.fromLTRB(60, 110, 60, 90),
            //body
          ),
        ),
        Container(width: 1000,
          decoration: BoxDecoration(
              image: DecorationImage(
                  image: AssetImage('Assets/Images/transparentMobile.png'),
                  fit: BoxFit.fill)),
        ),
      ],
    ),
  ),

它在我的手机上正常运行：

，但在其他手机上，看起来却大不相同。如何为多个屏幕编写单个代码？

Answer 1

最后，我有办法做到。我没有认真研究代码，而是将图像分为三部分：

顶部：

正文：

底部：

并将它们添加到这样的列中：

AspectRatio(
      aspectRatio: 1/2,
      child: Container(
        padding: EdgeInsets.all(20),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
        Expanded(
          child: Container(
            decoration: BoxDecoration(
                image: DecorationImage(
                    image: AssetImage('Assets/Images/Mobile/mobileTop.png'),
                    fit: BoxFit.fill
                )
            ),
          ),
        ),
            Expanded(
              flex: 7,
              child: Container(
                padding: EdgeInsets.symmetric(horizontal: 20),
                decoration: BoxDecoration(
                  image: DecorationImage(
                    image: AssetImage('Assets/Images/Mobile/mobileBody.png',),
                    fit: BoxFit.fill
                  )
                ),
                height: 100,
                child: Scaffold(
                    appBar: AppBar(
                      backgroundColor: Colors.blue,
                      automaticallyImplyLeading: false,
                      title: Text('My Application'),
                    ),
                    body: Center(
                      child: Text(
                        'Hello World!',
                        style: TextStyle(color: Colors.black),
                      ),
                    ),
                    backgroundColor: Colors.white,
                  ),
              ),
            ),
            Expanded(
              child: Container(
                decoration: BoxDecoration(
                    image: DecorationImage(
                        image: AssetImage('Assets/Images/Mobile/mobileBottom.png'),
                        fit: BoxFit.fill
                    )
                ),
              ),
            ),

          ],
        ),
      ),
    ),

，图像现在在大多数设备上看起来非常相似：

感谢您的帮助！