Flutter开发 - 手势和动画

点击事件和双击事件

在Widget标签外面包一层GestureDetector或InkWell即可让Widget监听手势了。

GestureDetector(
  onTap: () {},
  onDoubleTap: () {},
),
InkWell(
  onTap: () {},
  onDoubleTap: () {},
)

从右向左的转场动画

class AnimationPageRoute extends PageRouteBuilder {
  /// 进入的页面
  Widget page;

  AnimationPageRoute({
    required this.page,
    Duration transitionDuration = const Duration(milliseconds: 300),
    bool opaque = true,
    bool barrierDismissible = false,
    bool maintainState = true,
  })  : assert(page != null, '参数[enterPage]不能为空!'),
        super(
          transitionDuration: transitionDuration,
          pageBuilder: (BuildContext context, Animation<double> animation,
                  Animation<double> secondaryAnimation) =>
          page,
          transitionsBuilder: (BuildContext context,
                  Animation<double> animation,
                  Animation<double> secondaryAnimation,
                  Widget child) =>
              SlideTransition(
                  position:
                  Tween<Offset>(begin: Offset(1, 0), end: Offset.zero).animate(animation),
                  child: page),
          opaque: opaque,
          maintainState: maintainState,
        );
}

使用路由进行跳转。

Navigator.of(context).push(AnimationPageRoute(
    page: YourWidget());

这样打开新页面就是从右向左进入屏幕的了。