如何在行中的扩展长文本之后放置小部件？

Question

如何将动态长文本与另一个小部件（如按钮）连续展开，如下所示：

---

我尝试了一下Expanded，Flexible但Warp没有得出结论。

！注意我不希望这个在 aStack或Padding从底部使用！导致该文本会发生变化，其长度可能会变大或变短。

---

更新：我尝试使用 ExtendedText，但 TextOverFlowWidget 的子项没有显示给我。我的代码：

Container(
  color: Colors.amber,
  height: 70,
  child: ExtendedText(
    'bbbbb ${toPhoneStyle(widget.inputPhone)}  (${widget.selectedCountry.dialCode})  aaaaaa aaaaaaaaaaa',
     overflowWidget: TextOverflowWidget(
        // maxHeight: double.infinity,
        // align: TextOverflowAlign.right,
        // fixedOffset: Offset.zero,
        child: Container(
            width: 60,
            height: 60,
            color: Colors.red,
            ),
         ),
      ),
   ),

---

但是如果像这样缩小容器的高度height:20，则显示如下：

Answer 1

显然，您可以使用该RichText小部件将文本和小部件包装在一行中，即它旨在使用多种显示样式显示文本。文本使用类型<TextSpan>或 的子项呈现<WidgetSpan>。

以下代码将解释您在问题中尝试的确切内容。请注意，我只使用了有状态小部件，因为我也在处理其他东西，所以我只编辑了该小部件中的所有内容，如果您不打算在此处引入任何状态，则可以使用无状态小部件。

完整代码：

import 'package:flutter/material.dart';

void main()
{
  runApp(MaterialApp(
    home: Home(),
  ));
}

class Home extends StatefulWidget {
  @override
  _HomeState createState() => _HomeState();
}

class _HomeState extends State<Home> {
  final String str = 'Some really long text to show the working of a wrap widget'
      + ' and place a button at the end of the text and it will then prove that'
      + ' you can do the same with other kind of widgets.';
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
        child: Center(
          child: Container(
            width: (MediaQuery.of(context).size.width) / 1.3,
            decoration: BoxDecoration(
              color: Colors.orange[100],
            ),
            child: RichText(
              text: TextSpan(
                children: [
                  TextSpan(
                    text: str,
                    style: TextStyle(
                      fontSize: 24,
                      color: Colors.black,
                    ),
                  ),
                  // treat the child of WidgetSpan as the parameter to insert
                  // whatever widget you wish to put here
                  // SizedBox is only used to put a little space after the text string
                  WidgetSpan(
                    child: SizedBox(width: 5,),
                  ),
                  WidgetSpan(
                    child: Container(
                      child: RaisedButton(
                        color: Colors.blueAccent,
                        onPressed: (){},
                        child: Text('Button'),
                      ),
                    ),
                  ),
                ]
              ),
            ),
          ),
        ),
      ),
    );
  }
}

渲染后的结果：