修复transition层级问题
This commit is contained in:
43
source/bin/framework.d.ts
vendored
43
source/bin/framework.d.ts
vendored
@@ -147,6 +147,7 @@ declare abstract class Component {
|
||||
enabled: boolean;
|
||||
setEnabled(isEnabled: boolean): this;
|
||||
readonly stage: egret.Stage;
|
||||
readonly scene: Scene;
|
||||
initialize(): void;
|
||||
onAddedToEntity(): void;
|
||||
onRemovedFromEntity(): void;
|
||||
@@ -218,10 +219,9 @@ declare class Scene extends egret.DisplayObjectContainer {
|
||||
private _matrixTransformMatrix;
|
||||
private _renderers;
|
||||
private _postProcessors;
|
||||
private _afterPostProcessorRenderer;
|
||||
private _didSceneBegin;
|
||||
readonly entityProcessors: EntityProcessorList;
|
||||
constructor(displayObject: egret.DisplayObject);
|
||||
constructor();
|
||||
createEntity(name: string): Entity;
|
||||
addEntity(entity: Entity): Entity;
|
||||
destroyAllEntities(): void;
|
||||
@@ -241,6 +241,7 @@ declare class Scene extends egret.DisplayObjectContainer {
|
||||
update(): void;
|
||||
postRender(): void;
|
||||
render(): void;
|
||||
addPostProcessor<T extends PostProcessor>(postProcessor: T): T;
|
||||
}
|
||||
declare class SceneManager {
|
||||
private static _scene;
|
||||
@@ -617,6 +618,25 @@ declare class Time {
|
||||
private static _lastTime;
|
||||
static update(currentTime: number): void;
|
||||
}
|
||||
declare class GaussianBlurEffect extends egret.CustomFilter {
|
||||
private static vertSrc;
|
||||
private static fragmentSrc;
|
||||
private _sampleWeights;
|
||||
private _verticalSampleOffsets;
|
||||
private _horizontalSampleOffsets;
|
||||
private _blurAmount;
|
||||
private _horizontalBlurDelta;
|
||||
private _verticalBlurDelta;
|
||||
blurAmount: number;
|
||||
horizontalBlurDelta: number;
|
||||
verticalBlurDelta: number;
|
||||
constructor();
|
||||
prepareForHorizontalBlur(): void;
|
||||
prepareForVerticalBlur(): void;
|
||||
private calculateSampleWeights;
|
||||
private setBlurEffectParameters;
|
||||
private computeGaussian;
|
||||
}
|
||||
declare class PostProcessor {
|
||||
enable: boolean;
|
||||
effect: egret.CustomFilter;
|
||||
@@ -625,9 +645,28 @@ declare class PostProcessor {
|
||||
constructor(effect?: egret.CustomFilter);
|
||||
onAddedToScene(scene: Scene): void;
|
||||
process(source: egret.DisplayObject): void;
|
||||
onSceneBackBufferSizeChanged(newWidth: number, newHeight: number): void;
|
||||
protected drawFullscreenQuad(texture: egret.DisplayObject, effect?: egret.CustomFilter): void;
|
||||
unload(): void;
|
||||
}
|
||||
declare class BloomSettings {
|
||||
readonly threshold: any;
|
||||
readonly blurAmount: any;
|
||||
readonly intensity: any;
|
||||
readonly baseIntensity: any;
|
||||
readonly saturation: any;
|
||||
readonly baseStaturation: any;
|
||||
constructor(bloomThreshold: number, blurAmount: number, bloomIntensity: number, baseIntensity: number, bloomSaturation: number, baseSaturation: number);
|
||||
static presetSettings: BloomSettings[];
|
||||
}
|
||||
declare class GaussianBlurPostProcessor extends PostProcessor {
|
||||
private _renderTargetScale;
|
||||
renderTargetScale: number;
|
||||
onAddedToScene(scene: Scene): void;
|
||||
onSceneBackBufferSizeChanged(newWidth: number, newHeight: number): void;
|
||||
private updateEffectDeltas;
|
||||
process(source: egret.DisplayObject): void;
|
||||
}
|
||||
declare abstract class Renderer {
|
||||
camera: Camera;
|
||||
onAddedToScene(scene: Scene): void;
|
||||
|
||||
@@ -780,6 +780,15 @@ var Component = (function () {
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
Object.defineProperty(Component.prototype, "scene", {
|
||||
get: function () {
|
||||
if (!this.entity)
|
||||
return null;
|
||||
return this.entity.scene;
|
||||
},
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
Component.prototype.initialize = function () {
|
||||
};
|
||||
Component.prototype.onAddedToEntity = function () {
|
||||
@@ -1077,13 +1086,11 @@ var Entity = (function () {
|
||||
}());
|
||||
var Scene = (function (_super) {
|
||||
__extends(Scene, _super);
|
||||
function Scene(displayObject) {
|
||||
function Scene() {
|
||||
var _this = _super.call(this) || this;
|
||||
_this.enablePostProcessing = true;
|
||||
_this._renderers = [];
|
||||
_this._postProcessors = [];
|
||||
_this._afterPostProcessorRenderer = [];
|
||||
displayObject.stage.addChild(_this);
|
||||
_this._projectionMatrix = new Matrix2D(0, 0, 0, 0, 0, 0);
|
||||
_this.entityProcessors = new EntityProcessorList();
|
||||
_this.renderableComponents = new RenderableComponentList();
|
||||
@@ -1139,8 +1146,10 @@ var Scene = (function (_super) {
|
||||
};
|
||||
Scene.prototype.removeRenderer = function (renderer) {
|
||||
this._renderers.remove(renderer);
|
||||
renderer.unload();
|
||||
};
|
||||
Scene.prototype.begin = function () {
|
||||
SceneManager.stage.addChildAt(this, 0);
|
||||
if (this._renderers.length == 0) {
|
||||
this.addRenderer(new DefaultRenderer());
|
||||
console.warn("场景开始时没有渲染器 自动添加DefaultRenderer以保证能够正常渲染");
|
||||
@@ -1199,14 +1208,6 @@ var Scene = (function (_super) {
|
||||
}
|
||||
}
|
||||
}
|
||||
for (var i = 0; i < this._afterPostProcessorRenderer.length; i++) {
|
||||
if (i == 0) {
|
||||
}
|
||||
if (this._afterPostProcessorRenderer[i].camera) {
|
||||
this._afterPostProcessorRenderer[i].camera.forceMatrixUpdate();
|
||||
}
|
||||
this._afterPostProcessorRenderer[i].render(this);
|
||||
}
|
||||
};
|
||||
Scene.prototype.render = function () {
|
||||
for (var i = 0; i < this._renderers.length; i++) {
|
||||
@@ -1216,6 +1217,15 @@ var Scene = (function (_super) {
|
||||
this._renderers[i].render(this);
|
||||
}
|
||||
};
|
||||
Scene.prototype.addPostProcessor = function (postProcessor) {
|
||||
this._postProcessors.push(postProcessor);
|
||||
this._postProcessors.sort();
|
||||
postProcessor.onAddedToScene(this);
|
||||
if (this._didSceneBegin) {
|
||||
postProcessor.onSceneBackBufferSizeChanged(this.stage.stageWidth, this.stage.stageHeight);
|
||||
}
|
||||
return postProcessor;
|
||||
};
|
||||
return Scene;
|
||||
}(egret.DisplayObjectContainer));
|
||||
var SceneManager = (function () {
|
||||
@@ -1292,7 +1302,8 @@ var SceneManager = (function () {
|
||||
};
|
||||
SceneManager.startSceneTransition = function (sceneTransition) {
|
||||
if (this.sceneTransition) {
|
||||
throw new Error("在前一个场景完成之前,不能开始一个新的场景转换。");
|
||||
console.error("在前一个场景完成之前,不能开始一个新的场景转换。");
|
||||
return;
|
||||
}
|
||||
this.sceneTransition = sceneTransition;
|
||||
return sceneTransition;
|
||||
@@ -2095,7 +2106,7 @@ var SpriteRenderer = (function (_super) {
|
||||
if (this._sprite)
|
||||
this._origin = sprite.origin;
|
||||
this._bitmap = new egret.Bitmap(sprite.texture2D);
|
||||
this.stage.addChild(this._bitmap);
|
||||
this.scene.addChild(this._bitmap);
|
||||
return this;
|
||||
};
|
||||
Object.defineProperty(SpriteRenderer.prototype, "origin", {
|
||||
@@ -2147,7 +2158,7 @@ var SpriteRenderer = (function (_super) {
|
||||
};
|
||||
SpriteRenderer.prototype.onRemovedFromEntity = function () {
|
||||
if (this._bitmap)
|
||||
this.stage.removeChild(this._bitmap);
|
||||
this.scene.removeChild(this._bitmap);
|
||||
};
|
||||
return SpriteRenderer;
|
||||
}(RenderableComponent));
|
||||
@@ -2987,9 +2998,122 @@ var Time = (function () {
|
||||
Time._lastTime = 0;
|
||||
return Time;
|
||||
}());
|
||||
var GaussianBlurEffect = (function (_super) {
|
||||
__extends(GaussianBlurEffect, _super);
|
||||
function GaussianBlurEffect() {
|
||||
var _this = _super.call(this, GaussianBlurEffect.vertSrc, GaussianBlurEffect.fragmentSrc) || this;
|
||||
_this._blurAmount = 2;
|
||||
_this._horizontalBlurDelta = 0.01;
|
||||
_this._verticalBlurDelta = 0.01;
|
||||
_this._sampleWeights = [];
|
||||
_this._verticalSampleOffsets = [];
|
||||
_this._horizontalSampleOffsets = [];
|
||||
_this._verticalSampleOffsets[0] = Vector2.zero;
|
||||
_this._horizontalSampleOffsets[0] = Vector2.zero;
|
||||
_this.calculateSampleWeights();
|
||||
_this.setBlurEffectParameters(_this._horizontalBlurDelta, 0, _this._horizontalSampleOffsets);
|
||||
_this.prepareForHorizontalBlur();
|
||||
return _this;
|
||||
}
|
||||
Object.defineProperty(GaussianBlurEffect.prototype, "blurAmount", {
|
||||
get: function () {
|
||||
return this._blurAmount;
|
||||
},
|
||||
set: function (value) {
|
||||
if (this._blurAmount != value) {
|
||||
if (value == 0)
|
||||
value = 0.001;
|
||||
this._blurAmount = value;
|
||||
this.calculateSampleWeights();
|
||||
}
|
||||
},
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
Object.defineProperty(GaussianBlurEffect.prototype, "horizontalBlurDelta", {
|
||||
get: function () {
|
||||
return this._horizontalBlurDelta;
|
||||
},
|
||||
set: function (value) {
|
||||
if (value != this._horizontalBlurDelta) {
|
||||
this._horizontalBlurDelta = value;
|
||||
this.setBlurEffectParameters(this._horizontalBlurDelta, 0, this._horizontalSampleOffsets);
|
||||
}
|
||||
},
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
Object.defineProperty(GaussianBlurEffect.prototype, "verticalBlurDelta", {
|
||||
get: function () {
|
||||
return this._verticalBlurDelta;
|
||||
},
|
||||
set: function (value) {
|
||||
if (value != this._verticalBlurDelta) {
|
||||
this._verticalBlurDelta = value;
|
||||
this.setBlurEffectParameters(0, this._verticalBlurDelta, this._verticalSampleOffsets);
|
||||
}
|
||||
},
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
GaussianBlurEffect.prototype.prepareForHorizontalBlur = function () {
|
||||
this.uniforms._sampleOffsets = this._horizontalSampleOffsets;
|
||||
};
|
||||
GaussianBlurEffect.prototype.prepareForVerticalBlur = function () {
|
||||
this.uniforms._sampleOffsets = this._verticalSampleOffsets;
|
||||
};
|
||||
GaussianBlurEffect.prototype.calculateSampleWeights = function () {
|
||||
this._sampleWeights[0] = this.computeGaussian(0);
|
||||
var totalWeights = this._sampleWeights[0];
|
||||
for (var i = 0; i < 15 / 2; i++) {
|
||||
var weight = this.computeGaussian(i + 1);
|
||||
this._sampleWeights[i * 2 + 1] = weight;
|
||||
this._sampleWeights[i * 2 + 2] = weight;
|
||||
totalWeights += weight * 2;
|
||||
}
|
||||
for (var i = 0; i < this._sampleWeights.length; i++) {
|
||||
this._sampleWeights[i] /= totalWeights;
|
||||
}
|
||||
this.uniforms._sampleWeights = this._sampleWeights;
|
||||
};
|
||||
GaussianBlurEffect.prototype.setBlurEffectParameters = function (dx, dy, offsets) {
|
||||
for (var i = 0; i < 15 / 2; i++) {
|
||||
var sampleOffset = i * 2 + 1.5;
|
||||
var delta = Vector2.subtract(new Vector2(dx, dy), new Vector2(sampleOffset));
|
||||
offsets[i * 2 + 1] = delta;
|
||||
offsets[i * 2 + 2] = new Vector2(-delta);
|
||||
}
|
||||
};
|
||||
GaussianBlurEffect.prototype.computeGaussian = function (n) {
|
||||
return ((1 / Math.sqrt(2 * Math.PI * this._blurAmount)) * Math.exp(-(n * n) / (2 * this._blurAmount * this._blurAmount)));
|
||||
};
|
||||
GaussianBlurEffect.vertSrc = "attribute vec2 aVertexPosition;\n" +
|
||||
"attribute vec2 aTextureCoord;\n" +
|
||||
"uniform vec2 projectionVector;\n" +
|
||||
"varying vec2 vTextureCoord;\n" +
|
||||
"const vec2 center = vec2(-1.0, 1.0);\n" +
|
||||
"void main(void) {\n" +
|
||||
" gl_Position = vec4( (aVertexPosition / projectionVector) + center , 0.0, 1.0);\n" +
|
||||
" vTextureCoord = aTextureCoord;\n" +
|
||||
"}";
|
||||
GaussianBlurEffect.fragmentSrc = "precision lowp float;\n" +
|
||||
"varying vec2 vTextureCoord;\n" +
|
||||
"uniform sampler2D uSampler;\n" +
|
||||
"#define SAMPLE_COUNT 15\n" +
|
||||
"uniform vec2 _sampleOffsets[SAMPLE_COUNT];\n" +
|
||||
"uniform float _sampleWeights[SAMPLE_COUNT];\n" +
|
||||
"void main(void) {\n" +
|
||||
"vec4 c = 0;\n" +
|
||||
"for( int i = 0; i < SAMPLE_COUNT; i++ )\n" +
|
||||
" c += texture2D( s0, texCoord + _sampleOffsets[i] ) * _sampleWeights[i];\n" +
|
||||
"gl_FragColor = c;\n" +
|
||||
"}";
|
||||
return GaussianBlurEffect;
|
||||
}(egret.CustomFilter));
|
||||
var PostProcessor = (function () {
|
||||
function PostProcessor(effect) {
|
||||
if (effect === void 0) { effect = null; }
|
||||
this.enable = true;
|
||||
this.effect = effect;
|
||||
}
|
||||
PostProcessor.prototype.onAddedToScene = function (scene) {
|
||||
@@ -3000,23 +3124,80 @@ var PostProcessor = (function () {
|
||||
PostProcessor.prototype.process = function (source) {
|
||||
this.drawFullscreenQuad(source, this.effect);
|
||||
};
|
||||
PostProcessor.prototype.onSceneBackBufferSizeChanged = function (newWidth, newHeight) { };
|
||||
PostProcessor.prototype.drawFullscreenQuad = function (texture, effect) {
|
||||
if (effect === void 0) { effect = null; }
|
||||
this.shape.graphics.clear();
|
||||
this.shape.graphics.beginFill(0x000000, 1);
|
||||
this.shape.graphics.drawRect(0, 0, texture.width, texture.height);
|
||||
this.shape.graphics.endFill();
|
||||
this.shape.filters = [effect];
|
||||
texture.filters = [effect];
|
||||
};
|
||||
PostProcessor.prototype.unload = function () {
|
||||
if (this.effect) {
|
||||
this.effect = null;
|
||||
}
|
||||
this.scene = null;
|
||||
this.scene.removeChild(this.shape);
|
||||
this.scene = null;
|
||||
};
|
||||
return PostProcessor;
|
||||
}());
|
||||
var BloomSettings = (function () {
|
||||
function BloomSettings(bloomThreshold, blurAmount, bloomIntensity, baseIntensity, bloomSaturation, baseSaturation) {
|
||||
this.threshold = bloomThreshold;
|
||||
this.blurAmount = blurAmount;
|
||||
this.intensity = bloomIntensity;
|
||||
this.baseIntensity = baseIntensity;
|
||||
this.saturation = bloomSaturation;
|
||||
this.baseStaturation = baseSaturation;
|
||||
}
|
||||
BloomSettings.presetSettings = [
|
||||
new BloomSettings(0.1, 0.6, 2, 1, 1, 0),
|
||||
new BloomSettings(0, 3, 1, 1, 1, 1),
|
||||
new BloomSettings(0.5, 8, 2, 1, 0, 1),
|
||||
new BloomSettings(0.25, 8, 1.3, 1, 1, 0),
|
||||
new BloomSettings(0, 2, 1, 0.1, 1, 1),
|
||||
new BloomSettings(0.5, 2, 1, 1, 1, 1)
|
||||
];
|
||||
return BloomSettings;
|
||||
}());
|
||||
var GaussianBlurPostProcessor = (function (_super) {
|
||||
__extends(GaussianBlurPostProcessor, _super);
|
||||
function GaussianBlurPostProcessor() {
|
||||
var _this = _super !== null && _super.apply(this, arguments) || this;
|
||||
_this._renderTargetScale = 1;
|
||||
return _this;
|
||||
}
|
||||
Object.defineProperty(GaussianBlurPostProcessor.prototype, "renderTargetScale", {
|
||||
get: function () {
|
||||
return this._renderTargetScale;
|
||||
},
|
||||
set: function (value) {
|
||||
if (this._renderTargetScale != value) {
|
||||
this._renderTargetScale = value;
|
||||
this.updateEffectDeltas();
|
||||
}
|
||||
},
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
GaussianBlurPostProcessor.prototype.onAddedToScene = function (scene) {
|
||||
_super.prototype.onAddedToScene.call(this, scene);
|
||||
this.effect = new GaussianBlurEffect();
|
||||
};
|
||||
GaussianBlurPostProcessor.prototype.onSceneBackBufferSizeChanged = function (newWidth, newHeight) {
|
||||
this.updateEffectDeltas();
|
||||
};
|
||||
GaussianBlurPostProcessor.prototype.updateEffectDeltas = function () {
|
||||
var effect = this.effect;
|
||||
effect.horizontalBlurDelta = 1 / (this.scene.stage.stageWidth * this._renderTargetScale);
|
||||
effect.verticalBlurDelta = 1 / (this.scene.stage.stageHeight * this._renderTargetScale);
|
||||
};
|
||||
GaussianBlurPostProcessor.prototype.process = function (source) {
|
||||
var effect = this.effect;
|
||||
effect.prepareForHorizontalBlur();
|
||||
this.drawFullscreenQuad(source, this.effect);
|
||||
effect.prepareForVerticalBlur();
|
||||
this.drawFullscreenQuad(source, this.effect);
|
||||
};
|
||||
return GaussianBlurPostProcessor;
|
||||
}(PostProcessor));
|
||||
var Renderer = (function () {
|
||||
function Renderer() {
|
||||
}
|
||||
|
||||
2
source/bin/framework.min.js
vendored
2
source/bin/framework.min.js
vendored
File diff suppressed because one or more lines are too long
@@ -36,6 +36,13 @@ abstract class Component {
|
||||
return this.entity.stage;
|
||||
}
|
||||
|
||||
public get scene(){
|
||||
if (!this.entity)
|
||||
return null;
|
||||
|
||||
return this.entity.scene;
|
||||
}
|
||||
|
||||
public initialize(){
|
||||
|
||||
}
|
||||
|
||||
@@ -30,7 +30,7 @@ class SpriteRenderer extends RenderableComponent {
|
||||
this._origin = sprite.origin;
|
||||
|
||||
this._bitmap = new egret.Bitmap(sprite.texture2D);
|
||||
this.stage.addChild(this._bitmap);
|
||||
this.scene.addChild(this._bitmap);
|
||||
|
||||
return this;
|
||||
}
|
||||
@@ -85,6 +85,6 @@ class SpriteRenderer extends RenderableComponent {
|
||||
|
||||
public onRemovedFromEntity(){
|
||||
if (this._bitmap)
|
||||
this.stage.removeChild(this._bitmap);
|
||||
this.scene.removeChild(this._bitmap);
|
||||
}
|
||||
}
|
||||
@@ -11,14 +11,12 @@ class Scene extends egret.DisplayObjectContainer {
|
||||
private _matrixTransformMatrix: Matrix2D;
|
||||
private _renderers: Renderer[] = [];
|
||||
private _postProcessors: PostProcessor[] = [];
|
||||
private _afterPostProcessorRenderer: Renderer[] = [];
|
||||
private _didSceneBegin;
|
||||
|
||||
public readonly entityProcessors: EntityProcessorList;
|
||||
|
||||
constructor(displayObject: egret.DisplayObject) {
|
||||
constructor() {
|
||||
super();
|
||||
displayObject.stage.addChild(this);
|
||||
this._projectionMatrix = new Matrix2D(0, 0, 0, 0, 0, 0);
|
||||
this.entityProcessors = new EntityProcessorList();
|
||||
this.renderableComponents = new RenderableComponentList();
|
||||
@@ -93,9 +91,11 @@ class Scene extends egret.DisplayObjectContainer {
|
||||
|
||||
public removeRenderer(renderer: Renderer) {
|
||||
this._renderers.remove(renderer);
|
||||
renderer.unload();
|
||||
}
|
||||
|
||||
public begin() {
|
||||
SceneManager.stage.addChildAt(this, 0);
|
||||
if (this._renderers.length == 0) {
|
||||
this.addRenderer(new DefaultRenderer());
|
||||
console.warn("场景开始时没有渲染器 自动添加DefaultRenderer以保证能够正常渲染");
|
||||
@@ -184,17 +184,6 @@ class Scene extends egret.DisplayObjectContainer {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
for (let i = 0; i < this._afterPostProcessorRenderer.length; i ++){
|
||||
if (i == 0){
|
||||
// TODO: 设置渲染对象
|
||||
}
|
||||
|
||||
if (this._afterPostProcessorRenderer[i].camera){
|
||||
this._afterPostProcessorRenderer[i].camera.forceMatrixUpdate();
|
||||
}
|
||||
this._afterPostProcessorRenderer[i].render(this);
|
||||
}
|
||||
}
|
||||
|
||||
public render() {
|
||||
@@ -205,4 +194,16 @@ class Scene extends egret.DisplayObjectContainer {
|
||||
this._renderers[i].render(this);
|
||||
}
|
||||
}
|
||||
|
||||
public addPostProcessor<T extends PostProcessor>(postProcessor: T): T{
|
||||
this._postProcessors.push(postProcessor);
|
||||
this._postProcessors.sort();
|
||||
postProcessor.onAddedToScene(this);
|
||||
|
||||
if (this._didSceneBegin){
|
||||
postProcessor.onSceneBackBufferSizeChanged(this.stage.stageWidth, this.stage.stageHeight);
|
||||
}
|
||||
|
||||
return postProcessor;
|
||||
}
|
||||
}
|
||||
@@ -91,7 +91,8 @@ class SceneManager {
|
||||
*/
|
||||
public static startSceneTransition<T extends SceneTransition>(sceneTransition: T): T {
|
||||
if (this.sceneTransition) {
|
||||
throw new Error("在前一个场景完成之前,不能开始一个新的场景转换。");
|
||||
console.error("在前一个场景完成之前,不能开始一个新的场景转换。");
|
||||
return;
|
||||
}
|
||||
|
||||
this.sceneTransition = sceneTransition;
|
||||
|
||||
125
source/src/Graphics/Effects/GaussianBlurEffect.ts
Normal file
125
source/src/Graphics/Effects/GaussianBlurEffect.ts
Normal file
@@ -0,0 +1,125 @@
|
||||
class GaussianBlurEffect extends egret.CustomFilter {
|
||||
private static vertSrc = "attribute vec2 aVertexPosition;\n" +
|
||||
"attribute vec2 aTextureCoord;\n" +
|
||||
|
||||
"uniform vec2 projectionVector;\n" +
|
||||
|
||||
"varying vec2 vTextureCoord;\n" +
|
||||
|
||||
"const vec2 center = vec2(-1.0, 1.0);\n" +
|
||||
|
||||
"void main(void) {\n" +
|
||||
" gl_Position = vec4( (aVertexPosition / projectionVector) + center , 0.0, 1.0);\n" +
|
||||
" vTextureCoord = aTextureCoord;\n" +
|
||||
"}";
|
||||
private static fragmentSrc = "precision lowp float;\n" +
|
||||
"varying vec2 vTextureCoord;\n" +
|
||||
"uniform sampler2D uSampler;\n" +
|
||||
|
||||
"#define SAMPLE_COUNT 15\n" +
|
||||
|
||||
"uniform vec2 _sampleOffsets[SAMPLE_COUNT];\n" +
|
||||
"uniform float _sampleWeights[SAMPLE_COUNT];\n" +
|
||||
|
||||
"void main(void) {\n" +
|
||||
"vec4 c = 0;\n" +
|
||||
"for( int i = 0; i < SAMPLE_COUNT; i++ )\n" +
|
||||
" c += texture2D( s0, texCoord + _sampleOffsets[i] ) * _sampleWeights[i];\n" +
|
||||
"gl_FragColor = c;\n" +
|
||||
"}";
|
||||
private _sampleWeights: number[];
|
||||
private _verticalSampleOffsets: Vector2[];
|
||||
private _horizontalSampleOffsets: Vector2[];
|
||||
private _blurAmount = 2;
|
||||
private _horizontalBlurDelta = 0.01;
|
||||
private _verticalBlurDelta = 0.01;
|
||||
|
||||
public get blurAmount(){
|
||||
return this._blurAmount;
|
||||
}
|
||||
public set blurAmount(value: number){
|
||||
if (this._blurAmount != value){
|
||||
if (value == 0)
|
||||
value = 0.001;
|
||||
|
||||
this._blurAmount = value;
|
||||
this.calculateSampleWeights();
|
||||
}
|
||||
}
|
||||
|
||||
public get horizontalBlurDelta(){
|
||||
return this._horizontalBlurDelta;
|
||||
}
|
||||
public set horizontalBlurDelta(value: number){
|
||||
if (value != this._horizontalBlurDelta){
|
||||
this._horizontalBlurDelta = value;
|
||||
this.setBlurEffectParameters(this._horizontalBlurDelta, 0, this._horizontalSampleOffsets);
|
||||
}
|
||||
}
|
||||
|
||||
public get verticalBlurDelta(){
|
||||
return this._verticalBlurDelta;
|
||||
}
|
||||
public set verticalBlurDelta(value: number){
|
||||
if (value != this._verticalBlurDelta){
|
||||
this._verticalBlurDelta = value;
|
||||
this.setBlurEffectParameters(0, this._verticalBlurDelta, this._verticalSampleOffsets);
|
||||
}
|
||||
}
|
||||
|
||||
constructor(){
|
||||
super(GaussianBlurEffect.vertSrc, GaussianBlurEffect.fragmentSrc);
|
||||
|
||||
this._sampleWeights = [];
|
||||
this._verticalSampleOffsets = [];
|
||||
this._horizontalSampleOffsets = [];
|
||||
|
||||
this._verticalSampleOffsets[0] = Vector2.zero;
|
||||
this._horizontalSampleOffsets[0] = Vector2.zero;
|
||||
|
||||
this.calculateSampleWeights();
|
||||
this.setBlurEffectParameters(this._horizontalBlurDelta, 0, this._horizontalSampleOffsets);
|
||||
this.prepareForHorizontalBlur();
|
||||
}
|
||||
|
||||
public prepareForHorizontalBlur(){
|
||||
this.uniforms._sampleOffsets = this._horizontalSampleOffsets;
|
||||
}
|
||||
|
||||
public prepareForVerticalBlur(){
|
||||
this.uniforms._sampleOffsets = this._verticalSampleOffsets;
|
||||
}
|
||||
|
||||
private calculateSampleWeights(){
|
||||
this._sampleWeights[0] = this.computeGaussian(0);
|
||||
let totalWeights = this._sampleWeights[0];
|
||||
|
||||
for (let i = 0; i < 15 / 2; i ++){
|
||||
let weight = this.computeGaussian(i + 1);
|
||||
this._sampleWeights[i * 2 + 1] = weight;
|
||||
this._sampleWeights[i * 2 + 2] = weight;
|
||||
|
||||
totalWeights += weight * 2;
|
||||
}
|
||||
|
||||
for (let i = 0; i < this._sampleWeights.length; i ++){
|
||||
this._sampleWeights[i] /= totalWeights;
|
||||
}
|
||||
|
||||
this.uniforms._sampleWeights = this._sampleWeights;
|
||||
}
|
||||
|
||||
private setBlurEffectParameters(dx: number, dy: number, offsets: Vector2[]){
|
||||
for (let i = 0; i < 15 / 2; i ++){
|
||||
let sampleOffset = i * 2 + 1.5;
|
||||
let delta = Vector2.subtract( new Vector2(dx, dy), new Vector2(sampleOffset));
|
||||
|
||||
offsets[i * 2 + 1] = delta;
|
||||
offsets[i * 2 + 2] = new Vector2(-delta);
|
||||
}
|
||||
}
|
||||
|
||||
private computeGaussian(n: number){
|
||||
return ((1 / Math.sqrt(2 * Math.PI * this._blurAmount)) * Math.exp(-(n * n) / (2 * this._blurAmount * this._blurAmount)));
|
||||
}
|
||||
}
|
||||
@@ -5,6 +5,7 @@ class PostProcessor {
|
||||
public shape: egret.Shape;
|
||||
|
||||
constructor(effect: egret.CustomFilter = null){
|
||||
this.enable = true;
|
||||
this.effect = effect;
|
||||
}
|
||||
|
||||
@@ -18,12 +19,10 @@ class PostProcessor {
|
||||
this.drawFullscreenQuad(source, this.effect);
|
||||
}
|
||||
|
||||
public onSceneBackBufferSizeChanged(newWidth: number, newHeight: number){}
|
||||
|
||||
protected drawFullscreenQuad(texture: egret.DisplayObject, effect: egret.CustomFilter = null){
|
||||
this.shape.graphics.clear();
|
||||
this.shape.graphics.beginFill(0x000000, 1);
|
||||
this.shape.graphics.drawRect(0, 0, texture.width, texture.height);
|
||||
this.shape.graphics.endFill();
|
||||
this.shape.filters = [effect];
|
||||
texture.filters = [effect];
|
||||
}
|
||||
|
||||
public unload(){
|
||||
@@ -31,7 +30,7 @@ class PostProcessor {
|
||||
this.effect = null;
|
||||
}
|
||||
|
||||
this.scene = null;
|
||||
this.scene.removeChild(this.shape);
|
||||
this.scene = null;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,27 @@
|
||||
class BloomSettings {
|
||||
public readonly threshold;
|
||||
public readonly blurAmount;
|
||||
public readonly intensity;
|
||||
public readonly baseIntensity;
|
||||
public readonly saturation;
|
||||
public readonly baseStaturation;
|
||||
|
||||
constructor(bloomThreshold: number, blurAmount: number, bloomIntensity: number,baseIntensity: number,
|
||||
bloomSaturation: number, baseSaturation: number){
|
||||
this.threshold = bloomThreshold;
|
||||
this.blurAmount = blurAmount;
|
||||
this.intensity = bloomIntensity;
|
||||
this.baseIntensity = baseIntensity;
|
||||
this.saturation = bloomSaturation;
|
||||
this.baseStaturation = baseSaturation;
|
||||
}
|
||||
|
||||
public static presetSettings: BloomSettings[] = [
|
||||
new BloomSettings(0.1, 0.6, 2, 1, 1, 0),
|
||||
new BloomSettings(0, 3, 1, 1, 1, 1),
|
||||
new BloomSettings(0.5, 8, 2, 1, 0, 1),
|
||||
new BloomSettings(0.25, 8, 1.3, 1, 1, 0),
|
||||
new BloomSettings(0, 2, 1, 0.1, 1, 1),
|
||||
new BloomSettings(0.5, 2, 1, 1, 1, 1)
|
||||
];
|
||||
}
|
||||
@@ -0,0 +1,36 @@
|
||||
class GaussianBlurPostProcessor extends PostProcessor {
|
||||
private _renderTargetScale = 1;
|
||||
public get renderTargetScale(){
|
||||
return this._renderTargetScale;
|
||||
}
|
||||
public set renderTargetScale(value: number){
|
||||
if (this._renderTargetScale != value){
|
||||
this._renderTargetScale = value;
|
||||
this.updateEffectDeltas();
|
||||
}
|
||||
}
|
||||
|
||||
public onAddedToScene(scene: Scene){
|
||||
super.onAddedToScene(scene);
|
||||
this.effect = new GaussianBlurEffect();
|
||||
}
|
||||
|
||||
public onSceneBackBufferSizeChanged(newWidth: number, newHeight: number){
|
||||
this.updateEffectDeltas();
|
||||
}
|
||||
|
||||
private updateEffectDeltas(){
|
||||
let effect = this.effect as GaussianBlurEffect;
|
||||
effect.horizontalBlurDelta = 1 / (this.scene.stage.stageWidth * this._renderTargetScale);
|
||||
effect.verticalBlurDelta = 1 / (this.scene.stage.stageHeight * this._renderTargetScale);
|
||||
}
|
||||
|
||||
public process(source: egret.DisplayObject){
|
||||
let effect = this.effect as GaussianBlurEffect;
|
||||
effect.prepareForHorizontalBlur();
|
||||
this.drawFullscreenQuad(source, this.effect);
|
||||
|
||||
effect.prepareForVerticalBlur();
|
||||
this.drawFullscreenQuad(source, this.effect);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user