颤振堆栈和容器

时间:2020-06-26 17:35:45

标签: flutter dart flutter-layout ui-design

我目前正在试验容器,堆栈以及其中的物品对齐方式。我似乎无法获得确切的输出。我正在尝试的输出是这个enter image description here,而我从代码中获得的输出是这个enter image description here

我可以在代码片段方面获得帮助,以使其与我的目标相同吗?预先谢谢你。

我写的代码是

Padding(
        padding: const EdgeInsets.all(0),
        child: Container(
          height: 280,
          color: Colors.white,
          child: Stack(
            children: <Widget>[
              Positioned(
                child: SvgPicture.asset(
                  'assets/images/bg2.svg',
                ),
              ),
              Positioned(
                top: 40,
                left: 90,
                child: SvgPicture.asset(
                  'assets/images/group.svg',
                ),
              ),
              Positioned(
                  top: 180,
                  right: -20,
                  child: SvgPicture.asset('assets/images/bg1.svg')),
              Positioned(
                top: 180,
                left: 120,
                child: Text(
                  'Introducing the Neighbour\navailable in the selected area',
                  style: TextStyle(fontSize: 14),
                ),
              ),
              Positioned(
                top: 230,
                left: 150,
                child: Container(
                  child: RaisedButton(
                    onPressed: () {},
                    textColor: Colors.white,
                    elevation: 15,
                    padding: const EdgeInsets.all(0.0),
                    child: Container(
                      width: 130,
                      decoration: new BoxDecoration(
                          gradient: new LinearGradient(
                        colors: [Colors.blue[500], Colors.blue[900]],
                      )),
                      padding: const EdgeInsets.all(10.0),
                      child: Text(
                        "Create a Group",
                        textAlign: TextAlign.center,
                      ),
                    ),
                  ),
                ),
              ),
            ],
          ),
        ),
      )

0 个答案:

没有答案