zoukankan      html  css  js  c++  java
  • 简单动画的制作

    概念:

    在Canvas画布中制作动画相对来说比较简单,实际上就是一个不断擦除、重绘、擦除、重绘的过程,具体步骤如下:

    (1)预先编写好用来会吐的函数,在该函数中用clearRect方法将画布整体或局部擦除。

    (2)使用setInterval方法设置动画的间隔时间。

    setInterval方法为HTML中的固有方法,该方法接受两个参数,第一个参数表示执行动画的函数,第二个参数表示为时间间隔,单位为毫秒。

    在比较复杂的情况下,我们也可以在清楚与绘制动画的当中插入当前绘制状态的保存与恢复,变成擦除、保存绘制状态、进行绘制、恢复状态的过程。

    应用:

    var context;
    var width,height;
    var i ;
    function draw(id){
    var canvas=document.getElementById("id");
    if(canvas==null)
    return false;
    scontext = canvas.getContext('2d');
    width = canvas.width;
    height = canvas.height;
    i = 0;
    setInterval(rotate,100);//十分之一秒
    }
    function rotate(){
    context.clearRect(0,0,width,height);
    context.fillStyle = 'red';
    context.fillRect = (i,0,20,20);
    i = i+20;
    }

  • 相关阅读:
    一些内容
    ios开发 xcode6以上安装Alcatraz管理插件
    java锁的深度化-重入锁,读写锁,乐观锁,悲观锁
    并发队列
    并发工具类
    并发编程
    HashMap底层源码剖析
    双列集合map面试题
    单列集合List
    类加载
  • 原文地址:https://www.cnblogs.com/yanyanstyle/p/11374247.html
Copyright © 2011-2022 走看看