Как поместить CircularProgressIndicator в другой CircularProgressIndicator во флаттере? - PullRequest
0 голосов
/ 01 апреля 2020

Я пытался сделать это, но это закончилось один на другой. CircularProgressIndicator был наложен друг на друга вместо того, чтобы быть внутри, как я пытался в следующем коде:

body: Center(
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.center,
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            SizedBox(
              height: 200,
              width: 200,
              child: Column(
                children: <Widget>[
                  CircularProgressIndicator(
                backgroundColor: Colors.pinkAccent,
                strokeWidth: 30.0,
                value: 0.7,
                valueColor: AlwaysStoppedAnimation<Color>(Colors.black),
              ),
                  SizedBox(
                    height: 150,
                    width: 150,
                    child: CircularProgressIndicator(
                      backgroundColor: Colors.red,
                      strokeWidth: 10.0,
                      value: 0.7,
                      valueColor: AlwaysStoppedAnimation<Color>(Colors.black),
                    ),
                  ),
              ],
            ),
            ),
          ],
        ),
      ),

1 Ответ

1 голос
/ 01 апреля 2020

Вы должны сложить эти виджеты друг над другом с виджетом стека

Stack(
    children: <Widget>[
      SizedBox(
        height: 200,
        width: 200,
        child: CircularProgressIndicator(
          backgroundColor: Colors.pinkAccent,
          strokeWidth: 30.0,
          value: 0.7,
          valueColor: AlwaysStoppedAnimation<Color>(Colors.black),
        ),
      ),
      Positioned(
        left: 25,
        top: 25,
        child: SizedBox(
          height: 150,
          width: 150,
          child: CircularProgressIndicator(
            backgroundColor: Colors.red,
            strokeWidth: 10.0,
            value: 0.7,
            valueColor: AlwaysStoppedAnimation<Color>(Colors.black),
          ),
        ),
      )
    ],
  ),

ВЫХОД

enter image description here

...