как отобразить небольшую часть текста из большого трепета текста?

Acutal

Lorem ipsum dolor sit amet, conctetur adipiscing elit. Mauris non mauris nulla. Nam euismod condimentum erat, tempor efficitur quam. Aliquammodo pretium libero vel interdum. Quisque suscipit a massa suscipit auctor. Maecenas faucibus mattis interdum. Duis lacinia turpis в аликвоте мучителя, сидите, следите за ним, молесье. Vestibulum sit amet placerat sapien. Cras efficitur orci massa, non mattis nunc laoreet porta. Maecenas purus lacus, conctetur ac lorem et, pulvinar venenatis neque. Quisque hendrerit sagittis rutrum. Sed et suscipit elit. Donec in lectus in nisi vestibulum venenatis в eu nisi. Phasellus diam est, varius ac odio ac, facilisis hendrerit sapien.

Ожидал

Lorem ipsum dolor sit amet, conctetur adipiscing elit. Mauris non mauris nulla. Nam euismod condimentum erat, tempor efficitur quam. Aliquammodo pretium libero vel interdum. Quisque suscipit a massa suscipit auctor. Maecenas faucibus mattis interdum. Duis lacinia turpis в аликвоте мучителя, сидите, следите за ним, молесье. Vestibulum sit amet placerat sapien. Краш ...

Примечание

  • Нет функции чтения
Источник

3 ответа

Вы можете добиться этого, используя maxLines в комбинации с overflow атрибуты из Text виджет.

      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,
          overflow: TextOverflow.ellipsis,
          textAlign: TextAlign.justify,
        ),
      ),
    );
  }
}
Источник 
      String 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.';
  
  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

Источник

Вы можете использовать свойство переполнения, чтобы получить этот эффект.

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

Убедитесь, что текстовый виджет заключен в расширенный вид.

Вы также можете попробовать другие свойства, такие как minLines, или другие формы переполнения, такие как TextOverflow.fade или TextOverflow.clip.

Источник
Другие вопросы по тегам