flutter pub add flutter_flip_card根據套件公開資料產生的選型評估，僅供參考。
一個 Flutter 套件，可實現翻轉卡片動畫，讓使用者透過平滑的翻轉效果揭露隱藏內容，例如產品詳情。適用於資訊分層顯示的互動式介面，支援 Android、iOS、Web、macOS、Windows 與 Linux 多個平台。此元件輕量且易於整合，適合電商應用、作品集或任何需要吸引人過渡效果的介面。
以下為關聯原始碼儲存庫的 README 原文快照，最新內容請造訪原始碼儲存庫。
A widget that does transition between two children in a flipping manner.
| FlipCard | GestureFlipCard |
|---|---|
 |
 |
To use flutter_flip_card, first start by importing the package.
import 'package:flutter_flip_card/flutter_flip_card.dart';
FlipCard A component that provides a flip card animation
GestureFlipCard A component that provides a gsture(Swipe) flip card animation
FlipCard(
rotateSide: RotateSide.bottom,
onTapFlipping: false, //When enabled, the card will flip automatically when touched.
axis: FlipAxis.horizontal,
controller: con1,
frontWidget: Center(
child: Container(
height: 200,
width: 140,
child: Image.asset(
'image/01.png',
fit: BoxFit.fitHeight)
)
),
backWidget: Container(
height: 200,
width: 140,
child: Image.asset(
`'image/02.jpg',
fit: BoxFit.fitHeight)
)
)
final controller = FlipCardController();
// Flip the card programmatically
controller.flipcard();
GestureFlipCard(
animationDuration: const Duration(milliseconds: 300),
axis: FlipAxis.horizontal,
controller:cong // used to ccontrol the Gesture flip programmatically
enableController : false // if [True] if you need flip the card using programmatically
frontWidget: Center(
child: Container(
width: 300,
height: 200,
child: Image.asset(
'image/011.jpg',
fit: BoxFit.contain,
),
),
),
backWidget: Container(
width: 300,
height: 200,
child: Image.asset(
'image/11.jpg',
fit: BoxFit.contain,
),
),
),
Passionate #Flutter, #Android Developer. #UI Designer.
Please open an issue if you find any bugs.
You like the package ? Buy me a coffee :)
