flutter 如果TextSpan的文本溢出并放置在WidgetSpan之后，则不会显示该文本

j91ykkif 于 2023-02-25 发布在 Flutter

关注(0)|答案(2)|浏览(339)

这是一个非常具体的场景，我不确定确切的原因。代码如下。总结如下：我创建了一个容器部件，设置了一个特定的宽度值，然后将RichText部件设置为它的子部件。用两个InlineSpan填充RichText。一个是WidgetSpan，一个是TextSpan。TextSpan在WidgetSpan之后。如果InlineSpan的内容宽度超过容器的宽度，并且maxLines设置为1;仅显示WidgetSpan，完全不显示TextSpan。
我只是想显示尽可能多的文本，我们可以在容器内，然后结束与任何溢出选项，我选择了丰富的文本。我尝试了不同的选项溢出，他们都没有改变结果。我的首选选项是TextOverflow.ellipsis，但其他除了TextOverflow.clip也很好。
我必须使用WidgetSpan来垂直居中图标字符。如果有任何其他方法来完成，我将完全罚款。
下面的图片是一个满容量的容器，宽度值为250。字体大小在下面的代码部分中给出。WidgetSpan字符是随机选择的，更改字符不能解决问题。

这是一个宽度值为240的容器。正如你所看到的，它溢出了，TextSpan的文本完全消失了。WidgetSpan是故意右对齐的，改变对齐方式不会改变结果。

这是Container小部件的最小代码。

Container(
    width: 250,
    child: RichText(
        maxLines: 1,
        text: TextSpan(
            children: [
                WidgetSpan(
                    alignment: PlaceholderAlignment.middle,
                    child: Text(String.fromCharCode(1005),
                        style: TextStyle(
                        color: Colors.black,
                        fontSize: 25))
                        ),
                TextSpan(
                    text: 'wwwwwwwwwwwwwwwwwwww',
                    style: TextStyle(
                        color: Colors.black,
                        fontSize: 15),
                )
            ]
        ),
    ),
),

flutter

来源：https://stackoverflow.com/questions/66531119/textspans-text-doesnt-show-if-it-overflows-and-is-placed-after-widgetspan

2条答案

按热度按时间

3j86kqsm1#

这就是你想要的吗？
我使用了Row小部件，而不是RichText。

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        visualDensity: VisualDensity.adaptivePlatformDensity,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: _buildBody(),
      floatingActionButton: FloatingActionButton(
        onPressed: () {},
        tooltip: 'Increment',
        child: Icon(Icons.add),
      ),
    );
  }

  Widget _buildBody() {
    return Container(
      width: 250,
      child: Row(
        children: [
          Text(
            String.fromCharCode(1005),
            style: TextStyle(color: Colors.black, fontSize: 25),
          ),
          Expanded(
            child: Text(
              'wwwwwwwwwwwwwwwwwwwwwwwwww',
              overflow: TextOverflow.ellipsis,
              style: TextStyle(color: Colors.black, fontSize: 15),
            ),
          ),
        ],
      ),
    );
  }
}

赞(0）回复(0）举报 2023-02-25

ajsxfq5m2#

将softWrap属性设置为false可能会起作用。可以按如下方式执行此操作：

Text.rich(
      overflow: TextOverflow.clip,
      softWrap: false,
      maxLines: 1,
      text: ...,
      ),
    )

赞(0）回复(0）举报 2023-02-25

我来回答

flutter 如果TextSpan的文本溢出并放置在WidgetSpan之后，则不会显示该文本

2条答案

相关问题

热门标签

最新问答