Question 76280 in Flutter Question posted in
The official Flutter documentation can be found here.

Overflow into the Text widget ignores the available space – Flutter

Without specifying the maximum number of lines, the text is truncated after 1 line. With a larger value than the size of the parent allows, the text goes beyond the parent and there are no errors.

enter image description here
expected

   @override
      Widget build(BuildContext context) {
        return MaterialApp(
          home: SafeArea(
            child: Material(
              child: Column(
                children: [
                  Container(
                    color: Colors.black12,
                    height: 100,
                    child: Text(
                      'dsf sdf ds fs dfsdfdf  iuh gyj gy y'
                          ' guygiukjh  uiygihjo; rdtfyguhijok rftyguhij yguhij'
                          'dsf sdf ds fs dfsdfdf  iuh gyj gy y'
                          ' guygiukjh  uiygihjo; rdtfyguhijok rftyguhij yguhij'
                          'dsf sdf ds fs dfsdfdf  iuh gyj gy y'
                          ' guygiukjh  uiygihjo; rdtfyguhijok rftyguhij yguhij'
                          'dsf sdf ds fs dfsdfdf  iuh gyj gy y'
                          ' guygiukjh  uiygihjo; rdtfyguhijok rftyguhij yguhij'
                          'dsf sdf ds fs dfsdfdf  iuh gyj gy y'
                          ' guygiukjh  uiygihjo; rdtfyguhijok rftyguhij yguhij',
                      overflow: TextOverflow.ellipsis,
                      maxLines: 122,
                    ),
                  ),
                ],
              ),
            ),
          ),
        );
      }

softWrap does not affect in any way, and also does not help to wrap Flexible and Expanded.

enter image description here

Tags:

5

Answers


  1. 0

    You need to wrap your SingleChildScrollView in a Text widget and you will get what you are looking for.

          return MaterialApp(
  home: SafeArea(
    child: Material(
      child: Column(
        children: [
          Container(
            color: Colors.black12,
            height: 100,
            padding: EdgeInsets.only(bottom: 4),
            child: Text(
              'dsf sdf ds fs dfsdfdf  iuh gyj gy y'
              ' guygiukjh  uiygihjo; rdtfyguhijok rftyguhij yguhij'
              'dsf sdf ds fs dfsdfdf  iuh gyj gy y'
              ' guygiukjh  uiygihjo; rdtfyguhijok rftyguhij yguhij'
              'dsf sdf ds fs dfsdfdf  iuh gyj gy y'
              ' guygiukjh  uiygihjo; rdtfyguhijok rftyguhij yguhij'
              'dsf sdf ds fs dfsdfdf  iuh gyj gy y'
              ' guygiukjh  uiygihjo; rdtfyguhijok rftyguhij yguhij'
              'dsf sdf ds fs dfsdfdf  iuh gyj gy y'
              ' guygiukjh  uiygihjo; rdtfyguhijok rftyguhij yguhij',
              overflow: TextOverflow.ellipsis,
              maxLines: 122,
            ),
          ),
        ],
      ),
    ),
  ),
);
    Login or Signup to reply.
  2. 0

    just remove height: 100, and it will be fixed.

    Login or Signup to reply.
  3. 0

    Remove following two lines from your code.

                        overflow: TextOverflow.ellipsis,
                    maxLines: 122,

    Edited

    And add textAlign as justify

    textAlign: TextAlign.justify,
    Login or Signup to reply.
  4. 0

    replace TextOverflow.ellipsis with : overflow: TextOverflow.visible, or overflow: TextOverflow.clip,

    TextOverflow.visible: text will be visible but you will have to
    increase height of container in your case

    TextOverflow.clip: text will be visible which container height can
    contain

    Login or Signup to reply.
  5. 0

    maxLines does give this weird behaviour.
    Since you have hardcoded height, just go with hardcoding maxLines that would fit that height. then as suggested by some answers, wrap your text with Expanded. as you wanted, this will show overflow warning if maxLines don’t fit in given height.

    Container(height: 100, child: Column(
      children: [
           Row(
            children: [
              Expanded(
                child: Text(
                  'dsf sdf ds fs dfsdfdf  iuh gyj gy y'
                      ' guygiukjh  uiygihjo; rdtfyguhijok rftyguhij yguhij'
                      'dsf sdf ds fs dfsdfdf  iuh gyj gy y'
                      ' guygiukjh  uiygihjo; rdtfyguhijok rftyguhij yguhij'
                      'dsf sdf ds fs dfsdfdf  iuh gyj gy y'
                      ' guygiukjh  uiygihjo; rdtfyguhijok rftyguhij yguhij'
                      'dsf sdf ds fs dfsdfdf  iuh gyj gy y'
                      ' guygiukjh  uiygihjo; rdtfyguhijok rftyguhij yguhij'
                      'dsf sdf ds fs dfsdfdf  iuh gyj gy y'
                      ' guygiukjh  uiygihjo; rdtfyguhijok rftyguhij yguhij'
                      'dsf sdf ds fs dfsdfdf  iuh gyj gy y'
                      ' guygiukjh  uiygihjo; rdtfyguhijok rftyguhij yguhij'
                      'dsf sdf ds fs dfsdfdf  iuh gyj gy y'
                      ' guygiukjh  uiygihjo; rdtfyguhijok rftyguhij yguhij'
                      'dsf sdf ds fs dfsdfdf  iuh gyj gy y'
                      ' guygiukjh  uiygihjo; rdtfyguhijok rftyguhij yguhij',
                  overflow: TextOverflow.ellipsis,
                  maxLines: 14,
                ),
              ),
            ],
          ),

      ],
    ));
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search