| Viacheslav Eremin | Professional Programming, Visual Studio, Visual Basic, Vb.Net, C#, Sql Server, Asp, Asp Net Classic, Asp Net Mvc, Asp Net Core, Blazor .Net, Dot Net, Net Framework, Net Core

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 я пока только вникаю (менее года). И возможно, существуют лучшие варианты решений, чем те, что я нащупал и описываю в своих заметках.



Comments ( )
<00>  <01>  <02>  <03>  <04>  <05>  <06>  <07>  <08>  <09>  <10>  <11>  <12>  <13>  <14>  <15>  <16>  <17>  <18>  <19>  <20>  <21
Link to this page: http://www.vb-net.com/FlexVideoPlayer/index.htm
<SITEMAP>  <MVC>  <ASP>  <NET>  <DATA>  <KIOSK>  <FLEX>  <SQL>  <NOTES>  <LINUX>  <MONO>  <FREEWARE>  <DOCS>  <ENG>  <CHAT ME>  <ABOUT ME>  < THANKS ME>