用 Codea 绘制的线条飞鸟动画代码

使用说明:先在 Codea 内新建一个空白项目,把该文件内容拷贝到 main 标签页内,即可运行

使用了 Codea 提供的音效包(需要在 Codea 中点击下载)

截图:

代码如下:

-- main
-- Use this function to perform your initial setup
function setup()

    displayMode(FULLSCREEN)

    x = WIDTH/2
    y = HEIGHT/2
    img = sprite("Cargo Bot:Starry Background")

    -- 第一只 mesh 鸟 -- The 1st mesh bird
    myMeshBird1 = mesh()

    -- 第二只 mesh 鸟 -- The 2nd mesh bird
    myMeshBird2 = mesh()
    myMeshBird2.texCoords = {vec2(0,0),vec2(0,1),vec2(1,1),vec2(0,0),vec2(1,1),vec2(1,0)}
    myMeshBird2.texture = img

    -- 第三只 mesh 鸟 -- The 3rd mesh bird
    myMeshBird3 = mesh()

    -- 用于控制循环的变量 -- variable for loop control
    i, j = 0, 0
    k = 1
    m, n = 1000, 1
    a, b = 255, 1

    parameter.integer("i",0,150,0)
    parameter.integer("j",0,150,0)
    parameter.integer("k",-1,1,1)
    parameter.integer("m",0,2000,1000)
    parameter.integer("n",-5,5,1)
    parameter.integer("a",0,255,255)
    parameter.integer("b",-1,1,1)    

    parameter.integer("l1",100,300,200)
    parameter.integer("h1",100,300,200)
    parameter.integer("l2",10,200,60)
    parameter.integer("h2",0,100,10)    

    -- 三只对象实例鸟 -- Three object instance birds
    myBird1 = Bird(x,y)
    myBird2 = Bird(x+50,y)
    myBird3 = Bird(x,y)
end

-- This function gets called once every frame
function draw()

    -- 用来设置颜色渐变效果 -- Color alpha control
    -- Alpha channel has a maximum of 255
    local alpha = math.min(ElapsedTime * 20%255, 255)
    -- Set tint using tint(grey, alpha)
    tint(255,alpha)                              

    -- 用 tint() 函数控制色彩透明度变化 -- Use tint()
    if alpha == 255 then
        tint(0,alpha)
    elseif alpha == 50 then
        tint(255,alpha)
    end    

    -- 控制翅膀坐标变化 -- control change of wings‘ coords
    -- 若 i 达到最大值,则把步长 k 设置为 -1,i + k 值会递减 -- when i become max, set step k to -1, i+k will decrease
    -- 若 i 达到最小值,则把步长 k 设置为 1,i + k 值会递增  -- when i become min, set step k to 1, i+k will increase
    -- 当 i 最大时调用声音,以保证声音和动作同步   -- load sound while i become max , to make sure sound and motion synchronize
    if i == 150 then
        k = -1
        sound("A Hero‘s Quest:Walk 2 (Short)")
    elseif i == 0 then
        k = 1
    end

    -- 控制缩放 -- contrl scale
    if m == 1500 then n = -1 elseif m == 0 then n = 1 end

    -- 用变量 a,b 直接控制色彩透明度变化 -- use variable a,b to control change of color‘s alpha directly
    if a == 255 then b = -1 elseif a == 50 then b = 1 end

    -- 开始递增或递减 -- start increase or decrease
    i = i + 5 * k
    j = j + 8 * k
    m = m + 2 * n
    a = a + b 

    -- 设置背景色 -- set background color
    background(11, 11, 10, 86)

    -- 设置背景参照物 -- set background object
    pushStyle()
    pushMatrix()
    -- scale(m/500,m/500)
    -- translate(-m,m)
    fill(255, 0, 0, alpha)
    stroke(255, 118, 0, alpha)
    ellipse(500,1250-m,m-350)
    popMatrix()
    popStyle()

    -- 用于三只 mesh 鸟的颜色 -- colors of three mesh birds
    myColor1 = color(255, 255, 0, alpha)
    myColor2 = color(79, 255, 0, a)
    myColor3 = color(79, 2, 100, a)    

    -- 构成飞鸟线条的顶点坐标 -- vertex coords of bird line
    -- vec2 向量 p1(0,0) 为中心点提供坐标 -- vec(0,0) is the central point
    p1 = vec2(0,0)
    -- 组成右边翅膀的顶点 -- vertices of right wing
    -- p2, p3 = vec2(200+i/8,-150+2*j),vec2(60-i/3,10+j/3)
    p2, p3 = vec2(l1+i/8,-150+2*j),vec2(l2-i/3,h2+j/3)
    -- 组成左边翅膀的顶点 -- vertices of left wing
    -- p4, p5 = vec2(-200-i/8,-150+2*j),vec2(-60+i/3,10+j/3)
    p4, p5 = vec2(-200-i/8,-150+2*j),vec2(-60+i/3,10+j/3)

    -- 用这些坐标设置 mesh 的顶点 -- set mesh vertices
    myMeshBird1.vertices = {p1, p2, p3, p1, p4, p5}
    myMeshBird2.vertices = {p1, p2, p3, p1, p4, p5}
    myMeshBird3.vertices = {p1, p2, p3, p1, p4, p5}    

    -- 平移
    translate(3*x/4,3*y/4)

    -- 整体循环缩放全部飞鸟比例,产生鸟群距离变化的感觉 -- total birds loop scale, to feel birds distance changing
    scale(m/1500)

    -- 直接用 line() 函数画的飞鸟 -- use line() draw bird directly
    pushMatrix()
    pushStyle()
    translate(x/2,y)
    scale(3)
    stroke(0, 39, 255, 255)
    strokeWidth(5)

    -- 右边翅膀线条 -- lines of right wing
    line(p1[1],p1[2],p2[1],p2[2])
    line(p1[1],p1[2],p3[1],p3[2])
    line(p3[1],p3[2],p2[1],p2[2])
    -- 左边翅膀线条 -- lines of right wing
    line(p1[1],p1[2],p4[1],p4[2])
    line(p1[1],p1[2],p5[1],p5[2])
    line(p4[1],p4[2],p5[1],p5[2])
    -- 用文字标出飞鸟的编号 -- print bird‘s No.
    fill(0, 51, 255, 255)
    text("零号鸟",p1[1],p1[2])
    text("1",p1[1],p1[2])
    popStyle()
    popMatrix()

    -- 用 class Bird 绘制的对象实例鸟 -- object instance bird drawing with class Bird
    pushMatrix()
    pushStyle()
    -- myBird.deltaX = myBird.deltaX + 5*k
    -- myBird.deltaY = myBird.deltaY + 5*k
    rotate(m)
    scale(0.2)
    myBird1:setColors(myColor)
    myBird1:draw()
    popStyle()
    popMatrix()

    -- 用 class Bird 绘制的对象实例鸟 -- object instance bird drawing with class Bird
    pushMatrix()
    pushStyle()
    rotate(-m)
    scale(0.3)
    myBird2:setColors(myColor)
    myBird2:draw()
    popStyle()
    popMatrix()

    -- 用 class Bird 绘制的对象实例鸟 -- object instance bird drawing with class Bird
    pushMatrix()
    pushStyle()
    rotate(-m)
    scale(0.3)
    myBird3:setColors(myColor2)
    myBird3:draw()
    popStyle()
    popMatrix()

    -- 用 mesh 绘制的一号飞鸟 -- No.1 mesh bird
    pushMatrix()
    pushStyle()
    translate(-x/4,-y/2)
    scale(.8)
    myMeshBird1:setColors(myColor1)
    -- myMeshBird1.shader.time = ElapsedTime*5
    myMeshBird1:draw()
    -- 用文字标出飞鸟的编号  -- print bird‘s No.
    fill(173, 255, 0, 255)
    text("一号鸟",p1[1],p1[2])
    text("1",p1[1],p1[2])
    popStyle()
    popMatrix()

    -- 用 mesh 绘制的二号飞鸟 -- No.1 mesh bird
    pushMatrix()
    pushStyle()
    translate(300,200)
    scale(.5)
    myMeshBird2:setColors(myColor2)
    myMeshBird2:draw()
    -- 用文字标出飞鸟的编号  -- print bird‘s No.
    fill(63, 218, 26, 255)
    text("二号鸟",p1[1],p1[2])
    text("2",p1[1],p1[2])
    popStyle()
    popMatrix()

    -- 用 mesh 绘制的三号飞鸟 -- No.1 mesh bird
    pushMatrix()
    pushStyle()
    translate(30,80)
    scale(2)
    myMeshBird3:setColors(myColor3)
    myMeshBird3:draw()
    -- 用文字标出飞鸟的编号  -- print bird‘s No.
    fill(218, 25, 197, 255)
    text("三号鸟",p1[1],p1[2])
    text("3",p1[1],p1[2])
    popStyle()
    popMatrix()

end

-- Bird class
Bird = class()

function Bird:init(x,y)
    -- you can accept and set parameters here
    -- 最初的位置坐标 -- bird‘s position
    self.x = x
    self.y = y
    -- 最初的坐标偏移量 -- bird‘s offset
    self.deltaX = 0
    self.deltaY = 0 

    self.i1, self.j1 = 0, 0
    self.k1 = 1 

    flag = mesh()   

    myColor = color(55, 172, 172, 255)
    Bird:setColors(myColor)
end

function Bird:draw()
    -- Codea does not automatically call this method

    if self.i1 == 150 then
        self.k1 = -1
    elseif i == 0 then
        self.k1 = 1
    end

    self.i1 = self.i1 + 5 * self.k1
    self.j1 = self.j1 + 8 * self.k1

    self.deltaX = self.i1
    self.deltaY = self.j1

    flag.vertices = {
        vec2(self.x,self.y),
        vec2(self.x + 200 - self.deltaX/8, self.y - 150 + self.deltaY * 2),
        vec2(self.x + 60 - self.deltaX/3, self.y + 10+self.deltaY/3),
        vec2(self.x,self.y),
        vec2(self.x - 200 + self.deltaX/8, self.y - 150 + self.deltaY * 2),
        vec2(self.x - 60 + self.deltaX/3, self.y + 10 + self.deltaY/3),
    }
    -- Bird:setColors(myColor)
    fill(24, 218, 201, 255)
    text("对象鸟",self.x,self.y)
    text("Object Instance Bird",self.x,self.y)
    flag:draw()
end

function Bird:setColors(colors)
    flag:setColors(colors)
end

function Bird:touched(touch)
    -- Codea does not automatically call this method
end

时间: 2024-10-31 06:24:51

用 Codea 绘制的线条飞鸟动画代码的相关文章

HTML5 SVG简单的动态绘制轮廓线条动画插件

walkway是一款非常简单的HTML5 SVG动态绘制轮廓线条动画插件.它支持SVG的path,line 和 polyline元素.walkway使用起来简单方便,可以制作出非常酷的SVG线条动态绘制效果.更好的动态绘制线条插件可以参考:html5 svg线条动态绘制文字轮廓边框动画.HTML5 SVG图形轮廓线条绘制动画插件-vivus 和 html5 svg线条动态绘制iphone边框动画效果. 在线演示:http://www.htmleaf.com/Demo/201501261282.h

Quartz2D常见图形的绘制:线条、多边形、圆

UI高级 Quartz2D http://ios.itcast.cn  iOS学院 掌握 drawRect:方法的使用 常见图形的绘制:线条.多边形.圆 绘图状态的设置:文字颜色.线宽等 图形上下文状态的保存与恢复(图形上下文栈) 图片裁剪 截图 什么是Quartz2D Quartz 2D是一个二维绘图引擎,同时支持iOS和Mac系统 Quartz 2D能完成的工作 Ø绘制图形 : 线条\三角形\矩形\圆\弧等 Ø绘制文字 Ø绘制\生成图片(图像) Ø读取\生成PDF Ø截图\裁剪图片 Ø自定义

Android 应用启动动画代码

requestWindowFeature(Window.FEATURE_NO_TITLE);//设置无标题 setContentView(R.layout.activity_main); getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,WindowManager.LayoutParams.FLAG_FULLSCREEN);//设置全屏 ImageView welcomeImg = (ImageView) findVi

基于jQuery仿搜狐辩论投票动画代码

基于jQuery仿搜狐辩论投票动画代码.这是一款个性的卡通小人正方反方辩论投票特效代码.效果图如下: 在线预览   源码下载 实现的代码. html代码: <script type="text/javascript"> $(document).ready(function () { var a = 500; var b = 130; $("#white").animate({ width: 0, left: "250px" }, 10

ios中layer动画和UIView动画代码总结

kCATransitionFade淡出 kCATransitionMoveIn覆盖原图 kCATransitionPush推出 kCATransitionReveal底部显出来 pageCurl   向上翻一页 pageUnCurl 向下翻一页 rippleEffect 滴水效果 suckEffect 收缩效果,如一块布被抽走 cube 立方体效果 oglFlip 上下翻转效果 #pragma mark UIView 动画 - (IBAction)pressClick1:(id)sender {

IOS 制作动画代码和 设置控件透明度

方式1: //animateWithDuration用1秒钟的时间,执行代码 [UIView animateWithDuration:1.0 animations:^{ //存放需要执行的动画代码 self.iconBtn.frame=CGRectMake(83,85,150,150); self.cover.alpha=0.0;//设置控件的透明度 } completion:^(BOOL finished) { //动画执行完毕后会自动调用这个block内部的代码 [self.cover re

Vectors(2): 绘制优美的路径动画

欢迎Follow我的GitHub, 关注我的CSDN. 时代在发展, 技术在进步, Android的Vector图像的时代已经到来. 在Google的最新支持库v23.2中, AppCompat类已经使用Vector图像, 使得AAR包减少9%, 大约70KB, 惠及所有高版本的应用. 当然我们也可以使用Vector, 瘦身应用. Vector图像是SVG格式在Android的表现形式. SVG图像适应屏幕, 图片较小, 还有很多优点, 参考. 关于Vectors的分析, 主要分为两节: (1)

Android页面的切换动画代码实现

1.项目Src下新建anim包 创建anim包,存放动画xml 2.下一步动画 位移动画 解释-100%p p:代表父窗体,100%:代表整个窗体,-:代码向左移动: 前一页面移出:tran_out.xml(自己创建的要选择translate) <?xml version="1.0" encoding="utf-8"?> <translate xmlns:android="http://schemas.android.com/apk/re

纯CSS3悬停图标旋转导航动画代码

分享一款纯CSS3悬停图标旋转导航动画代码.这是一款鼠标移到图标上动画旋转显示导航菜单.效果图如下: 在线预览   源码下载 实现的代码. html代码: <div id="x_contant"> <a class="xzt1" href="#"><img src="images/xztz_1.png" /></a> <a class="xzt2" hr