const {ccclass, property} = cc._decorator;
@ccclass
export default class NewClass extends cc.Component {
graphics : cc.Graphics = null
start () {
this.graphics = this.node.getComponent(cc.Graphics)
this.test()
this.node.scale = 3
}
test(){
let A = cc.v2(0, 0)
let B = cc.v2(10, 50)
let C = cc.v2(100, 0)
let D = cc.v2(90, 90)
this.graphics.strokeColor = cc.Color.RED
this.graphics.moveTo(A.x, A.y)
this.graphics.bezierCurveTo(B.x, B.y, C.x, C.y, D.x, D.y)
this.graphics.stroke()
this.graphics.strokeColor = cc.Color.BLUE
this.graphics.circle(A.x, A.y, 1)
this.graphics.stroke()
this.graphics.strokeColor = cc.Color.YELLOW
this.graphics.circle(B.x, B.y, 1)
this.graphics.stroke()
this.graphics.strokeColor = cc.Color.GREEN
this.graphics.circle(C.x, C.y, 1)
this.graphics.stroke()
this.graphics.strokeColor = cc.Color.GRAY
this.graphics.circle(D.x, D.y, 1)
this.graphics.stroke()
let t = 0.5
let F = this.linear(A, B, t)
let G = this.linear(B, C, t)
let H = this.linear(C, D, t)
let J = this.linear(G, H, t)
let I = this.linear(F, G, t)
let E = this.linear(I, J, t)
this.graphics.strokeColor = cc.Color.ORANGE
this.graphics.moveTo(A.x, A.y)
this.graphics.bezierCurveTo(F.x, F.y, I.x, I.y, E.x, E.y)
this.graphics.stroke()
}
linear(p1, p2, t){
return cc.v2(p1.x + (p2.x - p1.x) * t, p1.y + (p2.y - p1.y) * t)
}
}
代码大概是这样, 图中橘色部分重新绘制就行