Öncelikle Video’yu flv’ye çevirmeniz gerekiyor,
Window > Component > FLVPlayback sahnemize sürüklüyoruz,
FLVPlayback tıklarayak Properties’den instance name kısmına “display” yazıyoruz.
Component parameters kısmında yer alan skin kısmından herhangi bir tanesini seçiyoruz.
FLVPlayback’in süreleri kontrol etmeniz için CUE_POINT özelliği vardır bu özellik sayesinde siz tanımladığınız zaman dilimlerinde olmasını istediğiniz olayları tanımlayabilirsiniz,
örneğin 15 sn’ye geldiğinde bir function’un çalışmasını isteyebilirsiniz ya da tanımladığınız herhangi bir zaman dilimine geldiğinde belli bir frame’e gitmesini sağlayabilirsiniz veya video’nun Türkçe değilse ve siz alt yazı eklemek istiyorsanız bunu çok rahat CUE_POINT ile yapabilirsiniz,
Ben bu çalışmada alt yazı olayını gerçekleştirdim, bunun ayrıntılı olarak inceleyecez. ve video ilk görüntülendiğinde play tuşuna basılmadan önce image görüntüleyecez
ön izleme
kaynak dosyalar
package {
import flash.display.MovieClip;
import fl.video.*;
import flash.display.*;
import flash.events.Event;
import flash.net.URLRequest;
import flash.display.LoaderInfo
import flash.events.MouseEvent;
public class videoPlay extends MovieClip
{
// alt özellikleri istediğim gibi çalıştırabilmek için yeni bir FLVPlayback tanımlıyoruz,
public var flvControl:FLVPlayback;
// video ilk görüntülendiğinde play tuşuna basılmadan önce görüntülenecek image
public var defaultImage:Bitmap;
public function videoPlay()
{
/*
as dosyası çalışır çalışmaz ilk önce root’da yer alan
init function’u çalıştıyoruz.
*/
init()
/*
sahnemize sürüklediğimiz videoyu (instance name display)
yukarıda tanımladığımız flvControl’e eşitliyoruz ve alt
özelliklerini veriyoruz,
*/
flvControl= display;
flvControl.autoPlay = false;
flvControl.autoRewind = true;
flvControl.scaleMode = VideoScaleMode.NO_SCALE;
flvControl.source = flvSource; // fla’nın içinden tanımlandı
/*
FLVPlayback’in süreleri kontrol etmeniz için
CUE_POINT özelliği vardır bu özellik sayesinde
siz tanımladığınız zaman dilimlerinde olmasını
istediğiniz olayları tanımlayabilirsiniz,
örneğin 15 sn’ye geldiğinde bir function’un
çalışmasını isteyebilirsiniz ya da tanımladığınız
herhangi bir zaman dilimine geldiğinde
belli bir frame’e gitmesini sağlayabilirsiniz veya
video’nun Türkçe değilse ve siz alt yazı eklemek
istiyorsanız bunu çok rahat CUE_POINT ile yapabilirsiniz,
Ben bu çalışmada alt yazı olayını gerçekleştirdim,
bunun ayrıntılı olarak inceleyecez.
*/
/*
flvControl CUE_POINT tanımladığımı ve bunu kontrol
etmesi gerektiğini belirtiyorum
*/
flvControl.addEventListener(MetadataEvent.CUE_POINT, cuePointHandler)
/*
Dökümanın başında da belirttiğim gibi video ilk görüntülendiğinde
play tuşuna basılmadan önce image görüntüleyecez ve bunun için
image yolunu belirtmemiz gerekiyor ve ben bunu "urlString" ile
ve bu yolu fla’nın içinden tanımlıyor olucam. yani tamamen dinamik
1’den fazla videonuz olduğunda sadece URL bilgileri
değiştirmeniz yeterli olacak.
*/
var defaultImagePath:String = urlString
var defaultImageLoader:Loader= new Loader();
defaultImageLoader.load(new URLRequest(defaultImagePath));
/*
yükleme tamamlandıktan sonra x ve koordinaatlarını tanımlamak
için contentLoaderInfo kullandım ama siz isterseniz başka özellikleri de
aktif hale getirebilirsiniz
*/
defaultImageLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, defaultImageHandler);
var defaultImageSprite:Sprite=new Sprite()
defaultImageSprite.addEventListener(MouseEvent.CLICK, videoStart)
defaultImageSprite.buttonMode=true;
defaultImageSprite.mouseChildren=true
defaultImageSprite.addEventListener(MouseEvent.CLICK, videoStart)
/*
image’i (defaultImageLoader) Sprite içine atıyorum ve
buttonmode durumunu aktif hale getirip, link veriyorum
*/
defaultImageSprite.addChild(defaultImageLoader)
addChild(defaultImageSprite)
/*
alt yazıları ve kaçıncı saniye’de çıkacaklarını
fla dosyam’da 1nci frame’de bir dizi (translation)
içinde tanımladım ve bu dizinin uzunluğu kadar
for döngüsü oluşturarak flvControl nin addASCuePoint
alt özelliğini aktif hale getirdim.
*/
for (var i:uint=0; i<translation.length; i++)
{
flvControl.addASCuePoint(translation[i][0],translation[i][1])
}
}
public function defaultImageHandler(event:Event):void
{
defaultImage = event.currentTarget.content as Bitmap;
defaultImage.x = display.x;
defaultImage.y = display.y;
//addChild(defaultImage);// Monitor the video
}
/*
translation dizisinde tanımlı olan saniye’ye geldiğinde
bu cuePointHandler function çalışacak ve translation
dizisindeki o saniyenin karşısında yer alan metni
root’de yer alan text alanına (translationText) yazdıracak,
ben metinler içine html kod kullandığım için htmlText özelliğini
kullandım
*/
public function cuePointHandler(event:MetadataEvent):void
{
translationText.htmlText=event.info.name
trace("time = "+event.info.time);
}
/*
ve kullanıcı yüklenen image’a tıkladıktan sonra
defaultImageSprite görünürlüğünü false yapıp video’muzu oynatıyoruz.
*/
public function videoStart (event:MouseEvent)
{
flvControl.play()
defaultImage.visible = false
}
}
}