javascript/NativeScript
1
0
Fork 0
mirror of https://github.com/NativeScript/NativeScript.git synced 2025-08-23 09:01:10 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix: color hex getter fix

Browse Source
This commit is contained in:
Martin Guillon
2021-06-08 18:13:22 +02:00
parent 3d4b46c403
commit 97a94e82a8
1 changed files with 48 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
packages/core/color/color-common.ts
View File

@ -72,7 +72,8 @@ export class Color implements definition.Color {
if (this.a === 0xff) { if (this.a === 0xff) {
return SHARP + ((1 << 24) + (this.r << 16) + (this.g << 8) + this.b).toString(16).slice(1); return SHARP + ((1 << 24) + (this.r << 16) + (this.g << 8) + this.b).toString(16).slice(1);
} else { } else {
return SHARP + this._argb.toString(16); const hex = this._argb.toString(16);
return SHARP + hex.slice(2) + hex.slice(0, 2);
} }
} }
@ -160,7 +161,6 @@ export class Color implements definition.Color {
return hex; return hex;
} }
public toString(): string { public toString(): string {
return this.hex; return this.hex;
} }
@ -245,7 +245,9 @@ export class Color implements definition.Color {
*/ */
public toHslString() { public toHslString() {
const hsl = rgbToHsl(this.r / 255, this.g / 255, this.b / 255); const hsl = rgbToHsl(this.r / 255, this.g / 255, this.b / 255);
const h = Math.round(hsl.h * 360), s = Math.round(hsl.s * 100), l = Math.round(hsl.l * 100); const h = Math.round(hsl.h * 360),
s = Math.round(hsl.s * 100),
l = Math.round(hsl.l * 100);
const a = this.a; const a = this.a;
return a == 255 ? 'hsl(' + h + ', ' + s + '%, ' + l + '%)' : 'hsla(' + h + ', ' + s + '%, ' + l + '%, ' + (a / 255).toFixed(2) + ')'; return a == 255 ? 'hsl(' + h + ', ' + s + '%, ' + l + '%)' : 'hsla(' + h + ', ' + s + '%, ' + l + '%, ' + (a / 255).toFixed(2) + ')';
} }
@ -265,7 +267,9 @@ export class Color implements definition.Color {
*/ */
public toHsvString() { public toHsvString() {
const hsv = rgbToHsv(this.r / 255, this.g / 255, this.b / 255); const hsv = rgbToHsv(this.r / 255, this.g / 255, this.b / 255);
const h = Math.round(hsv.h * 360), s = Math.round(hsv.s * 100), v = Math.round(hsv.v * 100); const h = Math.round(hsv.h * 360),
s = Math.round(hsv.s * 100),
v = Math.round(hsv.v * 100);
const a = this.a; const a = this.a;
return a == 255 ? 'hsv(' + h + ', ' + s + '%, ' + v + '%)' : 'hsva(' + h + ', ' + s + '%, ' + v + '%, ' + (a / 255).toFixed(2) + ')'; return a == 255 ? 'hsv(' + h + ', ' + s + '%, ' + v + '%)' : 'hsva(' + h + ', ' + s + '%, ' + v + '%, ' + (a / 255).toFixed(2) + ')';
} }
@ -285,7 +289,7 @@ export class Color implements definition.Color {
* @param amount (between 0 and 100) * @param amount (between 0 and 100)
*/ */
public desaturate(amount: number) { public desaturate(amount: number) {
amount = (amount === 0) ? 0 : (amount || 10); amount = amount === 0 ? 0 : amount || 10;
const hsl = rgbToHsl(this.r / 255, this.g / 255, this.b / 255); const hsl = rgbToHsl(this.r / 255, this.g / 255, this.b / 255);
hsl.s -= amount / 100; hsl.s -= amount / 100;
hsl.s = Math.min(1, Math.max(0, hsl.s)); hsl.s = Math.min(1, Math.max(0, hsl.s));
@ -298,7 +302,7 @@ export class Color implements definition.Color {
* @param amount (between 0 and 100) * @param amount (between 0 and 100)
*/ */
public saturate(amount: number) { public saturate(amount: number) {
amount = (amount === 0) ? 0 : (amount || 10); amount = amount === 0 ? 0 : amount || 10;
const hsl = rgbToHsl(this.r / 255, this.g / 255, this.b / 255); const hsl = rgbToHsl(this.r / 255, this.g / 255, this.b / 255);
hsl.s += amount / 100; hsl.s += amount / 100;
hsl.s = Math.min(1, Math.max(0, hsl.s)); hsl.s = Math.min(1, Math.max(0, hsl.s));
@ -319,7 +323,7 @@ export class Color implements definition.Color {
* @param amount (between 0 and 100) * @param amount (between 0 and 100)
*/ */
public lighten(amount: number) { public lighten(amount: number) {
amount = (amount === 0) ? 0 : (amount || 10); amount = amount === 0 ? 0 : amount || 10;
const hsl = rgbToHsl(this.r / 255, this.g / 255, this.b / 255); const hsl = rgbToHsl(this.r / 255, this.g / 255, this.b / 255);
hsl.l += amount / 100; hsl.l += amount / 100;
hsl.l = Math.min(1, Math.max(0, hsl.l)); hsl.l = Math.min(1, Math.max(0, hsl.l));
@ -345,7 +349,7 @@ export class Color implements definition.Color {
* @param amount (between 0 and 100) * @param amount (between 0 and 100)
*/ */
public darken(amount: number) { public darken(amount: number) {
amount = (amount === 0) ? 0 : (amount || 10); amount = amount === 0 ? 0 : amount || 10;
const hsl = rgbToHsl(this.r / 255, this.g / 255, this.b / 255); const hsl = rgbToHsl(this.r / 255, this.g / 255, this.b / 255);
hsl.l -= amount / 100; hsl.l -= amount / 100;
hsl.l = Math.min(1, Math.max(0, hsl.l)); hsl.l = Math.min(1, Math.max(0, hsl.l));
@ -378,14 +382,14 @@ export class Color implements definition.Color {
const p = amount / 100; const p = amount / 100;
const rgba = { const rgba = {
r: ((color2.r - color1.r) * p) + color1.r, r: (color2.r - color1.r) * p + color1.r,
g: ((color2.g - color1.g) * p) + color1.g, g: (color2.g - color1.g) * p + color1.g,
b: ((color2.b - color1.b) * p) + color1.b, b: (color2.b - color1.b) * p + color1.b,
a: ((color2.a - color1.a) * p) + color1.a a: (color2.a - color1.a) * p + color1.a,
}; };
return new Color(rgba.a, rgba.r, rgba.g, rgba.b); return new Color(rgba.a, rgba.r, rgba.g, rgba.b);
}; }
} }
function isRgbOrRgba(value: string): boolean { function isRgbOrRgba(value: string): boolean {