AS3: остановка цикла for при каждом проходе

Question

Итак, я разработал отличный способ создать пиксельный эффект стирания, с фрагментами видеороликов пикселей, вложенными в строки. Я создал цикл, который проходит через каждую строку, а затем еще один цикл внутри этого цикла для пикселей в каждой строке. Затем я использую случайное число от 1 до 0 для задержки перед альфа-увеличением пикселя. Я использовал Greensock для подростка, и он прекрасно работает.

Одна проблема, я не могу остановить цикл for для строк, и каждая строка появляется сразу. Тем не менее, пиксели смещены, и это хороший эффект, но я хочу, чтобы он двигался слева направо. Так что мой код выглядит следующим образом: (Кстати, AS3 имеет setTimeout, и он отлично работает)

function stripeWipeUp(stripe:MovieClip):void {

var total = stripe.numChildren;

for (var i:int = 0; i<total; i++) { // the rows
    trace(i);
    setTimeout(function() {
        trace("setTimeout: "+i);
        var row:MovieClip = stripe.getChildAt(i) as MovieClip;
        var pixTotal = row.numChildren;

        for (var j:int = 0; j<pixTotal; j++) { the pixels

            var pix:MovieClip = row.getChildAt(j) as MovieClip;
            var num = Math.floor(Math.random()*100)/100; // the delay
            pixUp(pix, num); // my greensock function

        }
    }, 500);    
}
}

Что происходит с setTimeout, так это то, что цикл «i» попадает в каждую строку (их 27) до того, как закончится один setTimeout. Таким образом, он не работает должным образом - следующий цикл не должен выполняться, пока setTimeout не закончится. Любая идея, как этого добиться, чтобы каждая строка остановилась примерно на 500 мс? Спасибо.

Answer 1

Ваша проблема с этим.

trace("setTimeout: "+i);

«я» - это не то, что вы думаете.Область «i» находится в stripeWipeUp, а не в анонимной функции.С учетом сказанного, «i» всегда является значением последнего изменения цикла, которое было выполнено для всех ваших анонимных функций.Таким образом, как вы можете видеть, когда триггер функций анона «i», скорее всего, будет равен «total».Вот почему мы избегаем использования анонимных функций, так как область очень трудно определить.Создайте массив и сохраните в нем собственный класс для каждого «пикселя», который будет контролировать то, что вы хотите сделать.В этом классе используется объект Timer, а не setTimeOut.setTimeOut - это мусорная функция, оставшаяся от AS2.

Answer 2

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

// the row of pixels
function row(stripe:MovieClip, i:int, up:Boolean, del:Number):void {

setTimeout(function() {

    var row:MovieClip = stripe.getChildAt(i) as MovieClip;
    var pixTotal = row.numChildren;

    for (var j:int = 0; j<pixTotal; j++) {

        var pix:MovieClip = row.getChildAt(j) as MovieClip;
        var num = Math.floor(Math.random()*100)/100;
        (up) ? pixUp(pix, num) : pixDown(pix, num);

    }
}, del);
}
// the rows in the "stripe"
function stripeWipe(stripe:MovieClip, up:Boolean):void {

var total = stripe.numChildren;
var del:Number = 0;

for (var i:int = 0; i<total; i++) {

    row(stripe, i, up, del);
    del = del+100;

}

}

Answer 3

Я бы включил в класс i и j, Timer и обработчик событий для Timer. В обработчике событий я бы:

• Сделайте свой эффект для пикселя, соответствующего j и i
• Обновить j (и i)
• Если пикселей больше, запланируйте следующее событие

Answer 4

сбросьте setTimeout и просто добавьте задержку, умноженную на i

var num = ( i * 500 ) + Math.floor(Math.random()*100)/100; // the delay