微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

如何显示大文本颤动中的一小部分文本?

如何解决如何显示大文本颤动中的一小部分文本?

实际

Lorem ipsum dolor 坐 amet,consectetur adipiscing 精英。 Mauris non mauris nulla。 Nam euismod condimentum erat,tempor efficitur quam。 Aliquam commodo pretium libero vel interdum。 Quisque suscipit a massa suscipit actor。 Maecenas faucibus mattis interdum。 Duis lacinia turpis 在 Tortor aliquet,坐 amet consequat nibh moestie。前庭坐 a​​met placerat sapien。 Cras efficitur orci massa,non mattis nunc laoreet porta。 Maecenas purus lacus,consectetur ac lorem et,pulvinar venenatis neque。古怪的 hendrerit sagittis rut​​rum。 Sed et suscipit elit。 Donec in lectus in nisi prestibulum venenatis at eu nisi。 Phasellus diam est,varius ac odio ac,facilisis hendrerit sapien。

预期

Lorem ipsum dolor 坐 amet,consectetur adipiscing 精英。 Mauris non mauris nulla。 Nam euismod condimentum erat,tempor efficitur quam。 Aliquam commodo pretium libero vel interdum。 Quisque suscipit a massa suscipit actor。 Maecenas faucibus mattis interdum。 Duis lacinia turpis 在 Tortor aliquet,坐 amet consequat nibh moestie。前庭坐 a​​met placerat sapien。可恶...

注意

解决方法

可以使用overflow属性来实现这个效果

Expanded(
    child: Text(
      "Any Large Text",maxLines: 5,overflow: TextOverflow.ellipsis,),);

确保用 Expanded 包裹 Text 小部件。

您还可以尝试其他属性,如 minLines 或其他形式的溢出,如 TextOverflow.fadeTextOverflow.clip。

,

您可以通过将 maxLines 与来自 Text 小部件的 overflow 属性结合使用来实现这一点。

enter image description here

import 'package:flutter/material.dart';

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        margin: EdgeInsets.all(16),alignment: Alignment.center,child: Text(
          'Lorem ipsum dolor sit amet,consectetur adipiscing elit. Mauris non mauris nulla. Nam euismod condimentum erat,tempor efficitur quam. Aliquam commodo pretium libero vel interdum. Quisque suscipit a massa suscipit auctor. Maecenas faucibus mattis interdum. Duis lacinia turpis at tortor aliquet,sit amet consequat nibh molestie. Vestibulum sit amet placerat sapien. Cras efficitur orci massa,non mattis nunc laoreet porta. Maecenas purus lacus,consectetur ac lorem et,pulvinar venenatis neque. Quisque hendrerit sagittis rutrum. Sed et suscipit elit. Donec in lectus in nisi vestibulum venenatis at eu nisi. Phasellus diam est,varius ac odio ac,facilisis hendrerit sapien.',maxLines: 6,textAlign: TextAlign.justify,);
  }
}
,
String text = 'Lorem ipsum dolor sit amet,facilisis hendrerit sapien.';
  
  bool readMore = false;
  
  @override
  Widget build(BuildContext context) {
    return RichText(
      text: TextSpan( //change 200 to required length
  text : text.length>200 && readMore ? text : text.substring(0,200),children: <TextSpan>[
      text.length > 200 ?
      TextSpan(text: readMore?
               ' Show Less' : '...Read More...',style: TextStyle(color: Colors.blue,recognizer: TapGestureRecognizer()..onTap = () {
      setState((){
        readMore = !readMore;
      });
    },) :null,]
  ),);
  }

Dartpad 截图

enter image description here enter image description here

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐


Selenium Web驱动程序和Java。元素在(x,y)点处不可单击。其他元素将获得点击?
Python-如何使用点“。” 访问字典成员?
Java 字符串是不可变的。到底是什么意思?
Java中的“ final”关键字如何工作?(我仍然可以修改对象。)
“loop:”在Java代码中。这是什么,为什么要编译?
java.lang.ClassNotFoundException:sun.jdbc.odbc.JdbcOdbcDriver发生异常。为什么?
这是用Java进行XML解析的最佳库。
Java的PriorityQueue的内置迭代器不会以任何特定顺序遍历数据结构。为什么?
如何在Java中聆听按键时移动图像。
Java“Program to an interface”。这是什么意思?