Flutter에서 Wrap은 Widget을 여러 줄에 걸쳐 배치하는데 사용되는 편리한 Widget입니다. Wrap은 자식 Widget을 수평 또는 수직 방향으로 배열할 수 있으며, 공간이 부족할 경우 자동으로 줄바꿈을 수행합니다.

Wrap 위젯을 사용하면 다른 Widget과 마찬가지로 자식 Widget을 추가하고 설정할 수 있습니다. Wrap에 자식 Widget이 추가되면 Wrap은 자식들을 가장 적은 공간을 차지하면서 배치하려고 시도합니다. Wrap은 첫 번째 줄에 적합한 만큼 Widget을 배치하고, 다음 줄에는 남은 Widget을 배치합니다. 이러한 과정을 수평 또는 수직 방향으로 반복합니다.

Wrap이 유용한 상황 중 하나는 다양한 크기의 이미지를 포함하는 목록을 나타내는 것입니다. 일반적으로 GridView나 ListView를 사용하여 이 작업을 수행할 수 있지만, 때로는 Wrap을 사용하는 것이 더 효과적일 수 있습니다. Wrap을 사용하면 고정된 방향으로 구성된 GridView나 ListView와 달리 동적으로 크기를 조정할 수 있는 리스트를 만들 수 있습니다.

아래는 Wrap을 사용한 예제 코드입니다.

Wrap(
  spacing: 8.0, // 자식 Widget 사이의 간격 설정
  runSpacing: 4.0, // 줄 사이의 간격 설정
  children: <Widget>[
    Container(width: 100, height: 100, color: Colors.red),
    Container(width: 80, height: 80, color: Colors.blue),
    Container(width: 120, height: 120, color: Colors.green),
    Container(width: 60, height: 60, color: Colors.yellow),
    // 추가적인 자식 Widget
  ],
)

위 코드에서 spacing과 runSpacing 속성을 사용하여 자식 Widget 사이의 간격과 줄 사이의 간격을 설정할 수 있습니다. 자식 Widget은 Container와 같은 기본 Widget뿐만 아니라 이미지, 텍스트 등 다양한 Widget으로 구성할 수 있습니다.

Wrap은 다양한 상황에서 유용하게 사용될 수 있는 강력한 Flutter Widget입니다. Wrap을 통해 자식 Widget을 유연하게 배치하고 다양한 크기와 구성을 가진 UI를 구축할 수 있습니다.

참고 자료:

• Flutter Wrap 공식 문서