CocosPlugin/esengine
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

完善Color

Browse Source
This commit is contained in:
yhh
2021-06-22 13:50:31 +08:00
parent 219b90fc5d
commit fe308d35f2
6 changed files with 1087 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

232
source/bin/framework.d.ts vendored
View File

@@ -2167,11 +2167,227 @@ declare module es {
}
declare module es {
class Color {
a: number;
/**
* 红色通道
*/
r: number;
/**
* 绿色通道
*/
g: number;
/**
* 蓝色通道
*/
b: number;
/**
* 透明度通道 (仅0-1之间)
*/
a: number;
/**
* 色调
*/
h: number;
/**
* 饱和
*/
s: number;
/**
* 亮度
*/
l: number;
/**
* 从 r, g, b, a 创建一个新的 Color 实例
*
* @param r 颜色的红色分量 (0-255)
* @param g 颜色的绿色成分 (0-255)
* @param b 颜色的蓝色分量 (0-255)
* @param a 颜色的 alpha 分量 (0-1.0)
*/
constructor(r: number, g: number, b: number, a?: number);
/**
* 从 r, g, b, a 创建一个新的 Color 实例
*
* @param r 颜色的红色分量 (0-255)
* @param g 颜色的绿色成分 (0-255)
* @param b 颜色的蓝色分量 (0-255)
* @param a 颜色的 alpha 分量 (0-1.0)
*/
static fromRGB(r: number, g: number, b: number, a?: number): Color;
/**
* 从十六进制字符串创建一个新的 Color 实例
*
* @param hex #ffffff 形式的 CSS 颜色字符串，alpha 组件是可选的
*/
static createFromHex(hex: string): Color;
/**
* 从 hsl 值创建一个新的 Color 实例
*
* @param h 色调表示 [0-1]
* @param s 饱和度表示为 [0-1]
* @param l 亮度表示 [0-1]
* @param a 透明度表示 [0-1]
*/
static fromHSL(h: number, s: number, l: number, a?: number): Color;
/**
* 将当前颜色调亮指定的量
*
* @param factor
*/
lighten(factor?: number): Color;
/**
* 将当前颜色变暗指定的量
*
* @param factor
*/
darken(factor?: number): Color;
/**
* 使当前颜色饱和指定的量
*
* @param factor
*/
saturate(factor?: number): Color;
/**
* 按指定量降低当前颜色的饱和度
*
* @param factor
*/
desaturate(factor?: number): Color;
/**
* 将一种颜色乘以另一种颜色，得到更深的颜色
*
* @param color
*/
mulitiply(color: Color): Color;
/**
* 筛选另一种颜色，导致颜色较浅
*
* @param color
*/
screen(color: Color): Color;
/**
* 反转当前颜色
*/
invert(): Color;
/**
* 将当前颜色与另一个颜色平均
*
* @param color
*/
average(color: Color): Color;
/**
* 返回颜色的 CSS 字符串表示形式。
*
* @param format
*/
toString(format?: 'rgb' | 'hsl' | 'hex'): string;
/**
* 返回颜色分量的十六进制值
* @param c
* @see https://stackoverflow.com/questions/5623838/rgb-to-hex-and-hex-to-rgb
*/
private _componentToHex;
/**
*返回颜色的十六进制表示
*/
toHex(): string;
/**
* 从十六进制字符串设置颜色
*
* @param hex #ffffff 形式的 CSS 颜色字符串，alpha 组件是可选的
*/
fromHex(hex: string): void;
/**
* 返回颜色的 RGBA 表示
*/
toRGBA(): string;
/**
* 返回颜色的 HSLA 表示
*/
toHSLA(): string;
/**
* 返回颜色的 CSS 字符串表示形式
*/
fillStyle(): string;
/**
* 返回当前颜色的克隆
*/
clone(): Color;
/**
* Black (#000000)
*/
static Black: Color;
/**
* White (#FFFFFF)
*/
static White: Color;
/**
* Gray (#808080)
*/
static Gray: Color;
/**
* Light gray (#D3D3D3)
*/
static LightGray: Color;
/**
* Dark gray (#A9A9A9)
*/
static DarkGray: Color;
/**
* Yellow (#FFFF00)
*/
static Yellow: Color;
/**
* Orange (#FFA500)
*/
static Orange: Color;
/**
* Red (#FF0000)
*/
static Red: Color;
/**
* Vermillion (#FF5B31)
*/
static Vermillion: Color;
/**
* Rose (#FF007F)
*/
static Rose: Color;
/**
* Magenta (#FF00FF)
*/
static Magenta: Color;
/**
* Violet (#7F00FF)
*/
static Violet: Color;
/**
* Blue (#0000FF)
*/
static Blue: Color;
/**
* Azure (#007FFF)
*/
static Azure: Color;
/**
* Cyan (#00FFFF)
*/
static Cyan: Color;
/**
* Viridian (#59978F)
*/
static Viridian: Color;
/**
* Green (#00FF00)
*/
static Green: Color;
/**
* Chartreuse (#7FFF00)
*/
static Chartreuse: Color;
/**
* Transparent (#FFFFFF00)
*/
static Transparent: Color;
}
}
declare module es {
@@ -2578,7 +2794,7 @@ declare module es {
*/
static approachAngle(start: number, end: number, shift: number): number;
/**
* 将此 Vector 投影到另一个 Vector 上
* 将 Vector 投影到另一个 Vector 上
* @param other
*/
static project(self: Vector2, other: Vector2): Vector2;
@@ -3338,7 +3554,7 @@ declare module es {
/**
* 保存所有数据的字典
*/
_cellDict: NumberDictionary;
_cellDict: NumberDictionary<Collider>;
/**
* 用于返回冲突信息的共享HashSet
*/
@@ -3409,15 +3625,15 @@ declare module es {
*/
cellAtPosition(x: number, y: number, createCellIfEmpty?: boolean): Collider[];
}
class NumberDictionary {
_store: Map<string, Collider[]>;
add(x: number, y: number, list: Collider[]): void;
class NumberDictionary<T> {
_store: Map<string, T[]>;
add(x: number, y: number, list: T[]): void;
/**
* 使用蛮力方法从字典存储列表中移除碰撞器
* @param obj
*/
remove(obj: Collider): void;
tryGetValue(x: number, y: number): Collider[];
remove(obj: T): void;
tryGetValue(x: number, y: number): T[];
getKey(x: number, y: number): string;
/**
* 清除字典数据

396
source/bin/framework.js
View File

@@ -80,9 +80,10 @@ var es;
* 全局核心类
*/
var Core = /** @class */ (function () {
function Core(debug, enableEntitySystems) {
function Core(debug, enableEntitySystems, remoteUrl) {
if (debug === void 0) { debug = true; }
if (enableEntitySystems === void 0) { enableEntitySystems = true; }
if (remoteUrl === void 0) { remoteUrl = ""; }
/**
* 全局访问系统
*/
@@ -5508,20 +5509,399 @@ var es;
var es;
(function (es) {
var Color = /** @class */ (function () {
/**
* 从 r, g, b, a 创建一个新的 Color 实例
*
* @param r 颜色的红色分量 (0-255)
* @param g 颜色的绿色成分 (0-255)
* @param b 颜色的蓝色分量 (0-255)
* @param a 颜色的 alpha 分量 (0-1.0)
*/
function Color(r, g, b, a) {
if (a === void 0) { a = 255; }
this.a = 255;
this.r = 255;
this.g = 255;
this.b = 255;
this.a = a;
this.r = r;
this.g = g;
this.b = b;
this.a = a != null ? a : 1;
}
/**
* 从 r, g, b, a 创建一个新的 Color 实例
*
* @param r 颜色的红色分量 (0-255)
* @param g 颜色的绿色成分 (0-255)
* @param b 颜色的蓝色分量 (0-255)
* @param a 颜色的 alpha 分量 (0-1.0)
*/
Color.fromRGB = function (r, g, b, a) {
return new Color(r, g, b, a);
};
/**
* 从十六进制字符串创建一个新的 Color 实例
*
* @param hex #ffffff 形式的 CSS 颜色字符串，alpha 组件是可选的
*/
Color.createFromHex = function (hex) {
var color = new Color(1, 1, 1);
color.fromHex(hex);
return color;
};
/**
* 从 hsl 值创建一个新的 Color 实例
*
* @param h 色调表示 [0-1]
* @param s 饱和度表示为 [0-1]
* @param l 亮度表示 [0-1]
* @param a 透明度表示 [0-1]
*/
Color.fromHSL = function (h, s, l, a) {
if (a === void 0) { a = 1.0; }
var temp = new HSLColor(h, s, l, a);
return temp.toRGBA();
};
/**
* 将当前颜色调亮指定的量
*
* @param factor
*/
Color.prototype.lighten = function (factor) {
if (factor === void 0) { factor = 0.1; }
var temp = HSLColor.fromRGBA(this.r, this.g, this.b, this.a);
temp.l += temp.l * factor;
return temp.toRGBA();
};
/**
* 将当前颜色变暗指定的量
*
* @param factor
*/
Color.prototype.darken = function (factor) {
if (factor === void 0) { factor = 0.1; }
var temp = HSLColor.fromRGBA(this.r, this.g, this.b, this.a);
temp.l -= temp.l * factor;
return temp.toRGBA();
};
/**
* 使当前颜色饱和指定的量
*
* @param factor
*/
Color.prototype.saturate = function (factor) {
if (factor === void 0) { factor = 0.1; }
var temp = HSLColor.fromRGBA(this.r, this.g, this.b, this.a);
temp.s += temp.s * factor;
return temp.toRGBA();
};
/**
* 按指定量降低当前颜色的饱和度
*
* @param factor
*/
Color.prototype.desaturate = function (factor) {
if (factor === void 0) { factor = 0.1; }
var temp = HSLColor.fromRGBA(this.r, this.g, this.b, this.a);
temp.s -= temp.s * factor;
return temp.toRGBA();
};
/**
* 将一种颜色乘以另一种颜色，得到更深的颜色
*
* @param color
*/
Color.prototype.mulitiply = function (color) {
var newR = (((color.r / 255) * this.r) / 255) * 255;
var newG = (((color.g / 255) * this.g) / 255) * 255;
var newB = (((color.b / 255) * this.b) / 255) * 255;
var newA = color.a * this.a;
return new Color(newR, newG, newB, newA);
};
/**
* 筛选另一种颜色，导致颜色较浅
*
* @param color
*/
Color.prototype.screen = function (color) {
var color1 = color.invert();
var color2 = color.invert();
return color1.mulitiply(color2).invert();
};
/**
* 反转当前颜色
*/
Color.prototype.invert = function () {
return new Color(255 - this.r, 255 - this.g, 255 - this.b, 1.0 - this.a);
};
/**
* 将当前颜色与另一个颜色平均
*
* @param color
*/
Color.prototype.average = function (color) {
var newR = (color.r + this.r) / 2;
var newG = (color.g + this.g) / 2;
var newB = (color.b + this.b) / 2;
var newA = (color.a + this.a) / 2;
return new Color(newR, newG, newB, newA);
};
/**
* 返回颜色的 CSS 字符串表示形式。
*
* @param format
*/
Color.prototype.toString = function (format) {
if (format === void 0) { format = 'rgb'; }
switch (format) {
case 'rgb':
return this.toRGBA();
case 'hsl':
return this.toHSLA();
case 'hex':
return this.toHex();
default:
throw new Error('Invalid Color format');
}
};
/**
* 返回颜色分量的十六进制值
* @param c
* @see https://stackoverflow.com/questions/5623838/rgb-to-hex-and-hex-to-rgb
*/
Color.prototype._componentToHex = function (c) {
var hex = c.toString(16);
return hex.length === 1 ? '0' + hex : hex;
};
/**
*返回颜色的十六进制表示
*/
Color.prototype.toHex = function () {
return ('#' +
this._componentToHex(this.r) +
this._componentToHex(this.g) +
this._componentToHex(this.b) +
this._componentToHex(this.a));
};
/**
* 从十六进制字符串设置颜色
*
* @param hex #ffffff 形式的 CSS 颜色字符串，alpha 组件是可选的
*/
Color.prototype.fromHex = function (hex) {
var hexRegEx = /^#?([0-9a-f]{2})([0-9a-f]{2})([0-9a-f]{2})([0-9a-f]{2})?$/i;
var match = hex.match(hexRegEx);
if (match) {
var r = parseInt(match[1], 16);
var g = parseInt(match[2], 16);
var b = parseInt(match[3], 16);
var a = 1;
if (match[4]) {
a = parseInt(match[4], 16) / 255;
}
this.r = r;
this.g = g;
this.b = b;
this.a = a;
}
else {
throw new Error('Invalid hex string: ' + hex);
}
};
/**
* 返回颜色的 RGBA 表示
*/
Color.prototype.toRGBA = function () {
var result = String(this.r.toFixed(0)) +
', ' +
String(this.g.toFixed(0)) +
', ' +
String(this.b.toFixed(0));
if (this.a !== undefined || this.a != null) {
return 'rgba(' + result + ', ' + String(this.a) + ')';
}
return 'rgb(' + result + ')';
};
/**
* 返回颜色的 HSLA 表示
*/
Color.prototype.toHSLA = function () {
return HSLColor.fromRGBA(this.r, this.g, this.b, this.a).toString();
};
/**
* 返回颜色的 CSS 字符串表示形式
*/
Color.prototype.fillStyle = function () {
return this.toString();
};
/**
* 返回当前颜色的克隆
*/
Color.prototype.clone = function () {
return new Color(this.r, this.g, this.b, this.a);
};
/**
* Black (#000000)
*/
Color.Black = Color.createFromHex('#000000');
/**
* White (#FFFFFF)
*/
Color.White = Color.createFromHex('#FFFFFF');
/**
* Gray (#808080)
*/
Color.Gray = Color.createFromHex('#808080');
/**
* Light gray (#D3D3D3)
*/
Color.LightGray = Color.createFromHex('#D3D3D3');
/**
* Dark gray (#A9A9A9)
*/
Color.DarkGray = Color.createFromHex('#A9A9A9');
/**
* Yellow (#FFFF00)
*/
Color.Yellow = Color.createFromHex('#FFFF00');
/**
* Orange (#FFA500)
*/
Color.Orange = Color.createFromHex('#FFA500');
/**
* Red (#FF0000)
*/
Color.Red = Color.createFromHex('#FF0000');
/**
* Vermillion (#FF5B31)
*/
Color.Vermillion = Color.createFromHex('#FF5B31');
/**
* Rose (#FF007F)
*/
Color.Rose = Color.createFromHex('#FF007F');
/**
* Magenta (#FF00FF)
*/
Color.Magenta = Color.createFromHex('#FF00FF');
/**
* Violet (#7F00FF)
*/
Color.Violet = Color.createFromHex('#7F00FF');
/**
* Blue (#0000FF)
*/
Color.Blue = Color.createFromHex('#0000FF');
/**
* Azure (#007FFF)
*/
Color.Azure = Color.createFromHex('#007FFF');
/**
* Cyan (#00FFFF)
*/
Color.Cyan = Color.createFromHex('#00FFFF');
/**
* Viridian (#59978F)
*/
Color.Viridian = Color.createFromHex('#59978F');
/**
* Green (#00FF00)
*/
Color.Green = Color.createFromHex('#00FF00');
/**
* Chartreuse (#7FFF00)
*/
Color.Chartreuse = Color.createFromHex('#7FFF00');
/**
* Transparent (#FFFFFF00)
*/
Color.Transparent = Color.createFromHex('#FFFFFF00');
return Color;
}());
es.Color = Color;
/**
* 内部 HSL 颜色表示
*
* http://en.wikipedia.org/wiki/HSL_and_HSV
* http://axonflux.com/handy-rgb-to-hsl-and-rgb-to-hsv-color-model-c
*/
var HSLColor = /** @class */ (function () {
function HSLColor(h, s, l, a) {
this.h = h;
this.s = s;
this.l = l;
this.a = a;
}
HSLColor.hue2rgb = function (p, q, t) {
if (t < 0) {
t += 1;
}
if (t > 1) {
t -= 1;
}
if (t < 1 / 6) {
return p + (q - p) * 6 * t;
}
if (t < 1 / 2) {
return q;
}
if (t < 2 / 3) {
return p + (q - p) * (2 / 3 - t) * 6;
}
return p;
};
HSLColor.fromRGBA = function (r, g, b, a) {
r /= 255;
g /= 255;
b /= 255;
var max = Math.max(r, g, b);
var min = Math.min(r, g, b);
var h = (max + min) / 2;
var s = h;
var l = h;
if (max === min) {
h = s = 0; // achromatic
}
else {
var d = max - min;
s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
switch (max) {
case r:
h = (g - b) / d + (g < b ? 6 : 0);
break;
case g:
h = (b - r) / d + 2;
break;
case b:
h = (r - g) / d + 4;
break;
}
h /= 6;
}
return new HSLColor(h, s, l, a);
};
HSLColor.prototype.toRGBA = function () {
var r;
var g;
var b;
if (this.s === 0) {
r = g = b = this.l; // achromatic
}
else {
var q = this.l < 0.5
? this.l * (1 + this.s)
: this.l + this.s - this.l * this.s;
var p = 2 * this.l - q;
r = HSLColor.hue2rgb(p, q, this.h + 1 / 3);
g = HSLColor.hue2rgb(p, q, this.h);
b = HSLColor.hue2rgb(p, q, this.h - 1 / 3);
}
return new Color(r * 255, g * 255, b * 255, this.a);
};
HSLColor.prototype.toString = function () {
var h = this.h.toFixed(0);
var s = this.s.toFixed(0);
var l = this.l.toFixed(0);
var a = this.a.toFixed(0);
return "hsla(" + h + ", " + s + ", " + l + ", " + a + ")";
};
return HSLColor;
}());
})(es || (es = {}));
var es;
(function (es) {
@@ -6217,7 +6597,7 @@ var es;
return this.repeat(this.approach(start, start + deltaAngle, shift), 360);
};
/**
* 将此 Vector 投影到另一个 Vector 上
* 将 Vector 投影到另一个 Vector 上
* @param other
*/
MathHelper.project = function (self, other) {

2
source/bin/framework.min.js vendored
View File

File diff suppressed because one or more lines are too long