zoukankan      html  css  js  c++  java
  • js动画杂记

    在画布上做动画

    方法有

    setIntervel(function(){},time);

    setTimeout(function(){},time);

    新方法

    window.requestAnimationFrame(function(){});

    动画一般是执行同一个绘画函数多遍(其中每一遍执行会有一些参数不同 代表透明度的,位置的,大小的等等的参数)

    这意味着要实现函数的重复执行

    setInterval本身就是每隔time执行一次function,可以直接用了

    而setTimeout是过了time后执行一次function,也就是只执行一次

    而window.requestAnimation是现在的新方法,我目前不是很了解它的意思,但是同样只执行一次

    之前对于如何实现重复绘画,我百思不得其解,

    现在想来真是太傻了...

    setTimeout 和 window.requestAnimation是一样的,

    直接调用函数,然后在函数末尾调用setTimeout 或window.requestAnimation  

    那么问题又来了,重复动画如何取消呢?

    使用方法前先取个名字

    var ID = setInterval();

    要结束就用下面这个

    clearInerval(ID);

    setTimeout 和 window.requestAnimation 也同理,它们的取消方法如下:

    clearTimeout(ID);

    cancelAnimationFrame(ID);

    reverse()和save()很重要
    使用方法就是所有绘画开始之前先save()
    每绘画完一帧就执行一次
    ctx.reverse();save()

    如果改变了画布参数,画下一个图形时就要进行一次ctx.reverse();save(),或者手动把参数改回来

  • 相关阅读:
    近期学习情况
    java连接数据库的两种方法总结
    近两个星期学习成果
    云笔记第一阶段总结
    圆面积
    C++计算器项目的初始部分
    C++视频课程
    A+B Format
    大一下学期的自我目标
    Kohana的请求流
  • 原文地址:https://www.cnblogs.com/fy-xjw/p/9846433.html
Copyright © 2011-2022 走看看