flex滤镜的使用(模糊、阴影等)包括几个flex在线编辑工具
DropShadowFilter 类,在Flash中为各种对象添加投影。阴影算法基于模糊滤镜,使用同一个框型滤镜。投影样式有3个选项,包括内缘或外缘阴影和挖空模式。
属性摘要。
|
属性 |
说明 |
---|---|---|
1. |
alpha:Number |
阴影颜色的 Alpha 透明度值。有效值为 0 到 1。例如,.25 设置透明度值为 25%。默认值是 1 |
2. |
angle:Number |
阴影的角度。有效值为 0 到 360?(浮点)。默认值是 45。角度值表示理论上的光源落在对象上的角度,它决定了效果相对于该对象的位置。 如果距离设置为 0,则该效果相对于该对象没有发生偏移,因此 angle 属性没有任何效果。 |
3. |
blurX:Number |
水平模糊量。有效值为 0 到 255(浮点)。默认值为 4。作为 2 的乘方的值(如 2、4、8、16 和 32)经过了优化,呈现速度比其它值更快。 |
4. |
blurY:Number |
垂直模糊量。有效值为 0 到 255(浮点)。默认值为 4。作为 2 的乘方的值(如 2、4、8、16 和 32)经过了优化,呈现速度比其它值更快。 |
5. |
color:Number |
阴影的颜色。有效值采用十六进制格式 0xRRGGBB。默认值为 0x000000 |
6. |
distance:Number |
阴影的偏移距离,以像素为单位。 默认值为 4(浮点) |
7. |
hideObject:Boolean |
表示是否隐藏对象。如果值为 true,则表示没有绘制对象本身,只有阴影是可见的。默认值为 false(显示对象)。 |
8. |
inner:Boolean |
表示阴影是否为内侧阴影。值为 true 表明是内侧阴影。默认为 false,即外侧阴影,它表示对象外缘周围的阴影。 |
9. |
knockout:Boolean |
应用挖空效果 (true),这将有效地使对象的填色变为透明,并显示文档的背景颜色。默认值为 false(不应用挖空效果)。 |
10. |
quality:Number |
应用滤镜的次数。有效值为 0 到 15。默认值为 1,它表示低品质。值为 2 表示中等品质,值为 3 表示高品质。滤镜的值越小,呈现速度越快。 |
11. |
strength:Number |
印记或散布的强度。该值越高,印记的颜色越深,而且阴影与背景之间的对比度也越强。有效值为 0 到 255。默认值为 1。 |
从这里看,可以知道模糊滤镜也是其中的一部分,属性比起模糊滤镜多很多。所以写属性比较累。
1).
import flash.filters.DropShadowFilter;
var myDrop:DropShadowFilter = new DropShadowFilter();
with (myDrop) {
distance = 10;
//偏移距离
angle = 45;
//角度
alpha = .25;
//透明度
blurX = 5;
//水平模糊量
blurY = 5;
//垂直模糊量
color = 0x0066FF;
//阴影颜色
hideObject = false;
//是否隐藏对象
inner = false;
//是否为内阴影
knockout = false;
//是否挖空
quality = 1;
//品质
strength = 1;
//强度
}
my_mc.filters = [myDrop];
2).也可以这么写
import flash.filters.DropShadowFilter;
distance = 10;
//偏移距离
angle = 45;
//角度
alpha = .25;
//透明度
blurX = 5;
//水平模糊量
blurY = 5;
//垂直模糊量
color = 0x0066FF;
//阴影颜色
hideObject = false;
//是否隐藏对象
inner = false;
//是否为内阴影
knockout = false;
//是否挖空
quality = 1;
//品质
strength = 1;
//强度
var myDrop:DropShadowFilter = new DropShadowFilter(distance, angle, color, alpha, blurX, blurY, strength, quality, inner, knockout, hideObject);
my_mc.filters = [myDrop];
上面的参数是可选的,粗体字不能省略,就是说属性的值是可选的,但不可以省略属性,而且属性一定要按次序写.
3).
import flash.filters.DropShadowFilter;
var my_property = {distance:10, angle:45, alpha:.55, blurX:5, blurY:5, color:0x0066FF, hideObject:false, inner:false, knockout:false, quality:1, strength:1};
var myDrop:DropShadowFilter = new DropShadowFilter();
for (var i in my_property) {
myDrop[i] = my_property[i];
}
my_mc.filters = [myDrop];
这个看上去简洁很多了, 才几行而已,注意写法,属性附值是用":" ,大家喜欢用哪种写法就用哪种吧,效果是一样的 .
还有一点,如果原先没有AS创建的滤镜效果,用AS创建的滤镜效果会把原先在滤镜面版的效果覆盖掉。
直接看到效果的话查看flex在线编辑工具-滤镜使用示例;
以下是flex在线编辑工具:
样式修改工具:
可以在线调整Flex2组件的样式(style),预览效果,并自动生成CSS
组件示例:
Flex2组件使用示例及代码
滤镜使用示例:
Filter效果预览及代码生成
矢量图转换工具:
上传位图,转换为EPS,SVG 或PNG下载。