Flex 實現(xiàn)可以拖動的毛玻璃效果
更新時間:2009年11月15日 22:41:01 作者:
這是一個使用Flex實現(xiàn)的可拖動的毛玻璃效果(效果在文章后面),具體我就不說了,直接帖代碼。
復制代碼 代碼如下:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" clipContent="true" verticalScrollPolicy="off" horizontalScrollPolicy="off"
width="100%" height="100%" horizontalAlign="center" verticalAlign="middle" backgroundColor="#FFFFFF"
creationComplete="onCreationComplete(event)" mouseUp="onMouseUp(event)" mouseMove="onMouseMove(event)">
<mx:Script source="FrostedGlass.as"/>
<mx:Container id="ctlContainer" x="0" y="0" width="100%" height="100%"
clipContent="true" horizontalScrollPolicy="off" verticalScrollPolicy="off">
<mx:Image horizontalAlign="center" id="ctlImage" x="0" y="0" width="1024" height="768" maintainAspectRatio="true"
source="@Embed(source='images/bg.jpg')"
/>
</mx:Container>
<mx:Box borderStyle="solid" borderThickness="1"
borderColor="#000000" render="onBoxRender(event)"
x="200" y="200" height="200" width="400" id="ctlBox"
filters="{[new DropShadowFilter(5, 45, 0x000000,0.5)]}"
mouseDown="onMouseDown(event)" />
</mx:Application>
此場景對應的類為:
復制代碼 代碼如下:
// ActionScript file
import flash.display.BitmapData;
import flash.events.Event;
import flash.events.MouseEvent;
import flash.filters.BlurFilter;
import flash.geom.Matrix;
import flash.geom.Point;
import flash.geom.Rectangle;
private var m_mouseDown : Boolean = false;
private var m_offsetPt : Point;
private function onCreationComplete(evt:Event) : void
{
onBoxRender(null);
}
private function onBoxRender(evt:Event) : void
{
if( ctlContainer.width > 0 && ctlContainer.height > 0 )
{
var bmpData : BitmapData = new BitmapData( ctlContainer.width, ctlContainer.height, false);
var matrix : Matrix = new Matrix();
// 對矩陣進行平移變換
matrix.translate( -1 * ctlBox.x, -1 * ctlBox.y);
// 將背景填充到移動元件上來
bmpData.draw( ctlContainer
, matrix
, null
, null
, new Rectangle( 0, 0, ctlBox.width + 4, ctlBox.height + 4) // 裁剪區(qū)域
);
bmpData.applyFilter( bmpData
, new Rectangle( 0, 0, bmpData.width, bmpData.height)
, new Point( 0, 0)
, new BlurFilter( 5, 5, 5) // BlurFilter的參數(shù)越大計算量越大 移動的時候越卡
);
ctlBox.graphics.beginBitmapFill(bmpData, null, false, false);
ctlBox.graphics.drawRect( 0, 0, ctlBox.width, ctlBox.height);
ctlBox.graphics.endFill();
}
}
private function onMouseDown(evt:MouseEvent) : void
{
m_mouseDown = true;
m_offsetPt = new Point( ctlBox.mouseX, ctlBox.mouseY);
}
private function onMouseUp(evt:MouseEvent) : void
{
m_mouseDown = false;
evt.updateAfterEvent();
}
private function onMouseMove(evt:MouseEvent) : void
{
if( m_mouseDown )
{
ctlBox.x = evt.stageX - m_offsetPt.x;
ctlBox.y = evt.stageY - m_offsetPt.y;
evt.updateAfterEvent();
}
}
// ActionScript file
import flash.display.BitmapData;
import flash.events.Event;
import flash.events.MouseEvent;
import flash.filters.BlurFilter;
import flash.geom.Matrix;
import flash.geom.Point;
import flash.geom.Rectangle;
private var m_mouseDown : Boolean = false;
private var m_offsetPt : Point;
private function onCreationComplete(evt:Event) : void
{
onBoxRender(null);
}
private function onBoxRender(evt:Event) : void
{
if( ctlContainer.width > 0 && ctlContainer.height > 0 )
{
var bmpData : BitmapData = new BitmapData( ctlContainer.width, ctlContainer.height, false);
var matrix : Matrix = new Matrix();
// 對矩陣進行平移變換
matrix.translate( -1 * ctlBox.x, -1 * ctlBox.y);
// 將背景填充到移動元件上來
bmpData.draw( ctlContainer
, matrix
, null
, null
, new Rectangle( 0, 0, ctlBox.width + 4, ctlBox.height + 4) // 裁剪區(qū)域
);
bmpData.applyFilter( bmpData
, new Rectangle( 0, 0, bmpData.width, bmpData.height)
, new Point( 0, 0)
, new BlurFilter( 5, 5, 5) // BlurFilter的參數(shù)越大計算量越大 移動的時候越卡
);
ctlBox.graphics.beginBitmapFill(bmpData, null, false, false);
ctlBox.graphics.drawRect( 0, 0, ctlBox.width, ctlBox.height);
ctlBox.graphics.endFill();
}
}
private function onMouseDown(evt:MouseEvent) : void
{
m_mouseDown = true;
m_offsetPt = new Point( ctlBox.mouseX, ctlBox.mouseY);
}
private function onMouseUp(evt:MouseEvent) : void
{
m_mouseDown = false;
evt.updateAfterEvent();
}
private function onMouseMove(evt:MouseEvent) : void
{
if( m_mouseDown )
{
ctlBox.x = evt.stageX - m_offsetPt.x;
ctlBox.y = evt.stageY - m_offsetPt.y;
evt.updateAfterEvent();
}
}
對于Flex/Silverlight開發(fā)者來說很不方便。只能用第三方站點才能放Flash/Silverlight

相關文章
Flex和.NET協(xié)同開發(fā)利器FluorineFx Flex與.NET互操作
在本系列前面幾篇文章中分別介紹了通過WebService、HTTPService、URLLoader以及FielReference等組件或類來完成Flex與.NET服務端的通信的相關知識點。2009-06-06Flex與.NET互操作(十):FluorineFx.Net的及時通信應用(ApplicationAdapter)(一)
使用FluorineFx.Net開發(fā)的每一個實時通訊功能應用都擁有一個應用程序適配器(ApplicationAdapter),用來管理整個實時通訊應用的生命周期,以及接受和拒絕客戶端的連接等。2009-06-06Flex Gumbo 通過textJustify樣式設置TextBox文字對齊的例子
接下來的例子演示了Flex Gumbo中如何通過textJustify樣式,設置TextBox文字對齊。2009-06-06