Flutter, setting positioned widgets dynamically

Issue

I have a UI like

Now I want to create the letters on circle by given data. I need it to be a dynamic, when letters are less, (like 3 or 4) they must be far from each other. But, when they many (10 or 12) they must fit to circle (must have dynamic size and dynamic position).
The code of circle and letters –

Container(
            width: SizeConfig.devWidth! * 0.6,
            height: SizeConfig.devHeight! * 0.35,
            decoration: BoxDecoration(
              border: Border.all(color: Colors.blue),
              color: MyColors.nextButtonColor,
              shape: BoxShape.circle,
            ),
            child: Stack(
              alignment: Alignment.center,
              children: [
                Positioned(
                    top: SizeConfig.devHeight! * 0.04,
                    child: isDragging == true && isItemsDragging[0] != true
                        ? dragTargetWidget('Č', 0)
                        : draggableWord('Č', 0)),
                Positioned(
                    top: SizeConfig.devHeight! * 0.07,
                    right: SizeConfig.devWidth! * 0.1,
                    child: isDragging == true && isItemsDragging[1] != true
                        ? dragTargetWidget('É', 1)
                        : draggableWord('É', 1)),
                Positioned(
                    right: SizeConfig.devWidth! * 0.03,
                    child: isDragging == true && isItemsDragging[2] != true
                        ? dragTargetWidget('Ž', 2)
                        : draggableWord('Ž', 2)),
                Positioned(
                    bottom: SizeConfig.devHeight! * 0.07,
                    right: SizeConfig.devWidth! * 0.1,
                    child: isDragging == true && isItemsDragging[3] != true
                        ? dragTargetWidget('U', 3)
                        : draggableWord('U', 3)),
                Positioned(
                    bottom: SizeConfig.devHeight! * 0.04,
                    child: isDragging == true && isItemsDragging[4] != true
                        ? dragTargetWidget('T', 4)
                        : draggableWord('T', 4)),
                Positioned(
                    bottom: SizeConfig.devHeight! * 0.07,
                    left: SizeConfig.devWidth! * 0.1,
                    child: isDragging == true && isItemsDragging[5] != true
                        ? dragTargetWidget('Ě', 5)
                        : draggableWord('Ě', 5)),
                Positioned(
                    left: SizeConfig.devWidth! * 0.03,
                    child: isDragging == true && isItemsDragging[6] != true
                        ? dragTargetWidget('А', 6)
                        : draggableWord('А', 6)),
                Positioned(
                    top: SizeConfig.devHeight! * 0.07,
                    left: SizeConfig.devWidth! * 0.1,
                    child: isDragging == true && isItemsDragging[7] != true
                        ? dragTargetWidget('K', 7)
                        : draggableWord('K', 7)),
              ],
            ))
      ],
    ),
  ),

and my data is –

Crossword(type: "crossword", format: [
  "      š",
  "    žák",
  "      o",
  " učitel",
  "      a"
], chars: [
  "i",
  "e",
  "l",
  "a",
  "t",
  "o",
  "č",
  "k",
  "š",
  "á",
  "u",
  "ž"
], strings: {
  "škola": ["      *", "      *", "      *", "      *", "      *"],
  "žák": ["       ", "    ***", "       ", "       ", "       "],
  "učitel": ["       ", "       ", "       ", " ******", "       "]
}),

Any idea how can I achieve this? Any solution would be very useful, thanks!

Solution

Thanks to @pskink! The solution is to use RotaryDialDelegate as a delegate for CustomMultiChildLayout. Check the code below:

Container(
            width: SizeConfig.devWidth! * 0.6,
            height: SizeConfig.devHeight! * 0.35,
            decoration: BoxDecoration(
              border: Border.all(color: Colors.blue),
              color: MyColors.nextButtonColor,
              shape: BoxShape.circle,
            ),
            child: CustomMultiChildLayout(
              delegate: RotaryDialDelegate(
                  wowProv.crosswordExercises[widget.indexLevel!].chars!.length),
              children: dragLetters
            ))

Answered By – Muhammet

Answer Checked By – Mildred Charles (FlutterFixes Admin)