Счётчик FPS на ActionScript 3.0

Как известно, один из важнейших показателей работы флеш-ролика - это его FPS.

FPS - это аббревиатура от английского словосочетания «Frames Per Second», что переводится на русский как «кадры в секунду». То есть под FPS подразумевается скорость воспроизведения флеш-ролика, измеряемая кадрами в секунду. FPS зависит от разных факторов, которые можно условно разбить на две группы:

1.) возможности машины, на которой воспроизводится флеш-приложение;

2.) сложность воспроизводимого флеш-ролика.

И если первая группа факторов от нас почти не зависит, то на вторую группу мы можем влиять и при этом весьма существенно. Мы можем провести оптимизацию флеш-ролика и тем самым повысить его FPS. Но для начала надо сделать этот показатель доступным. Например, вывести счётчик кадров в секунду прямо на сцену флеш-ролика. А потом уже, отталкиваясь от показаний счётчика, проводить оптимизацию флеш-приложения, кода ActionScript.

В сети можно найти много решений для визуализации счётчика fps. Но сейчас я остановлюсь только на одном из них - это класс FrameRater от Pierluigi Pesenti. Класс очень простой, но удобный.

Для начала давайте посмотрим, что же делает FrameRater. Смотрим:

Здесь вы можете в левом верхнем углу наблюдать работу счётчика кадров. Для большей наглядности, в данный флеш-ролик встроен анимированный шум Перлина.

А теперь давайте научимся добавлять счётчик FPS в наши (то есть ваши) флеш-проекты.

Первым делом размещаем у себя сам класс FrameRater (он прилагается к исходнику) и подключаем его к нашему проекту:

Код ActionScript 3.0:


import путь_к_классу.FrameRater;

Теперь создадим объект класса FrameRater и настроим наш будущий счётчик:

Код ActionScript 3.0:


var frameRater:FrameRater = new FrameRater(параметры);

Конструктор объектов имеет несколько необязательных параметров, которые позволяют настроить внешний вид счётчика fps:

1.) цвет текста (по умолчанию это чёрный цвет);

2.) наличие (true) или отсутствие (false) тени вокруг счётчика;

3.) наличие (true) или отсутствие (false) графика под счётчиком;

4.) цвет графика (по умолчанию он красный).

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

Код ActionScript 3.0:


var frameRater:FrameRater = new FrameRater(0xff0000,true,true,0x0000ff);

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

Код ActionScript 3.0:


addChild(frameRater);

Теперь объединим все этапы в один законченный пример...

Код ActionScript 3.0:


/*
импортируем класс FrameRater
*/
import FrameRater;
/*
создаём экземпляр класса FrameRater и в качестве параметров передаём желаемые настройки
*/
var frameRater:FrameRater = new FrameRater(0xff0000,true,true,0x0000ff);
/*
позиционируем на сцене флеш-ролика
*/
frameRater.x = 20;
frameRater.y = 20;
/*
добавляем в список отображения
*/
addChild(frameRater);

Вот и всё.

Исходник под Adobe Flash CS5.5 и сам класс FrameRater можно скачать здесь.

Автор: admin

Дата добавления: 2011-10-28

Рейтинг поста: 12

Правила перепечатки

Социальные закладки:

Комментарии:

Комментарий добавил(а): Леонид

Дата добавления: 2016-04-04

Спасибо огромное, получилось, цвет текста теперь меняется.
А вариант с вызовом при низком и нормальным фпс, картинки из
другого "shape" попробую сам. если не получится напишу вам.

Комментарий добавил(а): edapskov

Дата добавления: 2016-04-03

Здравствуйте. Вам придётся вносить изменения в сам класс. Зайдите внутрь класса. Там есть функция onTimer. Эта функция отвечает за отрисовку текста и графика. А в переменной val храниться значение fps. Дальше с помощью val и условных операторов измените под ваши нужды. Например, так:



private function onTimer(event:TimerEvent):void {

	var val:Number=computeTime();

	if(val >= 25)

	{

		_tf.color = 0x00ff00;

	}

	else

	{

		_tf.color = 0xff0000;

	}

	_text.text = Math.floor(val).toString()+" fps";

	_text.setTextFormat(_tf);

	_text.autoSize="left";

	if (_showGraph) {

		updateGraph(val);

	}

}

Комментарий добавил(а): Леонид

Дата добавления: 2016-04-03

Здравствуйте, и мне пожалуйста подскажите вариант с лампочкой низкого фпс, и если не затруднит как в ActionScript 3.0 так и в ActionScript 2.0
Заранее спасибо.

Комментарий добавил(а): Александр

Дата добавления: 2016-04-03

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

Добавить комментарий: