Flutter 将值与圆形压缩机指示器颤振的中心对齐

我有一个

循环式进程指示器

，显示完成了多少问题。我把它和显示它的文本放在一个堆栈中。我还想在上面显示一些文本，说明它们是什么，“已尝试的问题”，但只要我将堆栈和文本小部件放在一列中，完成的问题数量就不会与进度指示器的中心对齐。谁能告诉我为什么会这样

显示进度指示器的代码的简化版本：

class _ProgressIndicator extends StatelessWidget {
  ...

  @override
  Widget build(BuildContext context) {
    ...
    return Stack(
      children: [
        Center(
            child: Text(
          '$attemptedQuestions/ $totalQuestions',
          textAlign: TextAlign.center,
        )),
        Center(
            child: SizedBox(
          height: progressBarSize,
          width: progressBarSize,
          child: CircularProgressIndicator(
            value: attemptedQuestions / totalQuestions,
            ....

class _AttemptedQuestions extends StatelessWidget {
  ....

  @override
  Widget build(BuildContext context) {
    ....
    return Container(
      height: topViewHeight,
      width: topViewWidth,
      child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            Padding(
                padding: EdgeInsets.all(20),
                child: Text('Attempted Questions:', style: textStyle)),
            _ProgressIndicator(...),
          ]),
          ....

以及显示文本和进度指示器的代码：

class _ProgressIndicator extends StatelessWidget {
  ...

  @override
  Widget build(BuildContext context) {
    ...
    return Stack(
      children: [
        Center(
            child: Text(
          '$attemptedQuestions/ $totalQuestions',
          textAlign: TextAlign.center,
        )),
        Center(
            child: SizedBox(
          height: progressBarSize,
          width: progressBarSize,
          child: CircularProgressIndicator(
            value: attemptedQuestions / totalQuestions,
            ....

class _AttemptedQuestions extends StatelessWidget {
  ....

  @override
  Widget build(BuildContext context) {
    ....
    return Container(
      height: topViewHeight,
      width: topViewWidth,
      child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            Padding(
                padding: EdgeInsets.all(20),
                child: Text('Attempted Questions:', style: textStyle)),
            _ProgressIndicator(...),
          ]),
          ....

结果是：

我想要的是将数字放在中心，如：

---

您可以复制、粘贴并运行下面的完整代码，以查看所需的输出：-

你可以这样试试

导入“包装：颤振/材料.省道”；
void main（）=>runApp（MyApp（））；
类MyApp扩展了无状态小部件{
@凌驾
小部件构建（构建上下文）{
返回材料PP(
家：脚手架(
正文：中(
子：容器(
子：列(
mainAxisAlignment:mainAxisAlignment.center，
儿童：[
正文(
“未遂问题：”，
样式：TextStyle（字体大小：30），
),
大小盒子(
身高：40，
),
堆叠(
对齐：对齐.center，
儿童：[
大小盒子(
宽度：207，
身高：207，
子对象：循环压缩机指示器(
冲程宽度：20，
),
),
正文(
"3/3",
样式：TextStyle（字体大小：40），
),
],
),
],
),
),
),
),
);
}
}

工作演示

---

谢谢！我刚回来回答这个问题。问题确实是对齐：堆栈中的alignmentdirective.center。是的，实际上就是这么简单的一个堆栈-alignment.center。