`

[转] flex中如何改变饱和度和对比度

阅读更多
http://bbs.9ria.com/viewthread.php?tid=79995&extra=page%3D1%26amp%3Borderby%3Ddateline%26amp%3Bfilter%3D2592000


请问flex中如何改变图片的饱和度和对比度?我知道改变亮度是改变红绿蓝三个通道的偏移量,那饱和度和对比度是改变什么呢?




给你转一个,我一直用,还不错
/**
* ColorMatrix by Grant Skinner. August 8, 2005
* Updated to AS3 November 19, 2007
* Visit www.gskinner.com/blog for documentation, updates and more free code.
*
* You may distribute this class freely, provided it is not modified in any way (including
* removing this header or changing the package path).
*
* Please contact info@gskinner.com prior to distributing modified versions of this class.

*usage:http://www.gskinner.com/blog/archives/2005/09/flash_8_source.html

*var cm = new ColorMatrix();
* cm.adjustColor(20,20,20,20);
*displayObject.filters = [new ColorMatrixFilter(cm)];
*/

package com.gskinner.geom
{

    dynamic public class ColorMatrix extends Array
    {

// constant for contrast calculations:
        private static const DELTA_INDEX:Array = [
            0,    0.01, 0.02, 0.04, 0.05, 0.06, 0.07, 0.08, 0.1, 0.11,
            0.12, 0.14, 0.15, 0.16, 0.17, 0.18, 0.20, 0.21, 0.22, 0.24,
            0.25, 0.27, 0.28, 0.30, 0.32, 0.34, 0.36, 0.38, 0.40, 0.42,
            0.44, 0.46, 0.48, 0.5, 0.53, 0.56, 0.59, 0.62, 0.65, 0.68, 
            0.71, 0.74, 0.77, 0.80, 0.83, 0.86, 0.89, 0.92, 0.95, 0.98,
            1.0, 1.06, 1.12, 1.18, 1.24, 1.30, 1.36, 1.42, 1.48, 1.54,
            1.60, 1.66, 1.72, 1.78, 1.84, 1.90, 1.96, 2.0, 2.12, 2.25, 
            2.37, 2.50, 2.62, 2.75, 2.87, 3.0, 3.2, 3.4, 3.6, 3.8,
            4.0, 4.3, 4.7, 4.9, 5.0, 5.5, 6.0, 6.5, 6.8, 7.0,
            7.3, 7.5, 7.8, 8.0, 8.4, 8.7, 9.0, 9.4, 9.6, 9.8, 
            10.0
           ];

        // identity matrix constant:
        private static const IDENTITY_MATRIX:Array = [
            1,0,0,0,0,
            0,1,0,0,0,
            0,0,1,0,0,
            0,0,0,1,0,
            0,0,0,0,1
           ];
        private static const LENGTH:Number = IDENTITY_MATRIX.length;


// initialization:
        public function ColorMatrix(p_matrix:Array = null)
        {
            p_matrix = fixMatrix(p_matrix);
            copyMatrix(((p_matrix.length == LENGTH) ? p_matrix : IDENTITY_MATRIX));
        }


// public methods:
        public function reset():void
        {
            for (var i:uint = 0; i < LENGTH; i++)
            {
                this[i] = IDENTITY_MATRIX[i];
            }
        }

        public function adjustColor(p_brightness:Number, p_contrast:Number, p_saturation:Number, p_hue:Number):void
        {
            adjustHue(p_hue);
            adjustContrast(p_contrast);
            adjustBrightness(p_brightness);
            adjustSaturation(p_saturation);
        }

        public function adjustBrightness(p_val:Number):void
        {
            p_val = cleanValue(p_val, 100);
            if (p_val == 0 || isNaN(p_val))
            {
                return;
            }
             multiplyMatrix([
                 1,0,0,0,p_val,
                 0,1,0,0,p_val,
                 0,0,1,0,p_val,
                 0,0,0,1,0,
                 0,0,0,0,1
                ]);
        }

        public function adjustContrast(p_val:Number):void
        {
            p_val = cleanValue(p_val, 100);
            if (p_val == 0 || isNaN(p_val))
            {
                return;
            }
            var x:Number;
            if (p_val < 0)
            {
                x = 127 + p_val / 100 * 127
            }
            else
            {
                x = p_val % 1;
                if (x == 0)
                {
                    x = DELTA_INDEX[p_val];
                }
                else
                {
                    //x = DELTA_INDEX[(p_val<<0)]; // this is how the IDE does it.
                    x = DELTA_INDEX[(p_val << 0)] * (1 - x) + DELTA_INDEX[(p_val << 0) + 1] * x; // use linear interpolation for more granularity.
                }
                x = x * 127 + 127;
            }
            multiplyMatrix([
                 x/127,0,0,0,0.5*(127-x),
                 0,x/127,0,0,0.5*(127-x),
                 0,0,x/127,0,0.5*(127-x),
                 0,0,0,1,0,
                 0,0,0,0,1
                ]);

        }

        public function adjustSaturation(p_val:Number):void
        {
            p_val = cleanValue(p_val, 100);
            if (p_val == 0 || isNaN(p_val))
            {
                return;
            }
            var x:Number = 1 + ((p_val > 0) ? 3 * p_val / 100 : p_val / 100);
            var lumR:Number = 0.3086;
            var lumG:Number = 0.6094;
            var lumB:Number = 0.0820;
            multiplyMatrix([
                 lumR*(1-x)+x,lumG*(1-x),lumB*(1-x),0,0,
                 lumR*(1-x),lumG*(1-x)+x,lumB*(1-x),0,0,
                 lumR*(1-x),lumG*(1-x),lumB*(1-x)+x,0,0,
                 0,0,0,1,0,
                 0,0,0,0,1
                ]);

        }

        public function adjustHue(p_val:Number):void
        {
            p_val = cleanValue(p_val, 180) / 180 * Math.PI;
            if (p_val == 0 || isNaN(p_val))
            {
                return;
            }
            var cosVal:Number = Math.cos(p_val);
            var sinVal:Number = Math.sin(p_val);
            var lumR:Number = 0.213;
            var lumG:Number = 0.715;
            var lumB:Number = 0.072;
            multiplyMatrix([
                 lumR+cosVal*(1-lumR)+sinVal*(-lumR),lumG+cosVal*(-lumG)+sinVal*(-lumG),lumB+cosVal*(-lumB)+sinVal*(1-lumB),0,0,
                 lumR+cosVal*(-lumR)+sinVal*(0.143),lumG+cosVal*(1-lumG)+sinVal*(0.140),lumB+cosVal*(-lumB)+sinVal*(-0.283),0,0,
                 lumR+cosVal*(-lumR)+sinVal*(-(1-lumR)),lumG+cosVal*(-lumG)+sinVal*(lumG),lumB+cosVal*(1-lumB)+sinVal*(lumB),0,0,
                 0,0,0,1,0,
                 0,0,0,0,1
                ]);

        }

        public function concat(p_matrix:Array):void
        {
            p_matrix = fixMatrix(p_matrix);
            if (p_matrix.length != LENGTH)
            {
                return;
            }
            multiplyMatrix(p_matrix);
        }

        public function clone():ColorMatrix
        {
            return new ColorMatrix(this);
        }

        public function toString():String
        {
            return "ColorMatrix [ " + this.join(" , ") + " ]";
        }

        // return a length 20 array (5x4):
        public function toArray():Array
        {
            return slice(0, 20);
        }

// private methods:
        // copy the specified matrix's values to this matrix:
        protected function copyMatrix(p_matrix:Array):void
        {
            var l:Number = LENGTH;
            for (var i:uint = 0; i < l; i++)
            {
                this[i] = p_matrix[i];
            }
        }

        // multiplies one matrix against another:
        protected function multiplyMatrix(p_matrix:Array):void
        {
            var col:Array = [];

            for (var i:uint = 0; i < 5; i++)
            {
                for (var j:uint = 0; j < 5; j++)
                {
                    col[j] = this[j + i * 5];
                }
                for (j = 0; j < 5; j++)
                {
                    var val:Number = 0;
                    for (var k:Number = 0; k < 5; k++)
                    {
                        val += p_matrix[j + k * 5] * col[k];
                    }
                    this[j + i * 5] = val;
                }
            }
        }

        // make sure values are within the specified range, hue has a limit of 180, others are 100:
        protected function cleanValue(p_val:Number, p_limit:Number):Number
        {
            return Math.min(p_limit, Math.max(-p_limit, p_val));
        }

        // makes sure matrixes are 5x5 (25 long):
        protected function fixMatrix(p_matrix:Array = null):Array
        {
            if (p_matrix == null)
            {
                return IDENTITY_MATRIX;
            }
            if (p_matrix is ColorMatrix)
            {
                p_matrix = p_matrix.slice(0);
            }
            if (p_matrix.length < LENGTH)
            {
                p_matrix = p_matrix.slice(0, p_matrix.length).concat(IDENTITY_MATRIX.slice(p_matrix.length, LENGTH));
            }
            else if (p_matrix.length > LENGTH)
            {
                p_matrix = p_matrix.slice(0, LENGTH);
            }
            return p_matrix;
        }
    }
}

分享到:
评论

相关推荐

    flex放大镜、flex滤镜、flex图像放大、局部图像放大

    Flex滤镜通常指的是在Flex环境中应用CSS滤镜效果,这些滤镜可以改变元素的视觉表现,例如模糊、亮度、对比度、饱和度等。虽然CSS3滤镜并非Flexbox特有的,但它们可以与Flexbox布局结合使用,以创造出更具动态感和...

    flex中给图片或任意组件着色的方法

    例如,我们可以创建一个颜色矩阵来实现饱和度、亮度、对比度的调整,或者直接进行色彩转换。以下是一个简单的例子: ```actionscript var matrix:Array = [1, 0, 0, 0, redValue, 0, 1, 0, 0, greenValue, 0, 0...

    srl.rar_ColorMatrixArrays.as_SRL_flex_flex 操作系统_flex portal

    颜色矩阵可以用来实现各种图像滤镜和特效,例如色彩校正、饱和度调整、亮度和对比度改变等。在Flex应用中,这种功能可能用于机柜管理系统的可视化部分,比如显示不同状态的机柜用不同的颜色表示。 “flex_portal”...

    Flex中的各种滤镜

    例如,你可以使用它来调整亮度、对比度、饱和度,甚至进行色彩平衡调整。 6. **ConvolutionFilter(卷积滤镜)** ConvolutionFilter使用矩阵运算来改变图像像素,可以实现如锐化、模糊、边缘检测等多种图像处理...

    Flex_4_Fun

    2. **颜色调整滤镜**:包括亮度、对比度、饱和度等多种颜色调整选项,可用于美化图片或改变图片的整体色调。 3. **阴影滤镜**:添加投影效果,增强图形的真实感和立体感。 4. **扭曲滤镜**:通过对图像进行扭曲变形...

    使用filters中的ColorMatrixFilter

    `ColorMatrixFilter`通常在ActionScript 3(AS3)和Flex中使用,允许开发者通过调整颜色矩阵来改变舞台上显示对象的颜色、亮度、对比度、饱和度等属性。在给定的示例中,我们有一个名为`ColorMatrixFilterSample....

    颜色控制器

    用户可以通过调整HSL(色相、饱和度、亮度)或RGB(红、绿、蓝)值来选择颜色,这些值可以动态更新并显示在组件上。 在设计优美颜色控制器时,考虑以下几点是至关重要的: 1. **用户体验**:确保颜色选择过程直观...

    flash as 3利用滤镜变换位图颜色

    但是,通过改变矩阵中的值,我们可以实现各种颜色效果,如灰度、饱和度调整、色调和对比度变化等。 以下是一个简单的`ColorMatrixFilter`应用示例: ```actionscript import flash.filters.ColorMatrixFilter; ...

    css入门笔记

    改变元素的宽度和高度 2.语法 width:宽度 取值:px % min-width:最小宽度 max-width:最大宽度 height:高度 取值:px % min-height:最小高度 max-height:最大高度 3.页面中允许修改尺寸的元素 1.所有的块...

    CSS3鼠标悬停放大图片两边模糊显示特效

    `transition`用于控制元素在不同状态之间转换时的动画效果,而`filter`则可以对元素应用图像处理效果,如模糊、灰度、饱和度调整等。 1. **CSS3 Transition**: - `transition-property`: 定义过渡效果应用于哪个...

    css3倾角瀑布流图片布局代码

    CSS3滤镜允许开发者对元素应用图像处理效果,如模糊、灰度、饱和度调整等。在这个项目中,滤镜可能被用来为图片添加阴影、色彩调整或者透明度变化,增强图片的整体视觉效果。例如,可以使用`filter`属性来实现: ``...

    深红色人物相册CSS模板是一款适合做相册展示的CSS网页模板 .rar

    设计师可能通过调整饱和度和透明度创建不同的深红色渐变,以增加视觉层次感。 至于字体,CSS提供了丰富的字体样式控制,如`font-family`、`font-size`、`font-weight`等,以确保文本在不同设备上的可读性和一致性。...

    unifi-video-api:适用于UniFi视频的Python API

    统一视频API 用于与UniFi视频接口的Python API... 设置或显示图片设置:亮度,对比度,饱和度,色相,降噪,清晰度,动态范围 设置或显示红外灯的状态 设置或显示显示的文字 设置或显示时间戳状态 设置或显示水印/徽标

    picture-art

    6. CSS图像滤镜:通过CSS的`filter`属性,可以实现图像的艺术效果,如模糊、对比度调整、饱和度改变、色调和饱和度混合等,创造出各种艺术风格。 7. SVG图形:对于矢量图像,可以直接将SVG代码嵌入HTML中,或者通过...

    手机CAMERA介绍

    4. **色彩饱和度**:评价图像色彩的鲜艳程度。 5. **白平衡**:测量在不同光照条件下图像色彩的准确性。 6. **Gamma**:评估图像明暗对比度。 7. **信噪比**:测量图像中信号与噪声的比例。 8. **动态范围**:评估...

    CSS制作清爽绿色格调图文box通用样式

    同时,可以通过调整饱和度和亮度,使得绿色与背景和其他元素产生良好的对比。 接下来,构建图文box的结构。一个典型的图文box通常由以下部分组成: 1. **图片容器**:用于展示小图片。可以设置固定宽度和高度,...

Global site tag (gtag.js) - Google Analytics