Flutter : Expanded와 SingleChildScrollView 의 차이점

 

List를 사용하다보면 Exapnded위젯과 SingleChildScrollView를 자주 사용하게 된다. 

둘의 차이점이 궁금해서 GPT에게 물어보았다. :)

 

결론 

단순히 Expanded는 사용 가능한 공간의 비율을 나누기 위한 위젯이고 

SingleChildScrollView 위젯은 사용가능한 공간 안에서 해당 위젯의 크기가 크거나 길어지면 스크롤 기능을 부여해주는 위젯이다. 

 

만약 ListView의 공간을 하단에 리스트 추가 버튼을 누르면서 하나씩 증가 시키고 싶다면 

SingleChildScrollView 위젯을 쓰면 좋다. 

 

 

 

---

 

Sure, I'd be happy to explain the difference between Expanded and SingleChildScrollView in Dart.

Expanded is a widget that can be used inside a Row, Column, or Flex widget to instruct its parent widget to give it as much available space as possible in the main axis.

 

For example, if you have a Row with two Expanded children, each will take up half of the available horizontal space.

 

 

SingleChildScrollView is a widget that provides a scrolling view for its child widget. It's useful when you have a child widget that's too large to fit on the screen, and you want the user to be able to scroll through it to see all of its contents. If the child widget is smaller than the available space, the SingleChildScrollView will not show any scrollbars and the content will be displayed as usual.

Here's an example of how to use Expanded and SingleChildScrollView together:

 

 

Expanded 위젯은   중심선에서 부모  위젯에게 가능한 많은 공간을 주기 위해서  Row,Column 또는 Flex 위젯 안에 포함 시킬 수 있습니다. 예를들어 Row 안에 두 개의 Expanded 위젯을 두었다면 그것은 각각  수평 공간의 반 만큼씩 차지 할 것 입니다. 

 

SingChildScrollView 위젯은 child 한 위젯의 스크롤을 할 수 있게 기능을 제공합니다. 이것은 child 위젯이 공간을 많이 차지하게 될 때 아주 유용합니다. 그리고 화면 밖으로 넘어가는 내용도 유저는 스크롤을 통해서 볼 수 있게 할 수 있습니다. 

당신의 child  위젯으 사용할 수 있는 공간 보다 작다면 , SingleChildScrollView 위젯은 평상시 위젯처럼 스크롤을 하지 않게 해줄 것입니다. 

instruct : 지시하다 

parent :  부모의

axis : 중심선

 

Column(
  children: [
    Expanded(
      child: SingleChildScrollView(
        child: Text(
          'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
        ),
      ),
    ),
  ],
);

 

 

In this example, we have a Column widget with one child - an Expanded widget. The Expanded widget takes up all of the available vertical space in the Column. The child of the Expanded widget is a SingleChildScrollView widget, which contains a Text widget with some Lorem Ipsum text. Because the Text widget is longer than the available space, the SingleChildScrollView provides scrolling to allow the user to see all of the text.

 

예시로 Column 위젯 안에 Expanded 위젯 , 그 Expanded위젯은 Column 안에서 수직으로의 가능한 공간을 차지 하고 있습니다. Expanded 위젯의 child 위젯인 SingleChildScrollView 위젯은 Lorem Ipsum 의 글을 포함하고 있습니다.  그 위젯은 사용 가능한 공간보다 길기 때문에, SingleChildScrollView 는 유저가 모든 텍스트를 다 볼 수 있게 스크롤 기능을 제공 합니다. 

 

 

from GPT