如何在Flutter中实现横竖双向填字游戏?
实现横竖双向填字游戏的Flutter方案
我需要实现一个横竖双向填字游戏,但目前的代码仅支持横向布局。试过多个Flutter库都没找到合适的,了解到React生态中有react-crossword库可以实现类似效果,想请教如何在Flutter中实现相同的功能。
我的当前代码:
class AcrossAndDownWidget extends StatefulWidget { const AcrossAndDownWidget({ super.key, required this.row, required this.col, required this.word, }); final List<int> row; final List<int> col; final List<String> word; @override State<AcrossAndDownWidget> createState() => _AcrossAndDownWidgetState(); } class _AcrossAndDownWidgetState extends State<AcrossAndDownWidget> { @override Widget build(BuildContext context) { final Size size = MediaQuery.sizeOf(context); const int gridSize = 14; List<int> number = []; for (int i = 0; i < widget.row.length; i++) { int intersectionIndex = widget.row[i] * gridSize + widget.col[i]; for (int j = 0; j < widget.word[i].length; j++) { int currentIndex = intersectionIndex + j; number.add(currentIndex); } } return SizedBox( height: 500, child: SizedBox( height: size.height * 0.90, width: size.width * 0.90, child: GridView.count( shrinkWrap: true, crossAxisCount: 14, children: List.generate(gridSize * gridSize, (index) { bool isIntersection = number.contains(index); return isIntersection ? Container( height: 40.0, width: 40.0, decoration: BoxDecoration( color: isIntersection ? Colors.grey : Colors.transparent, border: Border.all( color: Colors.black, ), ), child: const Center(child: NoBorderTextField()), ) : const SizedBox(); }), ), ), ); } }
内容的提问来源于stack exchange,提问作者tdn
相关产品推荐
相关产品推荐

