如何使文本在堆栈内部居中

Question

我想使我的文本居中在Stack小部件内。到目前为止，这是我尝试过的。现在，它位于图像顶部的左侧，而不是我想要的位置。我尝试使用Align小部件和Center小部件，但无济于事。我在做什么错？

Flexible(
  child: Padding(
    padding: const EdgeInsets.only(left: 8,top: 8,bottom: 8,right: 8),
    child: Stack(
      children: <Widget>[
        Wrap(
          children: <Widget>[ 
            Image.network("https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcR1OlcL_Laxy1rcct4vok3rkEb3l6NdV1pncE1_K1mzZ9NDYy3J",
               height: 100,
            ),
          ],
        ),
        Container(
          width: MediaQuery.of(context).size.width/2,
          height: 100,
          child: Center(
            child: Wrap(
              children: <Widget>[
                Center(
                  child: Container(
                    height: 100,
                    width: MediaQuery.of(context).size.width/2,
                    child: Align(
                      alignment: Alignment.center,
                      child: Text(
                        "BOOKS AND BOOKLETS",
                        style: TextStyle(
                          color: Colors.white, 
                          fontSize: 18,
                          fontWeight: FontWeight.bold,
                        ),
                      ),
                    ),
                  ),
                ),
              ],
            ),
          ),
        ),
      ],
    ),
  ),
),

任何使该文本在中间的选项>>

 Expanded(child: Card(
              child: Container(
                child: Center(
                  child:  Stack(
                    children: <Widget>[
                      Image.network("https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcR1OlcL_Laxy1rcct4vok3rkEb3l6NdV1pncE1_K1mzZ9NDYy3J",
                        height: 100,
                      ),
                      SafeArea(child: Text("asdad"))
                    ],
                  ),
                ),
              ),
            ))
识别出的问题是，如果文本大小较小（表示“ abc”），则可以正常工作；但是，如果文本大小较大（表示“ abc abc abc acb，acb abc”），则无法正常工作。如何解决此问题？

我想使我的文本居中在Stack小部件内。到目前为止，这是我尝试过的。现在，它位于图像顶部的左侧，而不是我想要的位置。我试过使用...

Answer 1

您可以尝试：

Answer 2

已解决

Answer 3

我想通过另一种方法来实现，如果您使用Container小部件并使用背景图片进行装饰怎么办？然后，您可以避免完全使用Stack小部件。

Answer 4

在textAlign: TextAlign.center中使用Text Widget