在flutter中删除长文本末尾的矩形框

pcww981p  于 2022-12-19  发布在  Flutter
关注(0)|答案(3)|浏览(139)

从长文本末尾删除矩形框

下面是长文本的代码

return Container(
      margin: EdgeInsets.only(left: 10, right: 5),
      child: Column(
        children: [
          Row(
            children: [
              Expanded(
                child: Text(
                  subjectName,
                  overflow: TextOverflow.ellipsis,
                  style: GoogleFonts.sourceSansPro(
                      fontSize: 14,
                      fontWeight: FontWeight.w600,
                      color: AppColors.color072346),
                ),
              )
            ],
          ),
          SizedBox(
            height: 3,
          ),
        ],
      ),
    );
  }

使用overflow: TextOverflow.clip,用户界面将是

想要显示3点的日志文本。如何实现这一点。如何删除到框从年底的长文本在Flutter网页。谢谢提前!!!

ctzwtxfj

ctzwtxfj1#

您需要计算宽度,并指定宽度以启用TextOverflow.ellipsis

Container(
  width: 120, // <--- you need to specify width 
  Text(
    subjectName,
    overflow: TextOverflow.ellipsis,
    style: GoogleFonts.sourceSansPro(
      fontSize: 14,
      fontWeight: FontWeight.w600,
      color: AppColors.color072346),
    ),
  ),
),
5lhxktic

5lhxktic2#

而不是画布使用html渲染器,为我解决了这个问题.使用

flutter run -d chrome --web-renderer html

用于建筑。
但是html渲染器可能会导致性能问题......
代替这个选项,你也可以改变你的字体。GoogleFonts应该工作得很好。

uyhoqukh

uyhoqukh3#

https://api.flutter.dev/flutter/painting/TextOverflow-class.html阅读TextOverflow枚举的文档。我想您需要将TextOverflow.ellipsis更改为TextOverflow.clip。

相关问题