Flutter如何使Wrap小部件中的Text小部件从上一个小部件的末尾开始而不是在前一个小部件的下面开始?

时间:2020-03-20 11:09:54

标签: flutter text

我正在尝试制作一个完整的句子用户界面,该界面可能会溢出到下例所示的下一行:

enter image description here

这是我的代码:

 Wrap(
   spacing: 0.8,
   runSpacing: 4.0,
   children: <Widget>[
     new Text('Alpha '),
     new Container(
       width: 50,
       height: 19,
       child: new TextField(
          style: new TextStyle(
              fontSize: 16.0,
              color: Colors.blue,
          ),
       ),
     ),
     new Text(' charlie all the node in jank list is out of time all the node in jank list is out of time',)
   ],
 )

这是当前结果:
enter image description here

如何使第二个字符串从TextField的末尾开始并溢出到下一行?

感谢您的帮助!

1 个答案:

答案 0 :(得分:1)

这是一个非常有趣且充满挑战的问题,我找到了一种解决方案,方法是使用富文本格式和跨文本范围来实现。希望对您有帮助!

enter image description here

          Text.rich(
            TextSpan(
              text: 'Alpha ',
              style: TextStyle(color: Colors.black),
              children: <InlineSpan>[
                WidgetSpan(
                  alignment: PlaceholderAlignment.baseline,
                  baseline: TextBaseline.alphabetic,
                  child: Container(
                    width: 50,
                    height: 19,
                    child: TextField(
                      style: TextStyle(
                        fontSize: 16.0,
                        color: Colors.blue,
                      ),
                    ),
                  ),
                ),
                TextSpan(
                  text:
                      ' charlie all the node in jank list is out of time all the node in jank list is out of time',
                ),
              ],
            ),
          ),