线条飞鸟动画-理解动画的三个关键变换-平移、缩放、旋转

清华大佬耗费三个月吐血整理的几百G的资源,免费分享!....>>>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
-- 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