文本溢出时是否有可能放置 textButton ？答案

【问题标题】：Is there a possibility to put textButton when text is overflowing?文本溢出时是否有可能放置 textButton ？
【发布时间】：2022-11-04 20:44:13
【问题描述】：

我有 overflow: TextOverflow.ellipsis 的文本。

如下所示，文本溢出。我想改为或在溢出后制作 TextButton 但仅在文本溢出时制作。我尝试使用 Text.rich 和 TextSpan 执行此操作，但是当 Text 溢出时 TextButton 没有出现。

有可能做这样的事情吗？

【问题讨论】：

所以你想在文本溢出而不是三个点时显示一个可点击的文本按钮？
我认为他想要Read More 按钮，但当文本仍在 maxLines: 2 时隐藏，我猜是@Davis
我认为this 会有所帮助，如果这就是他的意思@Royalindo
@Davis 是的，我想就是这样。只需添加更多代码来检测文本是否溢出并使用条件语句
是的，这正是我想要实现的。但是如何检测文本是否溢出？

标签： flutter flutter-text

【解决方案1】：

据我了解，您可以使用readmore package。

import 'package:flutter/material.dart';
import 'package:readmore/readmore.dart';

class ReadMoreScreen extends StatelessWidget {
  const ReadMoreScreen({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(title: Text('Read More')),
        body: Column(children: [
          ReadMoreText(
            'Flutter is Google’s mobile UI open source framework to build high-quality native (super fast) interfaces for iOS and Android apps with the unified codebase.',
            style: TextStyle(color: Colors.black),
            trimLines: 2,
            colorClickableText: Colors.pink,
            trimMode: TrimMode.Line,
            trimCollapsedText: 'Show more',
            trimExpandedText: ' show less',
            callback: (change) {
              print(change);
            },
          ),
        ]));
  }
}

【讨论】：

好吧，但是如何隐藏按钮？
可能不是最好的解决方案，但将 trimCollapsedText 设置为空字符串有效

【解决方案2】：

Flexible(child: Text("Lorem Ipsum is simply dummy text of the printing and typesetting industry.")),

【讨论】：