sidebarx

패키지 개요

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

SidebarX는 Android, iOS, 웹, macOS, Windows, Linux에서 드로어 위젯으로 작동하는 사용자 정의 가능한 네비게이션 사이드바 또는 사이드 네비게이션 바를 제공하는 다중 플랫폼 플러터 패키지입니다. 부드러운 전환과 반응형 디자인을 통해 직관적인 탐색을 가능하게 하며, 지속적인 네비게이션 메뉴가 필요한 앱에 적합합니다. 컴팩트 및 확장 상태를 모두 지원하여 다양한 화면 크기와 사용자 선호도에 적합합니다. 플러터의 크로스플랫폼 기능을 기반으로 구축되어 장치 간 일관된 탐색 경험을 쉽게 구현할 수 있습니다.

사용 사례

지속적인 탐색을 갖춘 싱글 페이지 애플리케이션
사이드바 메뉴가 있는 멀티스크린 대시보드
통합 탐색이 필요한 크로스 플랫폼 앱
다양한 화면 크기에 적응하는 반응형 레이아웃
드로어 형식의 탐색이 필요한 데스크톱 및 웹 앱

주요 기능

다중 플랫폼 지원 (Android, iOS, Web, macOS, Windows, Linux)
사용자 정의 가능한 사이드바 외관 및 동작
작은 상태와 확장된 상태를 모두 지원합니다
상태 전환을 위한 부드러운 애니메이션
다양한 화면 크기에 대응하는 반응형 디자인

적합한 대상

크로스플랫폼 앱을 개발하는 개발자
일관된 탐색 패턴을 찾는 디자이너
다양한 플랫폼 간 코드 재사용을 우선시하는 팀
복잡한 탐색 구조를 가진 앱
현대적이고 세련된 사이드바 인터페이스가 필요한 프로젝트

고려 사항

높은 수준의 맞춤형 디자인을 위해 추가 스타일링이 필요할 수 있습니다
매우 큰 탐색 목록에 대한 성능 영향
완전한 UI 프레임워크에 비해 내장 테마 옵션이 제한적
고급 사용을 위해서는 Flutter 레이아웃 시스템에 대한 이해가 필요합니다
매우 높은 주파수의 상태 변경에 최적화되지 않음

원본 README

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

SidebarX 🔥

Flutter multiplatform navigation sidebar / side navigationbar / drawer widget

Show some ❤️ and star the repo to support the project!

Mobile	Desktop	Web

Getting started

Follow these steps to use this package

Add dependency

dependencies:
  sidebarx: ^0.17.2

Add import package

import 'package:sidebarx/sidebarx.dart';

Easy to use

The package is designed with maximum adaptation to large screens.
Therefore, adding a widget to your screen will be very simple.

    Scaffold(
      body: Row(
        children: [
          SidebarX(
            controller: SidebarXController(selectedIndex: 0),
            items: const [
              SidebarXItem(icon: Icons.home, label: 'Home'),
              SidebarXItem(icon: Icons.search, label: 'Search'),
            ],
          ),
          // Your app screen body
        ],
      ),
    )

Use with small mobile screens

On small screens and mobile devices, you can use the ready-made Sidebar widget as your application's drawer for excellent UX.
Otherwise, leave the code unchanged and get the same experience

    Scaffold(
      drawer: SidebarX(
        controller: SidebarXController(selectedIndex: 0, extended: true),
        items: const [
          SidebarXItem(icon: Icons.home, label: 'Home'),
          SidebarXItem(icon: Icons.search, label: 'Search'),
        ],
      ),
      body: const Center(child: Text('Your app body')),
    )

Additional information

The project is under development and ready for your pull-requests and issues 👍
Thank you for support ❤️

Thanks to all contributors of this package

For help getting started with 😍 Flutter, view [online documentation](https://flutter.dev/docs), which offers tutorials, samples, guidance on mobile development, and a full API reference.

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

패키지 설치