flutter pub add overlapped_carousel基于插件公开信息、社区数据与项目使用情况整理的选型参考。
一个 Flutter 包，提供了一个简单的水平重叠轮播图组件，非常适合展示具有视觉吸引力的重叠效果的项目。它支持流畅滚动，并专为需要动态、交互式卡片布局的应用程序设计。该组件轻量且兼容所有主要平台，包括 Android、iOS、Web、macOS、Windows 和 Linux。非常适合以现代、引人入胜的方式展示图片、产品或内容。
以下为关联源码仓库的 README 原文快照，最新内容请访问源码仓库。
A horizontal overlapped carousel widget. The center widget will be at the top of the stack.
| Demo 1 | Demo 2 |
|---|---|
 |
 |
Add overlapped_carousel: ^1.1.0 to your pubspec.yaml dependencies. And import it:
import 'package:overlapped_carousel/overlapped_carousel.dart';
Simply add a OverlappedCarousel widget with required params.
@override
Widget build(BuildContext context) {
var screenWidth = MediaQuery.of(context).size.width;
var screenHeight = MediaQuery.of(context).size.height;
return Scaffold(
backgroundColor: Colors.blue,
//Wrap with Center to place the carousel center of the screen
body: Center(
//Wrap the OverlappedCarousel widget with SizedBox to fix a height. No need to specify width.
child: SizedBox(
height: min(screenWidth / 3.3 * (16 / 9),screenHeight*.9),
child: OverlappedCarousel(
widgets: widgets, //List of widgets
currentIndex: 2,
onClicked: (index) {
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(
content: Text("You clicked at $index"),
),
);
},
// To obscure or blur cards not in focus use the obscure parameter.
obscure: 0.4,
// To control skew angle
skewAngle: 0.25,
),
),
),
);
}
暂无相关数据。