去回答
路径动画就是你想某个东西按照你预想的路径来运动。比如说一片树叶从树上落下来，具体要怎样落下来，你就可以画一条线作为路径，让树叶沿着线落下来，这就是路径动画。
在这个七夕的主题效果中，小男孩除了沿着一条直线行走外，还会在不同的时间段有不同的速率，除此之外在进出商店与上桥也是非直线的变化，因此需要为人物的路径变化做一个统一的处理方式
我们把小男孩子所有的动作分解一下
注意：小男孩走路范围其实只有一个页面区域，因为父容器是content元素
小男孩不管是往X还是Y轴变化，我们可以做一个比例换算出来，按照百分比的比例去换算实际的距离
例如：走到1/2的位置 ，具体的坐标值的计算就是 ： 实际X轴位置 = 0.5 * 页面宽度 ，同样Y轴的计算也是如此
那么我们可以把人物走路的接口封装下，传递一个想要的距离比，这样就可以很方便的指定走到某一个位置了
为什么这么麻烦？ 因为是自适应布局，分辨率是变化的，所以用百分比的比值比较好定位位置
具体我们可以看右边代码的实现：
我们把代码封装后，只需要设置一个时间，X与Y的一个比例，就可以让目标移动到指定的位置了
var distX = calculateDist('x', 0.5)
var distY = calculateDist('y', 0.5)
walkRun(10000, distX, distY)
这里要注意坐标位是以小孩男的左上角0,0开始的，所以人物的实际位置看起来可能不是在正中间。
请验证，完成请求
由于请求次数过多，请先验证，完成再次请求
打开微信扫码自动绑定
绑定后可得到
使用 Ctrl+D 可将课程添加到书签
举报
实战
实战
实战
实战
实战
