Создание содержимого Animate для использования на мобильных устройствах

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

Дополнительные сложности для разработчиков, создающих содержимое в приложении Flash Lite, связаны с тем, что мобильные устройства сильно различаются по производительности. Если содержимое предназначено для публикации на большом количестве различных устройств, разработчикам иногда приходится создавать его в расчете на устройство с наименьшими возможностями.

Оптимизация мобильного содержимого требует компромиссов. Например, одни методы позволяют улучшить внешний вид содержимого, тогда как другие — повысить производительность. При оценке этих компромиссов приходится неоднократно переходить от проверки содержимого в эмуляторе к проверке на целевом устройстве, и наоборот. Содержимое необходимо просматривать на реальном устройстве, чтобы оценить достоверность цветопередачи, легкость чтения текста, физическое взаимодействие, правильность работы пользовательского интерфейса и другие характеристики реальной работы на мобильном устройстве.

Примечание.

Содержимое, посвященное Flash Lite, неприменимо к Flash CC и более поздним версиям. 

Рекомендации по созданию анимации для мобильных устройств с помощью программы Flash Lite

При создании анимации для мобильных устройств следует учитывать, что возможности процессоров этих устройств ограниченны. Соблюдение приведенных ниже рекомендаций позволит предотвратить замедление обработки содержимого, созданного в программе Flash Lite.

  • При создании файла Flash Lite необходимо проверить правильность настройки документа. Хотя файлы Animate поддерживают плавное масштабирование, производительность может падать при работе в рабочей области, размеры которой не являются оригинальными, и необходимости масштабирования файла в проигрывателе. Стремитесь, чтобы размер рабочей области документа совпадал с разрешением целевого устройства. Также выберите в Flash Player правильную версиюFlash Lite.

  • Программа Flash Lite обеспечивает визуализацию векторных изображений с низким, средним и высоким качеством. Чем выше качество визуализации, тем более плавно и точно программа Flash Lite отображает векторные изображения и тем выше будет нагрузка на процессор устройства. Чтобы обеспечить воспроизведение сложной анимации, поэкспериментируйте со сменой параметров качества проигрывателя и тщательно протестируйте SWF-файл. Качество визуализации SWF-файла задается с помощью свойства _quality или команды SetQuality. Допустимыми значениями для свойства _quality являются LOW, MEDIUM и HIGH.

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

  • Эффекты прозрачности (альфа-эффекты) следует применять к символам экономно, поскольку они требуют больших вычислительных ресурсов. Особенно следует избегать применения промежуточных кадров, содержащих символы с неполностью прозрачными альфа-уровнями (с прозрачностью менее 100 %).

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

  • Наиболее эффективные результаты могут получиться в результате экспериментов с сочетаниями промежуточных кадров, анимации ключевых кадров и движения на основе ActionScript.

  • Для визуализации векторных овалов и окружностей требуется намного больше памяти, чем для визуализации четырехугольников. Кроме того, использование круглых и овальных обводок приводит к значительному увеличению загрузки процессора.

  • Старайтесь чаще тестировать анимацию на реальных целевых устройствах.

  • При выводе области анимации программа Animate определяет прямоугольную ограничительную рамку вокруг этой области. Чтобы оптимизировать вывод, нужно сделать эту рамку как можно меньше. Избегайте наложения промежуточных кадров, поскольку Animate воспринимает области слияния как один прямоугольник, что приводит к созданию более крупной общей области. Оптимизировать анимацию можно с помощью функции «Показать область перерисовки» приложения Animate.

  • Не следует скрывать видеоролики на экране с помощью параметра _alpha = 0 или _visible = false. Если просто сделать видеоролик невидимым или задать для него нулевую альфа-прозрачность, то ролик будет по-прежнему обрабатываться при вычислениях линейной визуализации, что может привести к снижению производительности.

  • Аналогичным образом, не пытайтесь скрыть видеоролик путем наложения на него других графических объектов. Он все равно будет обрабатываться при вычислениях проигрывателя. Вместо этого следует перемещать видеоролики за пределы рабочей области или удалять их путем вызова функции removeMovieClip.

Растровые изображения и векторная графика Flash Lite в мобильных устройствах

В приложении Flash Lite предусмотрена визуализация как векторных, так и растровых изображений. У каждого из этих типов изображений есть свои преимущества и недостатки. Решение использовать векторные изображения вместо растровых не всегда очевидно и часто зависит от нескольких факторов.

Векторные изображения компактно представлены в SWF-файлах в виде математических уравнений, а проигрыватель Flash Lite производит их рендеринг во время выполнения. Растровые изображения, наоборот, представляются в виде массивов элементов изображения (пикселей), что требует больше байт данных. Таким образом, использование векторных изображений в файле позволяет уменьшить объем используемой памяти и размер файла.

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

Для визуализации векторных изображений требуется большая вычислительная мощность по сравнению с растровыми, особенно если речь идет о векторных изображениях с большим количеством сложных фигур и заливки. Следовательно, производительность при работе с файлами может иногда падать, если используется много векторных фигур. Визуализация растровых изображений требует меньше времени обработки, чем векторных, поэтому растровые изображения лучше подходят для некоторых типов файлов, например, для сложных дорожных карт, предназначенных для анимации и прокрутки на мобильном телефоне.

При разработке учитывайте следующие моменты.

  • Старайтесь не использовать контуры в векторных фигурах. Контуры имеют внутренний и внешний край (заливки имеют только один), поэтому для их визуализации требуется вдвое больше работы.

  • Визуализация углов проще, чем кривых. По возможности используйте плоские края, особенно в сочетании с очень маленькими векторными фигурами.

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

  • Как правило, небольшие сложные изображения (например, значки) следует делать растровыми, а более крупные и простые — векторными.

  • Следует импортировать растровые изображения необходимого размера. Не импортируйте большие изображения для последующего масштабирования в приложении Animate, поскольку при этом впустую тратится файловая и оперативная память.

  • Проигрыватель Flash Lite не поддерживает сглаживание растровых изображений. Качество растровых изображений при масштабировании или повороте ухудшается. Если изображение необходимо масштабировать или поворачивать, постарайтесь сделать его векторным.

  • Текст в конечном итоге можно представить как чрезвычайно сложную векторную фигуру. Конечно, текст часто бывает крайне важен, поэтому редко удается полностью обойтись без него. При использовании текста старайтесь не применять к нему анимацию и не помещайте его поверх анимации. Постарайтесь сделать текст растровым. Для многострочного динамического текста и текста ввода символ конца текстовой строки не кэшируется. В приложении Animate текст разбивается на строки во время выполнения, а повторное вычисление позиций символов конца строки происходит каждый раз при перерисовывании текстового поля. Вывод статических текстовых полей не вызывает сложностей, поскольку разбивка на строки выполняется предварительно, во время компиляции. При работе с динамическим содержимым невозможно обойтись без динамических текстовых полей, однако, по возможности, вместо них следует использовать статические поля.

  • Следует как можно меньше использовать прозрачность в PNG-файлах. При перерисовке приложению Animate приходится выполнять вычисления даже для прозрачных частей растрового изображения. Например, при использовании PNG-файла с прозрачным изображением, которое представляет элемент переднего плана, не следует экспортировать прозрачный PNG-файл полноэкранного размера. Вместо этого экспортируйте файл реального размера элемента переднего плана.

  • Старайтесь группировать растровые слои отдельно от векторных слоев. В приложении Animate для растрового и векторного содержимого используются разные средства визуализации, переключение между которыми занимает определенное время.

Сжатие растровых изображений Flash Lite для мобильных устройств

При использовании растровых изображений можно установить параметры сжатия изображения (отдельно для каждого изображения или глобально для всех растровых изображений), что позволяет уменьшить размер SWF-файла.

Настройка параметров сжатия для отдельного растрового файла

  1. Запустите приложение Animate и создайте документ.

  2. Выберите растровое изображение в окне «Библиотека».
  3. Чтобы открыть диалоговое окно «Свойства растрового изображения», щелкните правой кнопкой мыши (Windows) или щелкните, удерживая клавишу Control (Macintosh), значок растрового изображения в окне «Библиотека» и выберите команду «Свойства» в контекстном меню.
  4. Во всплывающем меню «Сжатие» выберите один из приведенных ниже параметров.
    • Выберите параметр «Фотография (JPEG)» для изображений со сложными вариациями цвета или тона, например, для фотографий или изображений с градиентными заливками. Этот параметр позволяет получить JPEG-файл. Установите флажок «Использовать импортированные данные JPEG», чтобы использовать качество сжатия по умолчанию, заданное для импортированного изображения. Чтобы задать новое значение качества сжатия, снимите флажок с параметра «Использовать импортированные данные JPEG» и задайте значение от 1 до 100 в текстовом поле «Качество». Чем больше значение параметра, тем выше качество изображения, но размер файла при этом также увеличивается. Подберите оптимальное значение.

    • Выберите параметр «Без потерь (PNG/GIF)» для изображений с простыми фигурами и небольшим количеством цветов. При выборе этого варианта изображение сжимается без потерь, то есть значимые данные не удаляются.

  5. Чтобы определить результаты сжатия файла, нажмите кнопку «Проверка».

    Чтобы решить, приемлем ли выбранный уровень сжатия, сравните размер первоначального файла с размером сжатого файла.

Настройка параметров сжатия для всех растровых изображений

  1. Выберите «Файл» > «Параметры публикации», затем откройте вкладку «Flash». Отобразятся параметры сжатия.
  2. Передвиньте ползунок, определяющий качество JPEG, или введите нужное значение. Чем выше значение качества JPEG, тем выше будет качество изображения, но размер SWF-файла при этом также увеличивается. Чем ниже качество изображения, тем меньше размер SWF-файла. Чтобы достигнуть компромисса между размером и качеством, попробуйте установить различные значения.

Оптимизация кадров Flash Lite для мобильных устройств

  • Большинство устройств, которые поддерживают Flash Lite, воспроизводят содержимое со скоростью приблизительно 15-20 кадров в секунду. Минимальная частота кадров — 6. Во время разработки задавайте частоту кадров документа, примерно равную скорости воспроизведения на целевом устройстве. Это позволяет смоделировать воспроизведение содержимого на устройстве с ограниченной производительностью. Перед публикацией конечного SWF-файла задайте частоту кадров документа не менее 20 кадров/с (или выше), чтобы не ограничивать производительность в том случае, если устройство поддерживает более высокую частоту кадров.

  • При использовании функции gotoAndPlay следует учитывать, что каждый кадр между текущим и запрашиваемым кадром необходимо инициализировать до того, как будет воспроизведен запрашиваемый кадр. Если большинство кадров имеет разное содержимое, то более эффективным может оказаться использование различных видеороликов, а не временной шкалы.

  • Безусловно, предварительная загрузка всего содержимого путем помещения его в начало файла имеет смысл на настольном компьютере, но применение предварительной загрузки на мобильном устройстве может привести к задержке запуска файла. Необходимо распределять содержимое по всему файлу, стремясь к тому, чтобы видеоролики инициализировались до их использования.

Оптимизация ActionScript для содержимого Flash Lite на мобильных устройствах

Большинство мобильных устройств имеют ограничения по скорости обработки и объему памяти, поэтому, разрабатывая сценарии ActionScript содержимого Flash Lite для мобильных устройств, следует учитывать приведенные ниже рекомендации.

  • Стремитесь сделать файл и код как можно проще. Удаляйте неиспользованные видеоролики, исключайте ненужные кадры и циклы кода, а также старайтесь не использовать слишком много кадров или лишние кадры.

  • Применение циклов FOR может быть неприемлемым из-за издержек, связанных с проверкой условия при каждой итерации. Если затраты на операции, выполняемые в цикле, сопоставимы с издержками на проверку условий цикла, то вместо цикла следует задать каждую из многократно используемых операций отдельно. В связи с этим, объем кода может увеличиться, но производительность возрастет.

  • Останавливайте циклический повтор на основе кадров, как только в нем отпадает необходимость.

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

  • Всегда стремитесь получить непосредственный доступ к свойствам, а не использовать методы getter и setter программы ActionScript, поскольку с вызовом этих методов связано больше издержек по сравнению с другими методами.

  • Продумывайте управление событиями. Поддерживайте массивы обработчиков событий в сжатом виде. Перед вызовом обработчика его существование (не равен null) требуется проверить с помощью условий. Очищайте все активные интервалы с помощью функции clearInterval. Перед удалением содержимого с помощью функции unloadapplication или removeapplicationClip удаляйте все активные обработчики функцией removeListener. Приложение Animate не возвращает в систему память, занимаемую SWF-данными (например, после удаления интервалов и обработчиков), если в каких-либо функциях ActionScript остаются ссылки на SWF-данные после выгрузки видеоролика.

  • Если какая-либо переменная больше не нужна, ее следует удалить или присвоить ей значение null, которое помечает ее для сбора мусора. Удаление переменных позволяет оптимизировать использование памяти во время выполнения, поскольку при этом из SWF-файла удаляются ненужные ресурсы. Лучше удалять переменные, чем присваивать им значение null.

  • Перед сбором мусора явно удаляйте обработчики из объектов с помощью функции removeListener.

  • Если функция вызывается динамически и передает фиксированный набор параметров, используйте метод call вместо apply.

  • Создавайте более компактные пространства имен (например, пути), чтобы уменьшить время запуска. Компиляция каждого уровня в пакете приводит к созданию оператора IF и формированию нового вызова Object; чем меньше уровней в пути, тем больше экономия времени. Например, при использовании пути с уровнями com.xxx.yyy.aaa.bbb.ccc.funtionName создается экземпляр объекта для com.xxx.yyy.aaa.bbb.ccc. Некоторые Flash-разработчики перед компиляцией кода SWF сокращают пути к уникальным идентификаторам (например, 58923409876.functionName) с помощью программ предварительной обработки.

  • Если файл состоит из нескольких SWF-файлов, в которых используются одни и те же классы ActionScript, исключите эти классы из выбранных SWF-файлов во время компиляции. Это помогает сократить время загрузки файла и уменьшить потребность в памяти во время выполнения.

  • Старайтесь не использовать методы Object.watch и Object.unwatch, так как при каждом изменении любого свойства объекта требуется, чтобы проигрыватель определял необходимость отправки сообщения об изменении.

  • Если для завершения выполнения кода ActionScript в ключевом кадре на временной шкале требуется несколько секунд, постарайтесь разделить код таким образом, чтобы он выполнялся в нескольких ключевых кадрах.

  • Перед публикацией SWF-файла удалите из кода операторы trace. Для этого установите флажок «Пропустить действия трассировки» на вкладке «Flash» диалогового окна «Параметры публикации».

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

  • После того как один SWF-файл загружает другой SWF-файл, содержащий пользовательский класс ActionScript (например, foo.bar.CustomClass), а затем SWF-файл выгружается, определение класса остается в памяти. Чтобы уменьшить потребление памяти, явно удаляйте все пользовательские классы в выгружаемых SWF-файлах. Для этого используйте оператор delete и указывайте полное имя класса, как в следующем примере: delete foo.bar.CustomClass.

  • Ограничьте использование глобальных переменных, поскольку они не помечаются для сбора мусора при удалении видеоролика, в котором они определены.

  • Старайтесь не использовать стандартные компоненты пользовательского интерфейса (доступные в палитре «Компоненты» в приложении Flash). Эти компоненты спроектированы для настольных компьютеров и не оптимизированы для работы на мобильных устройствах.

  • При любой возможности избегайте использования глубоко вложенных функций.

  • Постарайтесь исключить ссылки на несуществующие переменные, объекты или функции. По сравнению с версией Flash Player для настольного компьютера в версии Flash Lite 2 поиск по ссылкам на несуществующие переменные выполняется более медленно, что может привести к значительному снижению производительности.

  • Старайтесь не определять функции с помощью анонимного синтаксиса. Например, myObj.eventName = function{ ...}. Явно определенные функции (такие как function myFunc { ...}; my Obj.eventName = myFunc;) более эффективны.

  • Сведите к минимуму использование математических функций и чисел с плавающей точкой. Вычисление этих значений снижает производительность. Если без использования математических подпрограмм обойтись не удается, постарайтесь заранее рассчитать необходимые значения и сохранить их в массиве переменных. Выборка значений из таблицы данных происходит намного быстрее, чем вычисление во время выполнения.

Управление файловой памятью Flash Lite для мобильных устройств

Программа Flash Lite регулярно удаляет из памяти все объекты и переменные, на которые больше не ссылается ни один файл. Эта процедура называется уборкой мусора. В программе Flash Lite процесс сборки мусора выполняется каждые 60 секунд или после каждого внезапного увеличения занятой файловой памяти на 20% и более.

Хотя разработчик не может управлять способом и моментом начала сборки мусора в программе Flash Lite, он может заранее освободить неиспользуемую память. Что касается временной шкалы или глобальных переменных, освобождайте память, используемую объектами ActionScript, с помощью оператора delete. Что касается локальных переменных (например, переменная, определенная в объявлении функции), оператор delete нельзя использовать для освобождения памяти объекта, но можно присвоить переменной, которая ссылается на объект, значение null. Это приводит к освобождению памяти, используемой объектом, при условии, что отсутствуют другие ссылки на этот объект.

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

// First case: variable attached to a movie or 
// movie clip timeline 
// 
// Create the Date object. 
var mcDateObject = new Date(); 
// Returns the current date as a string. 
trace(mcDateObject); 
// Delete the object. 
delete mcDateObject; 
// Returns undefined. 
trace(mcDateObject); 
// 
// Second case: global variable attached to a movie or 
// movie clip timeline 
// 
// Create the Date object. 
_global.gDateObject = new Date(); 
// Returns the current date as a string. 
trace(_global.gDateObject); 
// Delete the object. 
delete _global.gDateObject; 
// Returns undefined. 
trace(_global.gDateObject);

Как уже было сказано выше, нельзя освобождать память, которую использует переменная локальной функции, с помощью оператора delete. Вместо этого следует присваивать ссылке на переменную значение null, что приводит к такому же результату, как и удаление с помощью оператора delete.

function func() 
{ 
    // Create the Date object. 
    var funcDateObject = new Date(); 
    // Returns the current date as a string. 
    trace(funcDateObject); 
    // Delete has no effect. 
    delete funcDateObject; 
    // Still returns the current date. 
    trace(funcDateObject); 
    // Set the object reference to null. 
    funcDateObject = null; 
    // Returns null. 
    trace(funcDateObject); 
} 
// Call func() function. 
func();

Загрузка данных для мобильных устройств в приложении Flash Lite

При разработке файлов для мобильных устройств старайтесь сделать объем данных, загружаемых за один прием, как можно меньше. При загрузке внешних данных в файл Flash Lite (например, с помощью метода XML.load) операционная система устройства может выдать ошибку «ошибка памяти», если для входящих данных не хватает памяти. Эта ситуация может возникнуть даже в том случае, если бы общего объема оставшейся памяти было достаточно.

Предположим, что файл пытается загрузить XML-файл объемом 100 КБ, но в операционной системе устройства для обработки входящего потока данных выделено только 30 КБ. В этом случае программа Flash Lite выведет сообщение об ошибке, указывая, что доступной памяти недостаточно.

Для загрузки больших объемов данных разбивайте их на меньшие части, например на несколько XML-файлов, и выполняйте несколько вызовов загрузки данных для каждой части. Размер каждой части данных и, следовательно, количество вызовов загрузки данных, которые необходимо сделать, зависит от устройства и файла. Чтобы определить подходящий баланс с учетом количества запросов к данным и вероятности отказа памяти, проверьте файлы на различных целевых устройствах.

Чтобы обеспечить оптимальную производительность, старайтесь по возможности обойтись без загрузки и синтаксического анализа XML-файлов. Вместо этого храните данные в виде простых пар «имя/значение» и загружайте данные из текстового файла с помощью метода loadVars или из предварительно скомпилированных SWF-файлов.

Исключение классов из компиляции для программы Flash Lite

Чтобы уменьшить размер SWF-файла, постарайтесь исключить классы из компиляции, но сохраните при этом возможность обращения к ним и использования их для проверки типов. Попробуйте испытать этот способ при разработке файла, в котором используется несколько SWF-файлов или общих библиотек, особенно тех, которые обращаются в основном к одним и тем же классам. Исключение классов позволяет избежать их дублирования в этих файлах.

  1. Создайте новый XML-файл.
  2. Присвойте этому XML-файлу имя FLA_filename_exclude.xml, где FLA_filename — имя FLA-файла без расширения .fla. Например, если FLA-файл имеет имя sellStocks.fla, то XML-файл должен иметь имя sellStocks_exclude.xml.
  3. Сохраните XML-файл в том же каталоге, что и FLA-файл.
  4. Поместите в XML-файл следующие теги.
    <excludeAssets> 
        <asset name=”className1” /> 
        <asset name=”className2” /> 
    </excludeAssets>

    Значения, указанные для атрибутов name в тегах <asset>, представляют собой имена классов, которые должны быть исключены из SWF-файла. Введите в файл необходимое количество тегов. Например, в приведенном ниже XML-файле из SWF-файла исключаются классы mx.core.UIObject и mx.screens.Slide.

    <excludeAssets> 
        <asset name=”mx.core.UIObject” /> 
        <asset name=”mx.screens.Slide” /> 
    </excludeAssets>

Эта работа лицензируется в соответствии с лицензией Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported  На посты, размещаемые в Twitter™ и Facebook, условия Creative Commons не распространяются.

Правовые уведомления   |   Политика конфиденциальности в сети Интернет