Примеры данного эффекта можно посмотреть в оригинальном посте автора, там же можно загрузить библиотеку данного эффекта и SWC-файл. Просто нажмите кнопку и фон за модальным окном померкнет.
Работает это так. Класс PopUpManager имеет недокументированное внутреннее свойтсво modalWindowClass. Если задать в качестве значения этого свойства какой-нибудь класс, то его экземпляр будет создан при создании модального (только модального!) окна. Экземпляр появляется позади модального окна и изменяет внешний вид приложения.
Alistair создал класс SaturationFadePopUpBlocker, который использует его новый эффект SaturationFade. SaturationFade изменяет насыщенность компонента, который является целью эффекта.
Чтобы добавить данный эффект в приложение, необходимо добавить в обработчик creationComplete строку:
PopUpManager.mx_internal::modalWindowClass =
SaturationFadePopUpBlocker;
Вот переделанный пример из документации с использованием данного эффекта:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
creationComplete="doInit();">
<mx:Script>
<![CDATA[
import mx.managers.PopUpManager;
import mx.core.IFlexDisplayObject;
import com.adobe.effects.*;
private function doInit():void {
PopUpManager.mx_internal::modalWindowClass =
SaturationFadePopUpBlocker;
}
private function showLogin():void {
var helpWindow:IFlexDisplayObject =
PopUpManager.createPopUp(this, MyLoginForm, true);
}
]]>
</mx:Script>
<mx:VBox>
<mx:Button click="showLogin();" label="Login"/>
<mx:Image source="img/sunset.jpg" />
</mx:VBox>
</mx:Application>
Необходимо еще само модальное окно, но его можно взять из хелпа. Изменений никаких в нем нет.
Естественно, все классы или swc файлы должны быть импортированны.
Эффект можно настроить для любого уровня насыщенности. Эффект SaturationFade можно использовать отдельно. В следующем примере эффект проигрывается при нажатии на изображения. Насыщенность меняется с 1 до 0. При отпускании эффект проигрывается в обратную сторону:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
xmlns:eff="com.adobe.effects.*" >
<mx:Script>
<![CDATA[
import com.adobe.effects.SaturationFade;
]]>
</mx:Script>
<eff:SaturationFade id="fadeToGray" duration="500"
saturationFrom="1" saturationTo="0" />
<eff:SaturationFade id="fadeBack" duration="500"
saturationFrom="0" saturationTo="1" />
<mx:Image mouseDownEffect="fadeToGray" mouseUpEffect="fadeBack"
source="sunset.jpg" />
</mx:Application>
Кого интересует реализация данного эффекта во Flash - добро пожаловать.
Комментариев нет:
Отправить комментарий