1

我有一个像

图片

现在我想通过给定的数据在圆圈上创建字母。我需要它是动态的,当字母较少时(如 3 或 4),它们必须彼此远离。但是,当它们很多(10 或 12)时,它们必须适合圆圈(必须具有动态大小和动态位置)。圆圈和字母的代码 -

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)),
              ],
            ))
      ],
    ),
  ),

我的数据是 -

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

知道如何实现这一目标吗?任何解决方案都会非常有用,谢谢!

4

1 回答 1

1

感谢@pskink!解决方案是使用RotaryDialDelegate作为 CustomMultiChildLayout 的委托。检查下面的代码:

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
            ))
于 2021-09-19T07:37:20.990 回答