Простой видео-плеер на ActionScript 3.0

Apdev VideoPlayer - это библиотека классов на языке ActionScript 3.0, позволяющая легко и быстро создать простой и легковесный (чуть более 10 кб) видео-плеер. Причём видео-плеер создаётся в стиле «code only», то есть исключительно кодом ActionScript 3.0. А это значит, что вам для создания плейера потребуется только сама библиотека (прилагается к исходникам, ссылка на которые дана в конце урока) и ничего более.

Итак, создадим наш первый видео-проигрыватель с помощью библиотеки ApdevVideoPlayer...

Код ActionScript 3.0:

/* импорт классов */ import com.apdevblog.ui.video.ApdevVideoPlayer; /* создание видео-плеера в качестве параметров конструктор объектов принимает ширину и высоту области воспроизведения видео */ var videoPlayer:ApdevVideoPlayer = new ApdevVideoPlayer(480,320); /* добавление в список отображения */ addChild(videoPlayer); /* картинка-превью */ videoPlayer.videostill = "content/golden_bell.jpg"; /* загрузка видео-файла */ videoPlayer.load("content/golden_bell.mp4");

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

Код ActionScript 3.0:

/* импорт классов */ import com.apdevblog.ui.video.ApdevVideoPlayer; import com.apdevblog.ui.video.style.ApdevVideoPlayerDefaultStyle; /* настройка внешнего вида плеера */ var style:ApdevVideoPlayerDefaultStyle = new ApdevVideoPlayerDefaultStyle(); /* задний фон проигрывателя */ style.bgGradient1 = 0x333333; style.bgGradient1Alpha = 1; style.bgGradient2 = 0x000000; style.bgGradient2Alpha = 1; /* фон у полосы прогресса */ style.barBg = 0x999999; style.barBgAlpha = 1; /* цвет индикатора загрузки */ style.barLoading = 0x666666; /* цвет индикатора воспроизведения */ style.barPlaying = 0xff0000; /* фон кнопок */ style.btnGradient1 = 0x333333; style.btnGradient2 = 0x000000; /* цвет иконок */ style.btnIcon = 0xffffff; /* настройка текстового поля, в котором показывается прогресс воспроизведения */ style.timerDown = 0xff0000; style.timerUp = 0xffffff; /* создание видео-плеера */ var videoPlayer:ApdevVideoPlayer = new ApdevVideoPlayer(480,320,style); /* позиционирование */ videoPlayer.x = 0; videoPlayer.y = 0; /* добавление в список отображения */ addChild(videoPlayer); /* если свойство controlsOverVideo имеет значение false, то панель управления будет размещёна под видео а если значение true, то панель управления будет перекрывать видео */ videoPlayer.controlsOverVideo = true; /* если свойство controlsAutoHide имеет значение false, то панель управления будет видна всегда а если значение true, то панель управления будет видна только при наведении курсора мышки на видео */ videoPlayer.controlsAutoHide = true; /* картинка-превью */ videoPlayer.videostill = "content/golden_bell.jpg"; /* автовоспроизведение видео */ videoPlayer.autoPlay = false; /* загрузка видео-файла */ videoPlayer.load("golden_bell.mp4");

Настроек, как видите, много. И это ещё далеко не все настройки.

А теперь стоит показать результат...

Да, плеер не перегружен функционалом, но самое необходимое в нём есть.

Скачать библиотеку классов Apdev VideoPlayer и исходники к данному уроку можно по следующей ссылке - скачать (под Adobe Flash CS5). Я не стал включать в исходники видео-файл и картинку, чтобы не утяжелять архив с исходниками, но, думаю, вас не затруднит найти свой видео-файл и изображение :-)

Автор: admin

Дата добавления: 2013-02-05

Просмотров: 8389

Рейтинг поста: +15-

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

Социальные закладки:
Комментарии:
Комментатор
Комментарий добавил(а): edapskov
Дата добавления: 2013-08-07
Надо в html-код добавить параметр allowFullScreen со значение true. Примерно так:

<object type="application/x-shockwave-flash" data="имя.swf" height="320" width="480"><param name="movie" value="имя.swf"><param name="allowFullScreen" value="true"/></object>
Комментатор
Комментарий добавил(а): Аstra
Дата добавления: 2013-08-07
Как можно настроить плеер, чтобы он разворачивался на весь экран? Это какая настройка?
Добавить комментарий:







[ + ] помощь по форматирование текста

Идиот-тест

Если все обязательные поля (отмечены * ) заполнены необходимой информацией, то нажимаем кнопку Добавить комментарий.

Страница 2 из 2: 12
Меню
Подписка
Рубрики
Метки
Последние комментарии
Рейтинг постов
Реклама
Друзья
География гостей
Статистика
Яндекс.Метрика