[Flutter] Row/Text OverFlow 인 경우 다음 라인으로 넘기기

text overflow in new line in flutter

 

Row(
  children: [
    SvgPicture.asset(
      'assets/icons/info_grey.svg',
      width: ScreenUtil().setWidth(18),
    ),
    SizedBox(width: ScreenUtil().setWidth(4)),
    Text(
      'Flutter는 하나의 코드베이스로 모바일, 웹, 데스크톱에서 네이티브로 컴파일 되는 구글의 아름다운 UI 툴킷입니다.',
      style: TextStyle(
        color: Color(0XFF666666),
        fontSize: ScreenUtil().setSp(11),
        fontWeight: FontWeight.w400,
        height: 16/11
      )
    )
  ],
),

오버 플로우!

 

Row(
  children: [
    SvgPicture.asset(
      'assets/icons/info_grey.svg',
      width: ScreenUtil().setWidth(18),
    ),
    SizedBox(width: ScreenUtil().setWidth(4)),
    Expanded(
      child: Text(
        'Flutter는 하나의 코드베이스로 모바일, 웹, 데스크톱에서 네이티브로 컴파일 되는 구글의 아름다운 UI 툴킷입니다.',
        style: TextStyle(
          color: Color(0XFF666666),
          fontSize: ScreenUtil().setSp(11),
          fontWeight: FontWeight.w400,
          height: 16/11
        )
      ),
    )
  ],
),

다음줄로 넘어감! 

 

 

Row(
  crossAxisAlignment: CrossAxisAlignment.start,
  children: [
    SvgPicture.asset(
      'assets/icons/info_grey.svg',
      width: ScreenUtil().setWidth(18),
    ),
    SizedBox(width: ScreenUtil().setWidth(4)),
    Expanded(
      child: Text(
        'Flutter는 하나의 코드베이스로 모바일, 웹, 데스크톱에서 네이티브로 컴파일 되는 구글의 아름다운 UI 툴킷입니다.',
        style: TextStyle(
          color: Color(0XFF666666),
          fontSize: ScreenUtil().setSp(11),
          fontWeight: FontWeight.w400,
          height: 16/11
        )
      ),
    )
  ],
),

아이콘 위로 정렬!