[flutter] 페이지네이션(무한스크롤) 커스터마이징 - error 상황 -infinite_scroll_pagination

지금 작업하는 서버에서는 해당 카테고리에 상품이 없는 경우 error를 날린다.

따라서 이 패키지에서는 error가 생긴 경우 아래와 같은 사진이 나온다.

 

에러 메시지와 모양을 바꾸고 싶어서 시도했다.

 

Widget build(BuildContext context) {
    return Padding(
      padding: EdgeInsets.only(top: widget.topPadding),
      child: Center(
        child: PagedListView<int, Product>(
          pagingController: _pagingController,
          builderDelegate: PagedChildBuilderDelegate<Product>(
            itemBuilder: (context, item, index) => ProductCard(
              product: item,
            ),
            newPageErrorIndicatorBuilder: (_) =>
                Center(child: Text("상품을 불러올 수 없습니다.")),
            firstPageErrorIndicatorBuilder: (_) =>
                Center(child: Text("상품을 불러올 수 없습니다.")),
            noItemsFoundIndicatorBuilder: (_) =>
                Center(child: Text("noItem - 상품을 불러올 수 없습니다.")),
            noMoreItemsIndicatorBuilder: (_) => const SizedBox(),
          ),
        ),
      ),
    );
  }

나중에는 error가 아닌 data를 null로 보낼 수도 있으므로 나눠서 error시 보일 위젯을 구분했다.

이렇게 에러가 뜬다! 

 

이 외에도

firstPageProgressIndicatorBuilder: (_) => FirstPageProgressIndicator(),
newPageProgressIndicatorBuilder: (_) => NewPageProgressIndicator(),
noItemsFoundIndicatorBuilder: (_) => NoItemsFoundIndicator(),
noMoreItemsIndicatorBuilder: (_) => NoMoreItemsIndicator(),

이렇게 네가지를 설정할 수 있다. progress일 때는 error를 나타내는 것은 아니고 로딩중일 때를 나타낸다. 원한다면 원하는 모양의 로딩 위젯을 넣을 수 있을 것이다.