transformer_page_view

Flutter 的 Page Transformer。

非常易于使用

import 'package:transformer_page_view/transformer_page_view.dart';

...

new TransformerPageView(
loop: true,
transformer: new AccordionTransformer(),
itemBuilder: (BuildContext context, int index) {
  return new Container(
    color: list[index%list.length],
    child: new Center(
      child: new Text("$index",style: new TextStyle(fontSize: 80.0,color: Colors.white),),
    ),
  );
},
itemCount: 3)

与 PageView.builder 几乎相同，只需为 TransformerPageView 指定一个 transformer，
它是一个 PageTransformer 的子类

展示案例

视差

welcome

基础

AccordionTransformer

在此处 查看代码

ThreeDTransformer

在此处 查看代码

ScaleAndFadeTransformer

在此处 查看代码

ZoomInPageTransformer

在此处 查看代码

ZoomOutPageTransformer

在此处 查看代码

DepthPageTransformer

在此处 查看代码

入门

安装

添加


transformer_page_view:

到您的 pubspec.yaml 文件，然后运行

flutter packages get

在您项目的根目录。

基本用法

参数 默认值 描述
scrollDirection Axis.horizontal 如果设置了 Axis.horizontal，则滚动视图的子项将水平排列成一列，而不是垂直排列成一列。
loop 假 设置为 true 以启用连续循环模式。
index 无 初始幻灯片的索引号。如果未设置，则由小部件本身控制，否则由 itemBuilder 返回的另一个小部件控制。
onPageChanged void onPageChanged(int index) 当用户滑动时，会调用此函数并传入新的索引。
duration new Duration(milliseconds:300) 每次事务动画花费的毫秒数
transformer 无 此小部件最重要的属性，它返回一个基于参数 widget 的 transformed 小部件。如果值为 null，则必须指定 itemBuilder。
项目数 无 总项目数
itemBuilder 无 一个返回基于索引的小部件的函数，如果为 null，则必须指定 transformer。

内置视差

我们提供 3 种内置视差效果，可处理颜色、图像和容器。

ParallaxColor

ParallaxColor 处理颜色变换，控制颜色从一种到另一种的变换。

ParallaxImage

ParallaxImage 处理图像，其速度比 PageView 慢。

ParallaxContainer

ParallaxContainer 处理文本或其他内容，其速度比 PageView 快。

这 3 种内置视差效果都用于 PageTransform 的子类，将这些视差效果组合在一起，我们可以创造出非常酷的东西。

beauty

GitHub

https://github.com/best-flutter/transformer_page_view