liquid_swipe_flutter

此存储库包含Liquid Swipe的源代码。Liquid swipe是用于实现堆叠容器的惊人液体般滑动效果的揭示裁剪器,灵感来自Cuberto的liquid swipe和IntroViews。

example-1

another

示例APK

从发布版本下载示例APK,如图所示。

Get it from Github Releases

入门

  • 将此添加到您的pubspec.yaml

    dependencies:
    liquid_swipe: ^1.2.0
    
    
  • 从Pub获取软件包

    flutter packages get
    
  • 在您的文件中导入它

    import 'package:liquid_swipe/liquid_swipe.dart';
    

用法

  • Liquid Swipe只需要一个containers列表。它旨在为开发者提供灵活性,让他们通过它设计自己的视图。
final pages = [
   Container(...),
   Container(...),
   Container(...),
 ];
  • 现在只需将这些页面传递给LiquidSwipe小部件。
 @override
 Widget build(BuildContext context) {
   return new MaterialApp(
     home: Builder(
         builder: (context) =>
             LiquidSwipe(
                 pages: pages
             )),
   );
 }

属性

属性 数据类型 描述 默认值 注释
pages List<Container> 设置页面/视图/容器 Null 一个页面可以包含任何内容,请参阅示例
fullTransitionValue 双精度 设置完成滑动所需的滚动距离或灵敏度。 400.0 此过渡值可用于增加或减少滑动的灵敏度。100.0将使滑动非常快,只需轻微拖动。
initialPage 整数 设置初始页面 0 不应大于等于页数或小于0
enableSlideIcon 布尔值 用于在右侧启用滑动图标,指示波浪的起始位置。 在屏幕右侧提供ios风格的箭头。稍后可能会对其进行修改。
slideIconWidget Widget 创建您自己的图标并在此处添加 Icon(Icons.arrow_back_ios) 您可以从Icons包中使用图标。感谢PR #10
positionSlideIcon 双精度 在屏幕右侧的y轴上定位您的图标。 0.54 范围从-1到1,-1表示最顶部,1表示最底部。很快就会添加x轴位置(如果需要!)。
enableLoop 布尔值 启用或禁用页面循环。 如果您不想让页面循环,请使用此属性。
waveType 波形类型 选择您想要的揭示类型。 WaveType.liquidReveal 您可以使用circularReveal,更多即将推出。如果自动导入不起作用,请导入Helpers.dart文件。

GitHub

https://github.com/iamSahdeep/liquid_swipe_flutter