自定义路由翻转,渐变,左右滑动

方法如下:

  1. 首先继承 PageRouteBuilder ,重写方法
  2. 将MaterialPageRoute改为showSearch

  

import 'package:flutter/material.dart';

class animation_route extends PageRouteBuilder {

  final Widget widget;

  animation_route(this.widget)
: super(
transitionDuration: const Duration(milliseconds: 500), //设置动画时长500毫秒
pageBuilder: (
BuildContext context,
Animation<double> animation1,
Animation<double> animation2){
return widget;
},
transitionsBuilder: (
BuildContext context,
Animation<double> animation1,
Animation<double> animation2,
Widget child
){
//渐变过渡
// return FadeTransition(//渐变过渡 0.0-1.0
// opacity: Tween(begin: 0.0, end: 1.0).animate(CurvedAnimation(
// parent: animation1, //动画样式
// curve: Curves.fastOutSlowIn, //动画曲线
// )),
// child: child,
// );
//翻转缩放
// return RotationTransition(
// turns: Tween(begin: 0.0, end: 1.0).
// animate(
// CurvedAnimation(
// parent: animation1,
// curve: Curves.fastOutSlowIn,
// )
// ),
// child: ScaleTransition(
// scale: Tween(begin: 0.0, end: 1.0).
// animate(CurvedAnimation(parent: animation1, curve: Curves.fastOutSlowIn)),
// child: child,
// ),
// );
//左右滑动
return SlideTransition(
position: Tween<Offset>(
begin: Offset(-1.0, 0.0),
end: Offset(0.0, 0.0)
)
.animate(CurvedAnimation(parent: animation1, curve: Curves.fastOutSlowIn)),
child: child,
);
} ); }

  使用方法

Navigator.push(context, MaterialPageRoute(builder: (context){ return test(); })); 改为Navigator.push(context, animation_route(test()));

Flutter自定义路由PageRouteBuilder的更多相关文章

  1. MVC系列——MVC源码学习:打造自己的MVC框架(三:自定义路由规则)

    前言:上篇介绍了下自己的MVC框架前两个版本,经过两天的整理,版本三基本已经完成,今天还是发出来供大家参考和学习.虽然微软的Routing功能已经非常强大,完全没有必要再“重复造轮子”了,但博主还是觉 ...

  2. Mvc自定义路由让支持.html的格式

    前言 在大多时候,我们都需要自定义路由,当我们设置为/list/1.html的时候,有的时候会出现以下异常. routes.MapRoute( "category", // 路由名 ...

  3. YbSoftwareFactory 代码生成插件【二十四】:MVC中实现动态自定义路由

    上一篇介绍了 公文流转系统 的实现,本篇介绍下MVC下动态自定义路由的实现. 在典型的CMS系统中,通常需要为某个栏目指定个友链地址,通过指定友链地址,该栏目的地址更人性化.方便记忆,也有利用于搜索引 ...

  4. Web API配置自定义路由

    默认访问Web API时,是无需指定method名.它会按照默认的路由来访问.如果你的Web API中出现有方法重载时,也许得配置自定义路由: 标记1为自定义路由,标记2为默认路由,需要把自定义路由排 ...

  5. WPF:自定义路由事件的实现

    路由事件通过EventManager,RegisterRoutedEvent方法注册,通过AddHandler和RemoveHandler来关联和解除关联的事件处理函数:通过RaiseEvent方法来 ...

  6. ASP.NET MVC 自定义路由中几个需要注意的小细节

    本文主要记录在ASP.NET MVC自定义路由时,一个需要注意的参数设置小细节. 举例来说,就是在访问 http://localhost/Home/About/arg1/arg2/arg3 这样的自定 ...

  7. ruby -- 进阶学习(十)自定义路由中:new, :collection和:member的区别

    学习链接:http://rubyer.me/blog/583/ RESTful风格的路由动词默认有7个(分别为:index, show, create, new, edit, update, dest ...

  8. CI 框架中的自定义路由规则

    在 CI 框架中,一个 URL 和它对应的控制器中的类以及类中的方法是一一对应的,如: www.test.com/user/info/zhaoyingnan 其中 user 对应的就是控制器中的 us ...

  9. Asp.net MVC 自定义路由在IIS7以上,提示Page Not Found 解决方法

    受限确保自定义路由在开发服务器上Ok! 然后在web.config的<webserver>节点下增加如下配置就好了.   1: <system.webServer> 2: &l ...

随机推荐

  1. .NET Core微服务之基于Apollo实现统一配置中心

    Tip: 此篇已加入.NET Core微服务基础系列文章索引 一.关于统一配置中心与Apollo 在微服务架构环境中,项目中配置文件比较繁杂,而且不同环境的不同配置修改相对频繁,每次发布都需要对应修改 ...

  2. 前端笔记之JavaScript面向对象(一)Object&函数上下文&构造函数&原型链

    一.对象(Object) 1.1 认识对象 对象在JS中狭义对象.广义对象两种. 广义:相当于宏观概念,是狭义内容的升华,高度的提升,范围的拓展.狭义:相当于微观概念,什么是“狭”?因为内容狭隘具体, ...

  3. Java进阶篇设计模式之三 ----- 建造者模式和原型模式

    前言 在上一篇中我们学习了工厂模式,介绍了简单工厂模式.工厂方法和抽象工厂模式.本篇则介绍设计模式中属于创建型模式的建造者模式和原型模式. 建造者模式 简介 建造者模式是属于创建型模式.建造者模式使用 ...

  4. .Net Core Web Api 上传女朋友的照片到微软云Azure Storage

    前言 实现一个Web Api,把女朋友照片保存到Azure云的storage里. Image Upload Api 在对应的Api Controller里,加上attribute: [Consumes ...

  5. 卷积神经网络CNN

    卷积神经网络,在图像识别和自然语言处理中有很大的作用,讲cnn的中文博客也不少,但是个人感觉说的脉络清晰清晰易懂的不多. 无意中看到这篇博客,写的很好,图文并茂.建议英文好的直接去看原文.英文不好的就 ...

  6. C# 因缺少CategoryName,而未能初始化 的解决办法

    群里一小伙伴在开发APP时遇到了问题,便截图提问 一.傻瓜式解决办法: 删除: ((System.ComponentModel.ISupportInitialize)(this.performance ...

  7. sql server 生成数据库字典 sql语句

    SELECT TOP 100 PERCENT --a.id,          CASE WHEN a.colorder = 1 THEN d.name ELSE '' END AS 表名,      ...

  8. C# 插入文本框到PPT幻灯片

    概述 在文本框中我们可以实现的操作有很多,如插入文字.图片.设置字体大小.颜色.文本框背景填充.边框设置等.下面的示例中,将介绍通过C# 在PPT幻灯片中插入幻灯片的方法. 示例中包含了以下要点: 插 ...

  9. css控制元素 水平垂直居中

    控制元素居中核心代码为 position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; css: /* 容器 */ .w ...

  10. 【土旦】Vue+WebSocket 实现长连接

    1.websocket 连接代码 created() { this.initWebsocket() }, methods: { // 初始化websocket initWebsocket() { le ...