[flutter] 플러터 GridView에서 아이템을 다양한 방식으로 레이아웃하는 방법은?

18 Dec 2023

flutter

방법 1: SliverGridDelegate 사용

GridView.builder(
  gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
    crossAxisCount: 2,
    crossAxisSpacing: 10,
    mainAxisSpacing: 10,
    childAspectRatio: 1,
  ),
  itemCount: items.length,
  itemBuilder: (BuildContext context, int index) {
    return YourItemWidget(items[index]);
  },
)

방법 2: GridView.count 또는 GridView.extent 사용

GridView.count(
  crossAxisCount: 2,
  children: List.generate(100, (index) {
    return YourItemWidget(index);
  },
)

GridView.extent(
  maxCrossAxisExtent: 200,
  children: List.generate(100, (index) {
   return YourItemWidget(index);
  }),
)

방법 3: Custom Layout 사용

이 방법은 CustomMultiChildLayout을 사용하여 자신만의 레이아웃을 정의하는 데 사용됩니다. 이 방법은 특정한 레이아웃이나 위치를 원하는 경우에 유용합니다.

CustomMultiChildLayout(
  delegate: YourCustomLayoutDelegate(),
  children: List.generate(100, (index) {
    return LayoutId(
      id: YourLayoutId(index),
      child: YourItemWidget(index),
    );
  }),
)

위의 각 방법은 다양한 상황에 적합하며, 여러분의 필요에 따라 선택하여 사용할 수 있습니다. 더 많은 정보를 위해 Flutter 공식 문서를 참조하세요.