패키지, 저장소 및 앱 카테고리 검색

패키지 상세v5.1.1

infinite_scroll_pagination

사용자가 화면을 아래로 스크롤할 때 항목 페이지를 지연 로드하고 표시합니다.

AndroidiOSWebmacOSWindowsLinux
30일 다운로드
48.1만
좋아요
4.1천
Pub 점수
150

패키지 설치

flutter pub add infinite_scroll_pagination

패키지 개요

공개 정보를 바탕으로 생성한 선택 가이드입니다.

사용자가 스크롤할 때 페이지 단위 콘텐츠를 지연로딩할 수 있도록 해주는 플러터 패키지입니다. 데이터를 점진적으로 가져오는 방식으로 성능과 사용자 경험을 향상시킵니다. ListView 및 기타 스크롤 가능한 위젯과 원활하게 통합되어 현재 콘텐츠의 끝부분에 가까워질 때 자동으로 페이지 요청을 트리거합니다. 소셜 피드, 검색 결과, 제품 카탈로그와 같은 긴 목록을 표시하는 앱에 이상적입니다. 최소한의 보일러플레이트로 로딩 상태, 오류 복구, 빈 상태를 처리합니다.

사용 사례

  • 소셜 미디어 피드 스크롤
  • 검색 결과 페이징
  • 전자상거래 제품 목록
  • 긴 형식 기사 표시
  • 다시로드되는 대시보드의 무한 콘텐츠 로딩

주요 기능

  • 스크롤 시 페이지 자동 로드
  • 내장된 로딩 및 오류 상태
  • 여러 스크롤 가능한 위젯 지원
  • 사용자 정의 가능한 페이지 요청 로직
  • 지연 로딩을 통한 효율적인 메모리 사용

적합한 대상

  • 대규모 데이터셋을 가진 앱
  • 스크롤 가능한 목록 인터페이스
  • 성능에 민감한 UI
  • 최소 설정을 원하는 개발자
  • 부드러운 무한 스크롤이 필요한 프로젝트

고려 사항

  • 비동기 데이터 소스를 올바르게 처리해야 합니다
  • 사용자 정의 캐싱 전략이 필요할 수 있습니다
  • 작은 정적 목록에는 적합하지 않음
  • 페이지 토큰 또는 오프셋 로직의 올바른 구현에 따라 다릅니다
  • 철저하게 구성하지 않으면 과도한 데이터 가져오기의 가능성이 있습니다

원본 README

연결된 소스 저장소의 README 원문 스냅샷입니다. 최신 내용은 저장소에서 확인하세요.

Package Logo with Flutter Favorite Badge

Chosen as a Flutter Favorite by the Flutter Ecosystem Committee

Pub.dev Badge GitHub Build Badge Code Coverage Badge Gitter Badge Effective Dart Badge MIT License Badge Flutter Platform Badge


Infinite Scroll Pagination

Unopinionated, extensible and highly customizable package to help you lazily load and display small chunks of items as the user scrolls down the screen – known as infinite scrolling pagination, endless scrolling pagination, auto-pagination, lazy loading pagination, progressive loading pagination, etc.

Designed to feel like part of the Flutter framework.

Example Project

Tutorial

By raywenderlich.com (step-by-step, hands-on, in-depth, and illustrated).

Usage

class ListViewScreen extends StatefulWidget {
  const ListViewScreen({super.key});

  @override
  State<ListViewScreen> createState() => _ListViewScreenState();
}

class _ListViewScreenState extends State<ListViewScreen> {
  late final _pagingController = PagingController<int, Photo>(
    getNextPageKey: (state) => state.lastPageIsEmpty ? null : state.nextIntPageKey,
    fetchPage: (pageKey) => RemoteApi.getPhotos(pageKey),
  );

  @override
  void dispose() {
    _pagingController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) => PagingListener(
    controller: _pagingController,
    builder: (context, state, fetchNextPage) => PagedListView<int, Photo>(
      state: state,
      fetchNextPage: fetchNextPage,
      builderDelegate: PagedChildBuilderDelegate(
        itemBuilder: (context, item, index) => ImageListTile(item: item),
      ),
    ),
  );
}

For more usage examples, please take a look at our cookbook or check out the example project.

Features

Migration

if you are upgrading the package, please check the migration guide for instructions on how to update your code.

API Overview

API Diagram

카테고리

의존성

의존성 목록 4 개

소스 저장소

이 패키지를 사용하는 프로젝트

순위