Flutter – Cómo limitar la longitud del texto

Después de tanto trabajar ya encontramos la respuesta de esta traba que muchos de nuestros lectores de este sitio web han presentado. Si tienes algún detalle que aportar no dejes de compartir tu conocimiento.

Solución:

Si desea usar su RichText Widget dentro de una Fila y evitar el desbordamiento con puntos suspensivos, primero debe envolverlo dentro de un Flexible. los Flexible muestra el Row que el RichText se puede encoger.

Después de envolver el RichText dentro de una Flexiblesimplemente agregue overflow: TextOverflow.ellipsis para usted RichText. Aquí un ejemplo mínimo con un RichText dentro de un Flexible dentro de una Row.

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget 
  @override
  Widget build(BuildContext context) 
    return MaterialApp(
      home: Scaffold(
        body: Center(
            child: Container(
              padding: EdgeInsets.all(4.0),
          color: Colors.lime,
          width: 200.0,
          child: Row(
            children: [
              Flexible(
                child: RichText(
                  overflow: TextOverflow.ellipsis,
                  strutStyle: StrutStyle(fontSize: 12.0),
                  text: TextSpan(
                      style: TextStyle(color: Colors.black),
                      text: 'A very long text :)'),
                ),
              ),
              Container(
                width: 100.0,
                height: 100.0,
                color: Colors.orangeAccent,
              )
            ],
          ),
        )),
      ),
    );
  

No hay necesidad de usar Texto rico. Solo agrega tu Texto un parámetro de
overflow: TextOverflow.ellipsis y el widget Ajustar el texto con Flexible

Ejemplo:

 Row(
            children: [
              Icon(Icons.location_on, color: Colors.grey),
              Flexible(
                  child: Text(propertyModel.propertyAddress, style: AppTextStyle.headerSmall2(context),
                 overflow: TextOverflow.ellipsis),
              )
            ],
          ),

Intente establecer la propiedad de desbordamiento:

    overflow: TextOverflow.ellipsis

Sección de Reseñas y Valoraciones

---

---

Utiliza Nuestro Buscador