В ожидании завершения Flex-эффектов

Question

Я новичок Flex, которому поручено усовершенствовать существующее приложение. Одним из таких улучшений является получение поля, которое в настоящее время показывает время плавного перехода назад и вперед между отображением времени и даты.

Я знаю, что правильный способ сделать это - встроить файл шрифта в приложение, чтобы я мог постепенно увеличивать и уменьшать метку. Я пытаюсь избежать этого, если смогу, поскольку предпочел бы сделать свои изменения максимально незаметными.

Я придумал разумный обходной путь: создать «экран конфиденциальности», который точно соответствует размеру, форме и цвету фона часов; инициализируйте его альфа к 0; затем, при изменении времени / даты, добавьте экран конфиденциальности, внесите изменения и снова отключите экран.

Код выглядит примерно так:

    var targets:Array = new Array();
    targets.push(this.privacyScreen);
    this.effectFadeIn.play(targets);
    this.mylabel.text = "I am a date and/or time";
    this.effectFadeOut.play(targets);

... с ключевыми компонентами, похожими на это:

<mx:Label text="" id="mylabel" width="100%" height="100%" x="0" y="0" color="0xff0000"/>
<mx:Canvas id="privacyScreen" width="100%" height="100%" x="0" y="0" alpha="1" backgroundColor="{myConfiguration.backgroundColor}"/>
<mx:Fade id="effectFadeIn" alphaFrom="0.0" alphaTo="1.0" duration="250"/>
<mx:Fade id="effectFadeOut" alphaFrom="1.0" alphaTo="0.0" duration="250"/>

Как, я уверен, опытные дизайнеры Flex уже знают, этот код сделан из восхитительного свежего FAIL. Основное предположение, что выполнение будет ждать окончания эффекта постепенного появления, неверно, и эффект затухания, по-видимому, игнорируется, пока затухание еще продолжается.

Так что, думаю, у меня есть два связанных вопроса:

1. Можно ли приостановить выполнение при ожидании завершения эффекта?
2. Является ли этот подход даже жизнеспособным, или он просто пахнет «Делать это неправильно» сверху донизу?

Заранее благодарю за любые идеи, которые кто-либо может предложить.

(И я заранее признаю, что чем больше я пытаюсь научиться этому, тем больше осознаю, что мне нужно воспользоваться некоторыми из обучающих ресурсов онлайн .)

Answer 1

Я немного поиграл с твоим кодом, это то, что ты ищешь?

<?xml version="1.0" encoding="utf-8"?>
<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml"
    layout="absolute"
    creationComplete="onComplete();">

    <mx:Script>
        <![CDATA[
            private var targets:Array = new Array();
            private function onComplete():void {
                targets.push(canv);
                effectFadeOut.play(targets);
            }
            private function onFadeInEnd():void {
                effectFadeOut.play(targets);
            }
            private function onFadeOutEnd():void {
                effectFadeIn.play(targets);
            }
        ]]>
    </mx:Script>

    <mx:Label text="{(new Date()).toString()}" id="lbl" x="0" y="0" color="0xff0000"/>
    <mx:Canvas id="canv" width="100%" height="{lbl.height+5}" x="0" y="0" backgroundColor="#000000"/>

    <mx:Fade id="effectFadeIn" alphaFrom="0.0" alphaTo="1.0" duration="250"
        effectEnd="onFadeInEnd();" />
    <mx:Fade id="effectFadeOut" alphaFrom="1.0" alphaTo="0.0" duration="250"
        effectEnd="onFadeOutEnd();" />

</mx:WindowedApplication>

Надеюсь, это поможет:)

Answer 2

Ваш код выполняется , а метка исчезает. this.effectFadeIn.play () не ожидает его завершения. Я бы добавил вызов setTimeout к строкам кода, которые нужно вызвать позже, или, что еще лучше, поместил их в другую функцию. Затем через определенный интервал снова вызовите функцию.

import flash.utils.*;

private function FadeIn () : void {
    var targets:Array = new Array();
    targets.push(this.privacyScreen);
    this.effectFadeIn.play(targets);
    this.mylabel.text = "I am a date and/or time";
    setTimeout (function (): void {FadeOut (targets);}, effectFadeIn.duration); // Function and duration
}
private function FadeOut (targets : Array) : void {
    this.effectFadeOut.play(targets);
    setTimeout (FadeIn (), this.effectFadeOut.duration;
}

Я почти уверен, что это должно сработать ...