flutter multiline Text overFlow

multiline Text overFlow 문제를 검색해보면 다양한 방법이 나오는데.. 

결국 overflow문제는 해당 위젯의 크기를 지정하지 않았기 때문에 생기는 문제이다.

그러니까 parent Widget 보다 child Widget 의 사이즈가 커져버렸는데, child Widget의 할당 사이즈를 모르니까 키우다보니 그런 일이 발생한 것.. 

SizedBox(
    height: 30,
    child:
    Column(
        children: [
          Text('짧은 글'),
          Text(
              '아주~~~~~~ 긴 글~~~~~~~~~~~~아주~~~~~~ 긴 글~~~~~~~~~~~~아주~~~~~~ 긴 글~~~~~~~~~~~~아주~~~~~~ 긴 글~~~~~~~~~~~~아주~~~~~~ 긴 글~~~~~~~~~~~~아주~~~~~~ 긴 글~~~~~~~~~~~~아주~~~~~~ 긴 글~~~~~~~~~~~~아주~~~~~~ 긴 글~~~~~~~~~~~~아주~~~~~~ 긴 글~~~~~~~~~~~~아주~~~~~~ 긴 글~~~~~~~~~~~~아주~~~~~~ 긴 글~~~~~~~~~~~~')
        ]
    )
)

이렇게 해버리면 문제가 발생하게 되는 것이다. 

해당 문제는 textoverflow를 설정해줘도 line수가 넘어가면 overflow가 발생한다.

문제는 height에 대한 결정을 해줘야하는 것!

아래와 같이 expanded로 남은 영역을 모두 차지하도록 만들면 문제가 해결된다.

SizedBox(
    height: 30,
    child:
    Column(
        children: [
          Text('짧은 글'),
          Expanded(
            child: Text(
                '아주~~~~~~ 긴 글~~~~~~~~~~~~아주~~~~~~ 긴 글~~~~~~~~~~~~아주~~~~~~ 긴 글~~~~~~~~~~~~아주~~~~~~ 긴 글~~~~~~~~~~~~아주~~~~~~ 긴 글~~~~~~~~~~~~아주~~~~~~ 긴 글~~~~~~~~~~~~아주~~~~~~ 긴 글~~~~~~~~~~~~아주~~~~~~ 긴 글~~~~~~~~~~~~아주~~~~~~ 긴 글~~~~~~~~~~~~아주~~~~~~ 긴 글~~~~~~~~~~~~아주~~~~~~ 긴 글~~~~~~~~~~~~'),
          )
        ]
    )
)