expansion_card

패키지 개요

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

expansion_card 패키지는 애니메이션 이미지 배경을 선택적으로 포함하는 접을 수 있는 카드를 제공하는 사용자 정의 가능한 Flutter 위젯입니다. 자주 묻는 질문, 세부 정보 또는 상호작용 섹션과 같은 확장형 콘텐츠를 표시하는 데 이상적입니다. 모든 주요 플랫폼에서 부드러운 애니메이션과 반응형 디자인을 지원합니다. 개발자는 앱의 UI에 맞게 카드의 외관, 동작 및 전환 효과를 조정할 수 있습니다. 이 패키지는 가볍고 기존의 Flutter 프로젝트에 쉽게 통합됩니다.

사용 사례

자주 묻는 질문 섹션 표시
상세 제품 정보 표시
인터랙티브 아코디언 만들기
폼에서 계층적 콘텐츠 표시하기
사용자 온보딩 흐름 개선

주요 기능

사용자 정의 가능한 카드 스타일
애니메이션 이미지 배경
부드러운 전개/접기 전환
크로스 플랫폼 지원
Flutter와의 간편한 통합
사용자 정의 가능한 애니메이션 지속 시간

적합한 대상

인터랙티브 UI를 구축하는 개발자
확장 가능한 콘텐츠 섹션을 필요로 하는 앱
애니메이션 카드 컴포넌트를 찾는 디자이너
다중 플랫폼 대상 프로젝트
동적 콘텐츠를 포함한 UI 중심 애플리케이션

고려 사항

많은 인스턴스가 있는 경우 성능에 영향을 미칠 수 있습니다
이미지 배경 로딩은 신중한 최적화가 필요합니다
애니메이션 설정은 부드러운 UX를 위해 조정되어야 합니다
제한된 내장 접근성 기능
정적 콘텐츠 전용에는 적합하지 않습니다

원본 README

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

Expansion card

This package provides an easy implementation of a Expansion type card where you can also add gif at the background.

How to use

import 'package:expansion_card/expansion_card.dart';

Center(
            child: ExpansionCard(
              background: Image.asset("assets/animations/sleep.gif"),
              title: Container(
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: <Widget>[
                    Text(
                      "Header",
                      style: TextStyle(
                        fontFamily: 'BalooBhai',
                        fontSize: 30,
                        color: Colors.white,
                      ),
                    ),
                    Text(
                      "Sub",
                      style: TextStyle(
                          fontFamily: 'BalooBhai', fontSize: 20, color: Colors.white),
                    ),
                  ],
                ),
              ),
              children: <Widget>[
                Container(
                  margin: EdgeInsets.symmetric(horizontal: 7),
                  child: Text("Content goes over here !",
                      style: TextStyle(
                          fontFamily: 'BalooBhai',
                          fontSize: 20,
                          color: Colors.white)),
                )
              ],
            ));

Custom Usage

There are several options that allow for more control:

Properties	Description
`leading`	Define an action after slidding a button
`background`	provide any image asset file (supports gif also)
`onExpansionChanged`	When the tile starts expanding, this function is called with the value true. When the tile starts collapsing, this function is called with the value false.
`trailing`	A widget to display instead of a rotating arrow icon
`initiallyExpanded`	Specifies if the list tile is initially expanded (true) or collapsed (false, the default)

👍 Contribution

Fork it
Create your feature branch (git checkout -b my-new-feature)
Commit your changes (git commit -m 'Add some feature')
Push to the branch (git push origin my-new-feature)
Create new Pull Request

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

패키지 설치