oCanvas 자습서 학습 요약 (2)

3889 단어
1、Core
코어는 전체 oCanvas 대상에 create() 방법을 사용하여 만들어진 oCanva Core 솔리드입니다.
2. Core 엔티티에 포함된 모듈
애니메이션: 애니메이션, 보통 어떤 일들이 촉발하는 간단한 애니메이션입니다.
background: 배경입니다. canvas의 배경을 처리하는 데 사용됩니다.
디스플레이: 추가된 전시 대상을 모두 포함합니다.호출display.rectangle (settings) 은 새로운 직사각형 대상을 되돌려줍니다.
draw: canvas의 모든 재그림 작업을 처리합니다.
이벤트: 이벤트, 모든 관련 이벤트를 처리하고bind() 방법을 관리하는 호출.
키보드: 키보드입니다. 모든 키보드 이벤트를 처리합니다.
mouse: 마우스, 모든 마우스 이벤트를 처리합니다.
scenes: 처리 응용의 다른 상태입니다.
스타일: 스타일, 내부 방법에 사용되는 스타일에 대한 처리를 합니다.
timeline: 타임라인, 주 순환을 처리합니다.
tools: 다른 방법으로 사용할 수 있는 방법입니다.그것은 포인터가 대상 안에 있는지, 어떤 것이 사건이 작용할 때 반드시 필요한지 발견하는 데 사용된다.
터치: 터치, 모든 터치 사건을 처리합니다.
3. 코어의 속성
children: Array, 핵심 실체에 직접 추가된 모든 대상의 목록입니다.
Height: Number, 픽셀 형식의 canvas 높이. 이 값을 설정하면 canvas의 크기를 다시 설정하고 모든 대상을 다시 그립니다.
width: Number, 픽셀 형식의 canvas 너비
id: Number, 전역의 oCanvas 객체에 있는 핵심 엔티티의 ID. oCanvas.canvasList는 모든 실체의 하나의 그룹입니다. 이 그룹의 ID는 실체가 이 그룹의 인덱스 위치입니다.
pointer: Object, 사용 중인 포인터의 참조입니다.또한 터치 장치와 마우스를 클릭하는 것이다.
settings: Object, oCanvas가 어떻게 작동하는지 제어하는 설정 속성 대상.다음과 같은 속성이 있습니다.
    
canvas:String 또는 HTMLCanvasObject
    
    background : String. 참고: oCanvas에서만 가능합니다.create () 방법의 settings 매개 변수에 지정됩니다.
    
    clearEachFrame : Boolean
    
    drawEachFrame : Boolean
    
fps: Number, 기본값 30
    
    plugins : Array
    
    disableScrolling : Boolean
4、addChild(object [, redraw])
전송된 대상을 canvas에 추가하면 모든 것을 다시 그립니다.핵심 실체 자체로 돌아가다.
참조:
object: displayObject, 이것은 기본 클래스 displayObjecti에서 계승된 대상입니다.미리 정의된 디스플레이 대상이거나register () 방법으로 만든 사용자 정의 디스플레이 대상일 수 있습니다.
redraw:Boolean(since version 2.0.0),false로 설정하면 canvas는 더 이상 대상이 canvas에 추가된 후에 바로 다시 그립니다.이 방법은 많은 대상을 동시에 추가하는 데 사용될 수 있지만, 추가가 끝난 후에 다시 그릴 때만 사용합니다.
예:
var canvas = oCanvas.create({
    canvas: "#canvas"
});
var rectangle = canvas.display.rectangle({
    x: 77,
    y: 74,
    width: 200,
    height: 100,
    fill: "#000"
});
canvas.addChild(rectangle);

5、clear(keepBackground)
canvas에 있는 모든 대상을 지우고keepBackground에 들어가면true가 되어 canvas의 배경색을 비우지 않습니다.핵심 실체 자체로 돌아가다.
예:
var canvas = oCanvas.create({
    canvas: "#canvas",
    background: "#ccc"
});
var button_keep = canvas.display.rectangle({
    x: 30,
    y: 80,
    width: 132,
    height: 100,
    fill: "#000"
}),
button_clear = button_keep.clone({
    x: 192
});
canvas.addChild(button_keep);
canvas.addChild(button_clear);
button_keep.bind("click tap", function () {
    canvas.clear(); // true is the default
});
button_clear.bind("click tap", function () {
    canvas.clear(false);
});

6、destroy()
코어 엔티티를 제거하여 메모리를 정리합니다.이 방법은 우선 핵심 실체를 리셋한 다음에 모든 DOM 이벤트 프로세서를 제거하고oCanvas에서canvasList 목록에서 제거됩니다.
7、redraw()
canvas에 추가된 모든 대상을 다시 그립니다.draw 모듈 Redraw () 방법의 빠른 원형 방법입니다.
예:
var canvas = oCanvas.create({
    canvas: "#canvas",
    background: "#ccc"
});
var button = canvas.display.rectangle({
    x: 77,
    y: 74,
    width: 200,
    height: 100,
    fill: "#000"
});
canvas.addChild(button);
button.fill = "#999";
button.bind("click tap", function () {
    canvas.redraw();
});

8、removeChild(object [, redraw])
canvas에서 전송된 대상을 제거하면 기본적으로 Redraw를 터치합니다.만약 지금까지 이 대상이 없었다면 어떤 일도 일어나지 않았을 것이고, 방법은 평소대로 핵심 실체로 돌아갔을 것이다.
예:
var canvas = oCanvas.create({
    canvas: "#canvas"
});
var rectangle = canvas.display.rectangle({
    x: 77,
    y: 74,
    width: 200,
    height: 100,
    fill: "#000"
});
canvas.addChild(rectangle);
rectangle.bind("click tap", function () {
    canvas.removeChild(rectangle);
});

9、reset()
핵심 실체를 초기 상태로 초기화합니다.모든 대상과 시간을 지우고 settings를 초기화합니다.

좋은 웹페이지 즐겨찾기