Flutter-文本insideLinearProgressIndicator

Question

在Flutter中，我有LinearProgressIndicator。可以，但是我想在此栏内添加文本（进度）。

我尝试这样的事情

 SafeArea(
                    child: Row(children: <Widget>[
                  Center(
                      child: Text(DateFormat.ms()
                          .format(DateTime.fromMillisecondsSinceEpoch(
                              minuteSecond * 1000))
                          .toString())),
                  Expanded(
                      child: LinearProgressIndicator(
                          semanticsLabel: (animation.value * 100.0).toStringAsFixed(1).toString(),                
                          semanticsValue:  (animation.value * 100.0).toStringAsFixed(1).toString(),   
                          value: animation.value,
                          backgroundColor: Colors.white,
                          valueColor:
                              AlwaysStoppedAnimation<Color>(Colors.red))),
                ])),

但是很明显，这会将文本添加到栏的同一行中，而不是内部。

所以：有人知道如何在此条形图内添加中心（居中）？使用stack元素？

Answer 1

使用它，我增加了进度指示器的高度，因为文本不适合。

       Stack(
          children: <Widget>[
            SizedBox(
              height: 18,
              child: LinearProgressIndicator(
                valueColor: AlwaysStoppedAnimation<Color>(Theme.of(context).primaryColor),
                backgroundColor: Theme.of(context).primaryColorLight,
              ),
            ),
            Positioned(
              child: Center(
                child: Text('Some Text'),
              ),
            ),
          ],
        ),

Answer 2

您必须使用Stack，请尝试以下操作：

为简单起见，我将0.6值硬编码，可以在其中使用animation.value。

Stack(
  children: <Widget>[
    SizedBox(
      height: 20,
      child: LinearProgressIndicator(
        value: 0.6,
        backgroundColor: Colors.white,
        valueColor: AlwaysStoppedAnimation<Color>(Colors.red),
      ),
    ),
    Align(child: Text("Text"), alignment: Alignment.topCenter,),
  ],
)

屏幕截图：