canvas.js
1.04 KB
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
Page({
onReady: function () {
this.position = {
x: 150,
y: 150,
vx: 2,
vy: 2
}
this.drawBall()
this.interval = setInterval(this.drawBall, 17)
},
drawBall: function () {
var p = this.position
p.x += p.vx
p.y += p.vy
if (p.x >= 300) {
p.vx = -2
}
if (p.x <= 7) {
p.vx = 2
}
if (p.y >= 300) {
p.vy = -2
}
if (p.y <= 7) {
p.vy = 2
}
var context = wx.createContext()
function ball(x, y) {
context.beginPath(0)
context.arc(x, y, 5, 0, Math.PI * 2)
context.setFillStyle('#1aad19')
context.setStrokeStyle('rgba(1,1,1,0)')
context.fill()
context.stroke()
}
ball(p.x, 150)
ball(150, p.y)
ball(300 - p.x, 150)
ball(150, 300 - p.y)
ball(p.x, p.y)
ball(300 - p.x, 300 - p.y)
ball(p.x, 300 - p.y)
ball(300 - p.x, p.y)
wx.drawCanvas({
canvasId: 'canvas',
actions: context.getActions()
})
},
onUnload: function () {
clearInterval(this.interval)
}
})