链接

首先通过spring函数Motion的style参数,

传入Motion Component,

计算style的过程:

          const style = lastPressed === i && isPressed
? {
scale: spring(1.1, springConfig),
shadow: spring(16, springConfig),
y: mouse,
}
: {
scale: spring(1, springConfig),
shadow: spring(1, springConfig),
y: spring(order.indexOf(i) * 100, springConfig),
};

其中被选中的y与mouse一致,shadow与scale不同

未被选中的y值根据排序来决定

ReactMotion Demo8 分析的更多相关文章

  1. webpack——阮一峰webpackDemo分析

    首先上交阮一峰老师的github地址,一共有15个demo,我们一个一个的进行分析,结合上文所学的知识! 其中有一些内容,我做了修改,我是先看一遍然后从新敲了一遍. https://github.co ...

  2. node-java的使用及源码分析

    上篇文章简单提了下node调用java的方法但也只属于基本提了下怎么输出helloworld的层度,这次将提供一些案例和源码分析让我们更好地了解如何使用node-java库. 前置知识: 1.桥接模式 ...

  3. alias导致virtualenv异常的分析和解法

    title: alias导致virtualenv异常的分析和解法 toc: true comments: true date: 2016-06-27 23:40:56 tags: [OS X, ZSH ...

  4. 火焰图分析openresty性能瓶颈

    注:本文操作基于CentOS 系统 准备工作 用wget从https://sourceware.org/systemtap/ftp/releases/下载最新版的systemtap.tar.gz压缩包 ...

  5. 一起来玩echarts系列(一)------箱线图的分析与绘制

    一.箱线图 Box-plot 箱线图一般被用作显示数据分散情况.具体是计算一组数据的中位数.25%分位数.75%分位数.上边界.下边界,来将数据从大到小排列,直观展示数据整体的分布情况. 大部分正常数 ...

  6. 应用工具 .NET Portability Analyzer 分析迁移dotnet core

    大多数开发人员更喜欢一次性编写好业务逻辑代码,以后再重用这些代码.与构建不同的应用以面向多个平台相比,这种方法更加容易.如果您创建与 .NET Core 兼容的.NET 标准库,那么现在比以往任何时候 ...

  7. UWP中新加的数据绑定方式x:Bind分析总结

    UWP中新加的数据绑定方式x:Bind分析总结 0x00 UWP中的x:Bind 由之前有过WPF开发经验,所以在学习UWP的时候直接省略了XAML.数据绑定等几个看着十分眼熟的主题.学习过程中倒是也 ...

  8. 查看w3wp进程占用的内存及.NET内存泄露,死锁分析

    一 基础知识 在分析之前,先上一张图: 从上面可以看到,这个w3wp进程占用了376M内存,启动了54个线程. 在使用windbg查看之前,看到的进程含有 *32 字样,意思是在64位机器上已32位方 ...

  9. ZIP压缩算法详细分析及解压实例解释

    最近自己实现了一个ZIP压缩数据的解压程序,觉得有必要把ZIP压缩格式进行一下详细总结,数据压缩是一门通信原理和计算机科学都会涉及到的学科,在通信原理中,一般称为信源编码,在计算机科学里,一般称为数据 ...

随机推荐

  1. 连通 OR 不连通(NOJ 1044)

    比赛描述 给定一个无向图,一共n个点,请编写一个程序实现两种操作: D x y 从原图中删除连接x,y节点的边. Q x y 询问x,y节点是否连通 输入 第一行两个数n,m(5<=n<= ...

  2. Codeforces983D. Arkady and Rectangles

    $n \leq 100000$个矩形,一个一个覆盖在坐标系上,每个颜色都不一样,问最后能看到几种颜色. 由于后面的颜色可以覆盖前面的颜色,可以把颜色与时间联系上,第$i$个矩形颜色$i$来把时间维变成 ...

  3. Perl语言入门--1--perl的包安装

    A.  手工安装 从CPAN下载了DBI模块1.13版的压缩文件DBI-1.13.tar.gz.假设放在/usr/local/src(一般需要编译安装的软件,都放在此目录下安装). # cd /usr ...

  4. ci框架——修改分页的显示样式

    修改ci框架分页的显示样式 用过ci框架的都知道,ci框架自带的分页样式是1,2下一页,在最开始刷新页面现实的时候如果页面不够多的话,那么首页和末页是不显的,这是ci框架的一个缺点, 这个时候需要我们 ...

  5. android实现通知栏消息

    一.原理 消息推送有两种,一种是客户端定时直接到服务器搜索消息,如果发现有新的消息,就获取消息下来:另一种是服务器向客户端发送消息,也就是当有信息消息时,服务器端就会向客户端发送消息. 二.步骤(代码 ...

  6. android控件-images

    1.imageButton 图片按钮 <ImageButton android:id="@+id/imageButton" android:layout_width=&quo ...

  7. luogu P1032 字串变换

    题目描述 已知有两个字串 A, B 及一组字串变换的规则(至多6个规则): A1 -> B1 A2 -> B2 规则的含义为:在 A$中的子串 A1 可以变换为 B1.A2 可以变换为 B ...

  8. String、StringBuffer和StringBuilder的差别

    String.StringBuffer和StringBuilder的差别 1.String类是不可变类,即一旦一个String对象被创建后.包括这个对象中的字符序列是不可改变的 2.在字符串拼接的过程 ...

  9. 有方向的运动js

    <!doctype html> <html lang="en"> <head>     <meta charset="UTF-8 ...

  10. Python奇技

    本文目录 1. 显示有限的接口到外部 2. with的魔力 3. filter的用法 4. 一行作判断 5. 装饰器之单例 6. staticmethod装饰器 7. property装饰器 8. i ...