错误：无法将元素类型“TextSpan”分配给列表类型“Widget”-Flutter答案

【问题标题】：Error: The element type 'TextSpan' can't be assigned to the list type 'Widget' - Flutter错误：无法将元素类型“TextSpan”分配给列表类型“Widget”-Flutter
【发布时间】：2021-11-25 21:38:55
【问题描述】：

我想使用 GridView 优化我的代码，因为我有 16 个 TextSpan 来对齐 4x4。问题是 GridView 不接受 TextSpan。出现此错误：The element type 'TextSpan' can't be assigned to the list type 'Widget'。我已经尝试删除<Widget>，但没有成功。

代码如下：

child: GridView.count(
            primary: false,
            padding: const EdgeInsets.all(20),
            crossAxisSpacing: 10,
            mainAxisSpacing: 10,
            crossAxisCount: 4, // 4 tiles horizontally
            children: <Widget>[
              TextSpan(
                  text: widget.result + '  ',
                  style: TextStyle(
                    fontSize: 20.0,
                    fontWeight: FontWeight.bold,
                    color: checkdominantA(widget.predominant, widget.result),
                    height: 2.5,
                    letterSpacing: 0.7,
                  ),
                ),
                
                TextSpan(
                  text: widget.result2 + '  ',
                  style: TextStyle(
                    fontSize: 20.0,
                    fontWeight: FontWeight.bold,
                    color: checkdominantA(widget.predominant, widget.result2),
                    height: 2.5,
                    letterSpacing: 0.7,
                  ),
                ),
),
                //...

【问题讨论】：

标签： android flutter dart mobile

【解决方案1】：

Textspan 不是小部件使用 RichText 小部件：

        RichText(
          text: TextSpan(
            text: widget.result + '  ',
            style: TextStyle(
              fontSize: 20.0,
              fontWeight: FontWeight.bold,
              color: checkdominantA(widget.predominant, widget.result),
              height: 2.5,
              letterSpacing: 0.7,
            ),
          ),
        )

这会很好用；你的完整代码：

child: GridView.count(
          primary: false,
          padding: const EdgeInsets.all(20),
          crossAxisSpacing: 10,
          mainAxisSpacing: 10,
          crossAxisCount: 4,
          // 4 tiles horizontally
          children: <Widget>[
            RichText(
              text: TextSpan(
                text: widget.result + '  ',
                style: TextStyle(
                  fontSize: 20.0,
                  fontWeight: FontWeight.bold,
                  color: checkdominantA(widget.predominant, widget.result),
                  height: 2.5,
                  letterSpacing: 0.7,
                ),
              ),
            ),
            RichText(
              text: TextSpan(
                text: widget.result2 + '  ',
                style: TextStyle(
                  fontSize: 20.0,
                  fontWeight: FontWeight.bold,
                  color: checkdominantA(widget.predominant, widget.result2),
                  height: 2.5,
                  letterSpacing: 0.7,
                ),
              ),
            ),
          ],
        ),

【讨论】：