flutter 我怎么能离开文本按钮下面的文本

drnojrws  于 2023-05-23  发布在  Flutter
关注(0)|答案(2)|浏览(130)

我在做一个关于Flutter的项目我有一个艰难的时间使这个按钮,我会留下的照片和代码。enter image description here

Positioned(
        bottom: -50,
        child: Container(
          width: 281,
          height: 111,
          decoration: BoxDecoration(
            color: orangeDetails.withOpacity(0.8),
            borderRadius: BorderRadius.circular(9),
            boxShadow: [
              BoxShadow(
                color: Colors.black.withOpacity(0.1),
                spreadRadius: 3,
                blurRadius: 4,
                offset: Offset(0, 2) // muda a posição da sombra
              ),
            ],
          ),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.start,
            children: [
              Image.asset(
                  "assets/images/metro.png",
                  width: 100,
              ),
              Align(
                alignment: Alignment.center,
                child: Text(
                  "Acompanhe a rotas das linhas \n e estações do metrô \n de Recife",
                  style: TextStyle(
                    color: Colors.white,
                    fontSize: 12,
                    fontWeight: FontWeight.w700,
                  ),
                ),
              ),
              // TextButton(
              //   onPressed: (){},
              //   child: Text("VER LINHAS"),
              //   style: ButtonStyle(
              //       foregroundColor: MaterialStateProperty.all(Colors.black),
              //       backgroundColor:MaterialStateProperty.all(blueDetails),
              //       fixedSize: MaterialStateProperty.all(const Size(95, 5)),
              //       shape: MaterialStateProperty.all<RoundedRectangleBorder>(
              //           RoundedRectangleBorder(
              //             borderRadius: BorderRadius.circular(3),
              //           )
              //       )
              //   ),
              // ),
            ],
          ),
        ),
      ),´

我如何增加照片的这个textButton?有人能帮帮我吗??

to94eoyn

to94eoyn1#

别担心,我们和你一样,当我们开始学习Flutter:)看看我的图片,你会明白如何分析布局:

Row(children: [
  Image... // your image here
  Expanded( // expand rest of right space
    child: Column(
      mainAxisSize: MainAxisSize.min, //minimize the size of column, if don't have this code, layout will be broken
      children: [
        Text // your text here,
        TextButton // your text button here
      ]
    )
  )
])

祝你好运!x1c 0d1x

7d7tgy0s

7d7tgy0s2#

为了将textButton保留在Text下面,可以使用Row代替Column。祝你今天愉快

相关问题