形狀不使用非硬編碼參數

當我試圖創建一個使用打字稿一個基本的HTML 5遊戲，但我已經與再現大小非硬編碼的圈遇到麻煩，對HTML 5的畫布渲染。形狀不使用非硬編碼參數

我迄今爲止代碼：

Circle.ts

import { IDrawable } from './../Interfaces/IDrawable'; 
import {BaseShape} from "./BaseShape"; 
export class Circle extends BaseShape implements IDrawable{ 

private _radius : number; 

public get radius(){ 
    return this._radius; 
} 

public set radius(val : number){ 
    this._radius = val; 
} 

constructor(context : CanvasRenderingContext2D,radius : number, x : number, y : number, color : string = "red", lineWidth : number = 2) { 
    super(context , x, y, color, lineWidth); 

} 

public draw =() : void => { 

    this.context.save(); 
    this.context.beginPath(); 
    this.context.strokeStyle = this.color; 
    this.context.lineWidth = this.lineWidth; 
    this.context.arc(this.x, this.y, this.radius, 0, 2 * Math.PI); 
    this.context.stroke();  
    this.context.restore(); 

}

}

Game.ts

import { Circle } from './Shapes/Circle'; 


export default class Game{ 
    private circle : Circle; 

    constructor(private ctx : CanvasRenderingContext2D){ 
     this.circle = new Circle(ctx, 200, 300, 50, "blue", 5); 
    } 

    public Start() : void{ 
     requestAnimationFrame(() => this.Start()); 

     this.ctx.fillStyle = "black"; 
     this.ctx.fillRect(0, 0, 1280, 720); 
     this.circle.draw(); 
}

}

背景渲染很好，但除非我改變線的圓圈將不會呈現在所有：

this.context.arc(this.x, this.y, this.radius, 0, 2 * Math.PI);

和硬編碼的參數。

不知道是什麼問題，嘗試使用箭頭函數draw()並使用常規方法，也嘗試提供上下文作爲draw()的方法參數，結果相同。

來源

2016-11-04 Clanrat

這通常意味着參數是錯誤的類型（通常是字符串，而不是數字），但我猜字體應該抓住？ – Carcigenicate

問題是您將錯誤的參數傳遞給Circle的構造函數。您傳遞的構造函數和值的Se參數。

context: CanvasRenderingContext2D ctx 
radius: number      200 
x: number       300 
y: number       50 
color: string      "blue" 
lineWidth: number     5

我想你已經切換了半徑和座標參數的順序。

來源

2017-02-14 19:27:45 Misaz

形狀不使用非硬編碼參數

回答

相關問題