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

패키지 상세v0.1.0

flutter_lazy_indexed_stack

지연 로딩이 가능한 `IndexedStack`를 노출하는 Flutter 패키지입니다.

AndroidiOSWebmacOSWindowsLinux
30일 다운로드
6.7천
좋아요
80
Pub 점수
160

패키지 설치

flutter pub add flutter_lazy_indexed_stack

패키지 개요

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

내장된 IndexedStack을 확장하여 자식 요소의 지연 로딩을 지원하는 플러터 패키지입니다. 현재 보이는 위젯만 빌드되고 렌더링되도록 보장하여, 비용이 큰 위젯이 많은 대규모 스택에서 성능을 향상시킵니다. 메모리 효율성과 필요 시 렌더링이 중요한 상황에 이상적입니다. 패키지는 IndexedStack과 동일한 API를 유지하면서 지연 초기화 기능을 추가하여 기존 프로젝트에 원활하게 통합할 수 있습니다.

사용 사례

  • 큰 탭 기반 인터페이스
  • 메모리 효율적인 탐색
  • 동적 콘텐츠 전환
  • 요청에 따른 위젯 렌더링
  • 무거운 컴포넌트를 가진 복잡한 UI

주요 기능

  • 스택 자식의 지연로딩
  • IndexedStack과 동일한 API
  • 개선된 성능
  • 메모리 사용량 감소
  • 무결점 통합

적합한 대상

  • 개발자가 UI 성능을 최적화하고 있습니다
  • 여러 탭 또는 화면을 가진 앱
  • 중량 웨지트를 사용하는 IndexedStack을 사용하는 프로젝트
  • 페이지네이션 중심 애플리케이션
  • 매우 상호작용적인 대시보드

고려 사항

  • 즉각적인 자식 렌더링 요구 사항에 적합하지 않습니다
  • 스택 기반 레이아웃에 제한됨
  • 신중한 상태 관리가 필요할 수 있습니다
  • 안정적인 인덱스 값과 함께 사용할 때 가장 좋습니다
  • 기본적으로 애니메이션 전환을 지원하지 않습니다

원본 README

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

Lazy Indexed Stack 😴🥞

pub ci License: MIT style: very good analysis

A Flutter package that exposes an IndexedStack that can be lazily loaded.

IndexedStack is a widget that shows its children one at a time, preserving the state of all the children. But it renders all the children at once.

With LazyIndexedStack, you can load the children lazily, and only when they are needed. This comes in handy if you have a lot of children, and you don't want to load them all at once or if you have a child that loads content asynchronously.

Usage

The LazyIndexedStack API is the same as IndexedStack. A basic implementation requires two parameters:

  • A List<Widget> of children that are going to be lazy loaded under the hood.
  • An int index that indicates which child is going to be shown.

Example

class HomePage extends StatefulWidget {
  const HomePage({super.key, required this.title});

  final String title;

  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  int index = 0;

  void changeIndex(int newIndex) => setState(() => index = newIndex);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Column(
        children: [
          Expanded(
            child: LazyIndexedStack(
              index: index,
              children: List.generate(3, (i) => Text('$i')),
            ),
          ),
          BottomNavigationBar(
            currentIndex: index,
            onTap: changeIndex,
            items: const [
              BottomNavigationBarItem(
                icon: Icon(Icons.filter_1),
                label: '1',
              ),
              BottomNavigationBarItem(
                icon: Icon(Icons.filter_2),
                label: '2',
              ),
              BottomNavigationBarItem(
                icon: Icon(Icons.filter_3),
                label: '3',
              ),
            ],
          ),
        ],
      ),
    );
  }
}

Refer to the example to see the usage of LazyIndexedStack.

카테고리

소스 저장소

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