图像上的响应文本不位于图像中心

时间:2019-09-23 11:36:55

标签: flutter flutter-layout

我正在训练在图像上显示动态文本,但不在图像的中心显示动态文本(中心上方几像素)。

问题是,当我使用带有对齐方式的容器或具有高度因数的中心时,我只能将文本定位在特定位置的特定位置上。 但我希望它能够响应并适合所有手机。

我尝试过:

Widget _myImage(BuildContext context) {
    return Container(
      alignment: Alignment(0,0.4),
      decoration: BoxDecoration(
          color: Colors.transparent,
          image: DecorationImage(
              image:AssetImage("bla"),
              fit: BoxFit.contain)),
      child: AutoSizeText(
        "bla",
        maxLines: 1,
        style: TextStyle(
            fontSize: MediaQuery.of(context).size.width / 3,
            color: Colors.white,
            shadows: <Shadow>[
              Shadow(
                offset: Offset(6.0, 6.0),
                blurRadius: 3.0,
                color: Color.fromARGB(255, 0, 0, 0),
              )
            ]),
      ),
    );
  }

我也尝试过:

  Widget _myImage(BuildContext context) {
    return Stack(
      children: <Widget>[
        Container(
            decoration: BoxDecoration(
                color: Colors.transparent,
                image: DecorationImage(
                    image: AssetImage("bla"),
                    fit: BoxFit.contain))),
        Center(
            child: FractionallySizedBox(
          widthFactor: 0,
          heightFactor: 0.4,

          alignment: Alignment.topCenter,
          child: AutoSizeText(
            "bla",
            maxLines: 1,
            style: TextStyle(
                fontSize: MediaQuery.of(context).size.width / 3,
                color: Colors.white,
                shadows: <Shadow>[
                  Shadow(
                    offset: Offset(6.0, 6.0),
                    blurRadius: 3.0,
                    color: Color.fromARGB(255, 0, 0, 0),
                  )
                ]),
          ),
        ))
      ],
    );
  }

这两种方法都只能在特定的手机上使用

0 个答案:

没有答案