To view this page ensure that Adobe Flash Player version 10.0.0 or greater is installed.
(Flex) Flex (2011 год)
Реклама в видеоплеере (возможности объектного программирования ActionScript).
Cуществует множество способов наложить рекламу на видео. Например создать на уровне HTML абсолютно-позицонированный DIV, который будет располагаться перед видеоплеером - и крутить рекламу в нем. Или создать собственно медиапоток FLV уже с рекламой - например как я описывал в заметке Опыт видео-конвертации.
Но на этой страничке бы я хотел дать небольшой урок обьектного программирования на ActionScript 3. Для этого я возьму мой TextBannerRotator - простой ротатор текстовых баннеров с эффектом BLUR и прокручу этим же баннерным ротатором рекламу не просто на страничке, а внутри флексового ВидеоПлеера.
Когда мой баннерный ротатор (extends Sprite) запускается средой на html-страничке или в AIR-приложении, то среда командой super создает экземпляр класса TextBannerRotator, вызывается конструктор класса (метод с тем же именем, что и метод класса) - в этом методе среда уже есть экземпляр обьекта stage (сцены). И на этой сцене начинает проигрываться реклама.
А чтобы вызвать мой баннерный ротатор внутри видео-плеера, нужно самому создать экземпляр баннерного ротатора TextBannerRotator и передать экземпляру ссылку на сцену видеоплеера. Для этого придется создать новый класс TextBannerRotator1 (extends TextBannerRotator) и переопределить в нем функцию InitBannerRotator (override), которая получит ссылку на сцену не из среды запуска обьекта унаследованного от Sprite (extends Sprite), а на сцену среды запуска Flex-приложения (на ту сцену, в которой работает VideoPlayer). И самому командой super в производном классе создать экземпляр базового класса.
Бытовые слова получаются очень путаными и каждому разговорному слову можно придать любую смысловую нагрузку, лучше взгляните на код ActionScript 3.0 - изложенная выше простая мысль сформулирована в недвусмысленных языковых конструкциях:
1: package
2: {
3: public class TextBannerRotator1 extends TextBannerRotator
4: {
5: private var Container1:Object;
6:
7: function TextBannerRotator1(container1:Object):void
8: {
9: Container1=container1;
10: super();
11: }
12:
13: protected override function InitBannerRotator():void
14: {
15: PrepareStage(Container1);
16: }
17: }
18: }
И вот как выглядит Flex-код плеера с передачей ссылки на сцену:
1: <?xml version="1.0" encoding="utf-8"?>
2: <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
3: xmlns:s="library://ns.adobe.com/flex/spark"
4: xmlns:mx="library://ns.adobe.com/flex/mx" applicationComplete="application1_applicationCompleteHandler(event)" minWidth="500" minHeight="300">
5: <fx:Script>
6: <![CDATA[
7: import mx.events.FlexEvent;
8: import mx.events.ResizeEvent;
9:
10: private var timer:Timer;
11: private var textBannerRotator:TextBannerRotator1;
12: private var title:TextField;
13: protected function application1_applicationCompleteHandler(event:FlexEvent):void
14: {
15: textBannerRotator=new TextBannerRotator1(stage);
16: textBannerRotator.width=this.width;
17:
18: stage.addChild(textBannerRotator);
19: textBannerRotator.x=100;
20: textBannerRotator.y=100;
21: title=new TextField();
22: title.text="Мой любимый идиот";
23: var TitleFormat:TextFormat= new TextFormat()
24: TitleFormat.size=30;
25: TitleFormat.color=0xFFFFFF;
26: title.setTextFormat(TitleFormat);
27: stage.addChild(title);
28: title.x=250;
29: title.y=this.height-70;
30: title.height=50;
31: title.width=this.width;
32: title.mouseEnabled=false;
33: //это код для довавления простого логотипа
34: //Canvas1.addChild(title);
35: //LogoImage1.width=this.width;
36: //LogoImage1.height=this.height;
37: Player1.minWidth=this.width;
38: Player1.minHeight=this.height;
39: Player1.play();
40: Player1.addEventListener(ResizeEvent.RESIZE, Player1_resizeHandler);
41: timer=new Timer(3000,1);
42: timer.addEventListener(TimerEvent.TIMER_COMPLETE, completeHandler);
43: timer.start();
44: }
45:
46: private function completeHandler(e:TimerEvent):void {
47: //это для прокрутки рекламы перед роликом
48: //LogoImage1.width=50;
49: //LogoImage1.height=50;
50: //Player1.play();
51: }
52: protected function Player1_resizeHandler(event:ResizeEvent):void
53: {
54: textBannerRotator.WIDTH=Player1.width;
55: title.x=250;
56: title.y=this.height-70;
57: title.width=this.width;
58: }
59: ]]>
60: </fx:Script>
61: <fx:Declarations>
62: <!-- Place non-visual elements (e.g., services, value objects) here -->
63: </fx:Declarations>
64:
65: <s:VideoPlayer width="100%" height="100%" autoPlay="false"
66: id="Player1" source="http://asp-net.ru/flex6/mer.flv" loop="true" scaleMode="stretch" x="0" y="0"/>
67:
68: <mx:Canvas width="100%" height="100%" id="Canvas1" x="0" y="0">
69: <!--<mx:Image x="10" y="10" id="LogoImage1" source="votpusk.gif" width="50" height="50"/>-->
70: </mx:Canvas>
71:
72: </s:Application>
Как видите, хотя ActionScript конечно же далеко не бейсик (и не имеет наверное и 10% от обьектных возможностей бейсика - Практическое применение наследования, полиморфизма, интерфейсов, дженериков и делегатов на примерах в Visual Basic .NET) - но все ж таки кое-какие обьектные возможности в ActionScript имеются. И пользоваться ими полезно и приятно.
Еще один впечатляющий пример обьектного программирования на ActionScript вы можете посмотреть на этой страничке - Сокеты во Flash.
Если вас интересует детальная работа с видео, работа с каждым из видеопотоков: Camera Live Video, OnDemand HTTP Dynamic Streaming, Live HTTP Dynamic Streaming, RTMP Stream from the Flash Media Server, работа через NetStream в режиме прогресивного и потокового видео, RTMFP peer-to-peer - то почти все базовые сведения, чтобы двигаться дальше, я описал в этой заметке - Видео-камеры, видео-чаты и Flash-медиасервера (работающие по RTMP и самописным протоколам).
А вообще, видео - это активно развивающаяся техногия и у Adobe надавно появилась и совсем новая технология - "on-demand and live adaptive bitrate video streaming of standards-based MP4 media over regular HTTP connections" - все конечно невозможно охватить в рамках одной заметки. К тому же (хотя и достаточно долго работаю с видео вообще - Опыт видео-конвертации), но в тонкие детали технологий компании Adobe я пока только вникаю (менее года). И возможно, существуют лучшие варианты решений, чем те, что я нащупал и описываю в своих заметках.
Order a job
)
| <SITEMAP> <MVC> <ASP> <NET> <DATA> <KIOSK> <FLEX> <SQL> <NOTES> <LINUX> <MONO> <FREEWARE> <DOCS> <ENG> <CHAT ME> <ABOUT ME> < THANKS ME> |