i need to connect children in an efficient way

Viewed 51

My current approach is pretty straight forward you can refer the code and image too.

I am thinking to use GlobalKey to get the connecting width between the children and using Positioned widget can position it accordingly.

Could you suggest a better approach to connect the children widgets.

       Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            getCircle(bottomFlag: true),
            Column( // stack
              children: [
                Container( // inside positioned
                  height: 5,
                  width: 280, // distance between 1 and 3 through GlobalKey
                  color: Colors.orange,
                ),
                Row(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    Column(
                      children: [
                        getCircle(topFlag: true), //1
                        Row(
                          children: [getCircle(), getCircle()],
                        ),
                      ],
                    ),
                    getCircle(topFlag: true), //2
                    getCircle(topFlag: true), //3
                  ],
                ),
              ],
            )
          ],
        )

I am attaching the image of widgets UI [1]: https://i.stack.imgur.com/E9Cyb.png

0 Answers
Related