JavaScript Color class

       颜色类以“Argb“色为基准,二进制分布格式为”A <<24 | R << 16 | G << 8 | B ”,它兼容标准的Rgb格式,可以快速的把一个Argb值相互转换成“Hex”、“Rgba / css3”所支持的形式。

       在很多时候我们并不需要保持“环境”运行于“Argb”色彩下,而”Rgb / BGR(24bit)“色几乎在“Web / DOM”的所有的场景内都可以遇到并被争取正确使用,所以 Color 类提供一组与 Rgb 的相关的”成员接口“与”静态接口“以提供对此色彩的访问。

       ”Rgb “色与”Argb“色最大的不同是,”Rgb“A必须是FF(不透明=纯色),而 ARgb 色基于一个 A通道、基数、Rgb通道 三数运算的公式,但它并不是真正透明的,正如无论任何 Rgb 颜色 A通道为0 那么一定等于”纯黑色“是相同的。 

/*
 *  Color class
 *     designers: liulilte
 *  提供与颜色的高级访问。
 */
var Color = function () {
    /* 
     * MetadataToken(RID)
     *  typedef 
     *      Color class
     */
    'use strict'

    var color = arguments[0];
    try {
        if (typeof color == 'string') {
            if (color.toLowerCase().indexOf('rgb') >= 0) {
                color = Color.ArgbStringToArgbNumber(color);
            } else {
                color = Color.ArgbHexToArgbNumber(color);
            }
        } else if (__instanceof(color, Color)) {
            color = color.Argb;
        } else if (typeof color != 'number') {
            color = ~(1 << 31);
        }
    } catch (e) { }
    color = Number(color);

    this.A = (color >> 24) & 0xff;
    this.R = (color >> 16) & 0xff;
    this.G = (color >> 8) & 0xff;
    this.B = color & 0xff;

    Object.defineProperty(this, 'Argb', {
        get: function () {
            var n =
                (this.A & 0xff) << 24 |
                (this.R & 0xff) << 16 |
                (this.G & 0xff) << 8 |
                this.B & 0xff;
            return n;
        }
    });

    Object.defineProperty(this, 'Rgb', {
        get: function () {
            var n =
                (this.R & 0xff) << 16 |
                (this.G & 0xff) << 8 |
                this.B & 0xff;
            return n;
        }
    });

    this.toString = function (format) {
        var n = this.Argb;
        if (format === 'x' || format === 'h') {
            return Color.ArgbNumberToArgbHex(n);
        } else if (format === 'i' || format === 'd') {
            return n.toString();
        } else if (format === 'a' || format === 's') {
            return Color.ArgbNumberToArgbString(n);
        }
        return "{A=" + this.A + ", R=" + this.R + ", G=" + this.G + ", B=" + this.B + "}";
    }
};
// ARGB字符串转换成ARGB十六进制格式。
Color.ArgbStringToArgbHex = function (s) {
    var argb = '00000000';
    if (s) {
        var matchs = s.match(/(\d+)/g);
        if (matchs) {
            argb = '';
            for (var i = 0; i < matchs.length; i++) {
                var n = Number(matchs[i]);
                var hex = n.toString(16);
                if (hex.length < 2) {
                    hex = '0' + hex;
                }
                argb += hex;
            }
            while (argb.length != 8) {
                argb = "FF" + argb;
            }
        }
    }
    return argb.toUpperCase();
}
// ARGB十六进制格式转换成ARGB数值。
Color.ArgbHexToArgbNumber = function (hex) {
    if (hex) {
        var i = Math.ceil((hex.length / 2)) - 1;
        if ((hex.length & 1) > 0) {
            hex = "0" + hex;
        }
        var n = [0, 0, 0, 0];
        for (var p = 3; i >= 0; i--) {
            var j = (i * 2);
            var k = 2;
            if (j + k > hex.length) {
                k = 1;
            }
            var h = hex.substr(j, k);
            n[p--] = parseInt(h, 16);
        }
        return n[0] << 24 | n[1] << 16 | n[2] << 8 | n[3];
    }
    return 0;
}
// ARGB十六进制格式转换成ARGB字符串。
Color.ArgbHexToArgbString = function (hex) {
    var argb = 'rgba(0, 0, 0, 0)';
    if (hex) {
        argb = Color.ArgbNumberToArgbString(Color.ArgbHexToArgbNumber(hex));
    }
    return argb;
}
// ARGB字符串转换成ARGB数值。
Color.ArgbStringToArgbNumber = function (s) {
    var hex = Color.ArgbStringToArgbHex(s);
    return Color.ArgbHexToArgbNumber(hex);
}
// ARGB数值转换成ARGB字符串。
Color.ArgbNumberToArgbString = function (n) {
    n = Number(n);
    n = [
        (n >> 16) & 0xff, // R
        (n >> 8) & 0xff, // G
        n & 0xff, // B
        ((n >> 24) & 0xff) / 255, // A
    ];
    return 'rgba(' + n[0] + ', ' + n[1] + ', ' + n[2] + ', ' + n[3].toFixed(2) + ')';
}
// RGB字符串转换成RGB十六进制格式。
Color.RgbStringToRgbHex = function (s) {
    return Color.RgbNumberToRgbHex(Color.ArgbStringToArgbNumber(s));
}
// RGB十六进制格式转换成RGB字符串。
Color.RgbHexToRgbString = function (hex) {
    return Color.RgbNumberToRgbString(Color.RgbHexToArgbNumber(hex));
}
// RGB十六进制格式转换成RGB颜色值。
Color.RgbHexToArgbNumber = function (hex) {
    return Color.ArgbHexToArgbNumber(hex);
}
// RGB数值转换成RGB十六进制格式
Color.RgbNumberToRgbHex = function (n) {
    var hex = Color.ArgbNumberToArgbHex(n);
    return hex.substr(2);
}
// RGB数值转换成RGB字符串。
Color.RgbNumberToRgbString = function (n) {
    n = Number(n);
    n = [
        (n >> 16) & 0xff,
        (n >> 8) & 0xff,
        n & 0xff,
    ];
    return 'rgb(' + n[0] + ', ' + n[1] + ', ' + n[2] + ')';
}
// ARGB数值转换成ARGB十六进制格式。
Color.ArgbNumberToArgbHex = function (n) {
    n = Number(n);
    n = [
        (n >> 24) & 0xff,
        (n >> 16) & 0xff,
        (n >> 8) & 0xff,
        n & 0xff,
    ];
    var hex = '';
    for (var i = 0; i < 4; i++) {
        var h = n[i].toString(16);
        if (h.length < 2) {
            h = '0' + h;
        }
        hex += h;
    }
    return hex;
}

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值