zoukankan      html  css  js  c++  java
  • [GIF] The Phase Property in GIF Loop Coder

    In this lesson, we look at one of the most powerful features in GIF Loop Coder, the phase property, which allows you to let different objects run animations shifted in time.

    function onGLC(glc) {
        glc.loop();
    //     glc.size(400, 400);
    //     glc.setDuration(5);
    //     glc.setFPS(20);
        //glc.setMode('single');
        glc.setEasing(false);
        var list = glc.renderList,
            width = glc.w,
            height = glc.h,
            color = glc.color;
    
        // your code goes here:
    
        glc.styles.backgroundColor = "black";
    
        for(var i = 0; i < 1000; i++){
    
            list.addCircle({
                x: Math.random() * width,
                y: Math.random() * height,
                radius: [0.25,1],
                fillStyle: "white",
                phase: Math.random() + 10
            })
        }
        
        list.addText({
            x: width / 2,
            y: height / 2 + 20,
            fontSize: [18, 24],
            text: "Tecnotree Way of Work (WoW)",
            fillStyle: ["white", "yellow"],
        })
    }
    
       

    function onGLC(glc) {
        glc.loop();
    //     glc.size(400, 400);
    //     glc.setDuration(5);
    //     glc.setFPS(20);
        //glc.setMode('single');
        //glc.setEasing(false);
        var list = glc.renderList,
            width = glc.w,
            height = glc.h,
            color = glc.color;
    
        // your code goes here:
    
        var res = 10;
        for(var y = 0; y < height; y += res){
            for(var x = 0; x < width; x +=res){
                var dx = x - width / 2,
                    dy = y - height / 2,
                    dist = Math.sqrt(dx * dx+dy*dy);
                
                list.addCircle({
                    translationX: x,
                    translationY: y,
                    x: res / 2,
                    y: res / 2,
                    radius: res / 2,
                    fillStyle: ["red", "yellow"],
                    phase: -dist / 100
                })
            }
        }
    }
    
       

  • 相关阅读:
    javascript中this使用规律
    call和apply的作用和不同
    SVN的标准目录结构:trunk、branches、tags
    SVN 多人修改,如何管理 关于版本的问题
    公司考勤系统项目设计
    CDI Features
    Java Design Pattern
    公司考勤系统设计文件
    spring( history Design Philosophy )
    JSON/xml
  • 原文地址:https://www.cnblogs.com/Answer1215/p/5819442.html
Copyright © 2011-2022 走看看