Flutter TextStyle TextDecoration.lineThought 错误

Question

在 flutter 中我得到了这个小部件

 Container(
                      alignment: Alignment.centerLeft,
                      child: RichText(
                        maxLines: 1,
                        textAlign: TextAlign.center,
                        text: TextSpan(
                            children: [
                          TextSpan(
                              text: "$price€  ", style: const TextStyle(fontSize: 22)),
                          startingPrice != price
                              ? TextSpan(
                                  text: "$startingPrice€",
                                  style: TextStyle(
                                      fontSize:19,
                                      decoration: TextDecoration.lineThrough,))
                              : const TextSpan()
                        ]),
                      )),

我得到的结果就是这个

我尝试了不同的字体大小组合，线条看起来像是上下移动了一点，但从来没有在中心，这是理想的位置。

如果我在容器中添加高度属性并增加/减少它，则会发生相同的上下移动。

有什么想法吗？

Answer 1

使用 WidgetSpan 可以让您使用对齐方式。

 RichText(
          text: const TextSpan(
            children: <InlineSpan>[
              TextSpan(
                text: '200',
                style: TextStyle(
                  fontSize: 20,
                  fontWeight: FontWeight.w500,
                  color: Colors.blue,
                ),
              ),
              WidgetSpan(
                alignment: PlaceholderAlignment.middle,
                child: Text(
                  '30',
                  style: TextStyle(
                    fontSize: 40,
                    fontWeight: FontWeight.w500,
                    color: Colors.blue,
                  ),
                ),
              ),
            ],
          ),
        ),