×

关注微信公众号

免备案网站空间虚拟主机双线空间域名查询PS数码后期
photoshop互助课堂数百G视频教程下载英语培训机构初中英语如何学随时随地聆听大师开讲/课堂
酷素材!视频教程打包下手绘教程抠图教程路径专辑photoshop cs3视频教程
查看: 7998|回复: 8

[AS] 组件的组合运用(FLV播放器)[本文已收录教程库]

  [复制链接]
发表于 2009-7-26 07:44:38 | 显示全部楼层 |阅读模式
本帖最后由 xyl7422 于 2010-8-5 18:47 编辑

组件的组合运用(FLV播放器)



声明:本实例为Adobe的实例,非本人原创。

实现的功能:按前进、后退按钮可选择播放,拖动滑块可调节音量。

测试环境:Flash CS4

1、组织界面:
 新建Flash文档文件,命名保存。
打开组件面板,点开User Interface组。把Label拖到场景中,命名为:postionLabel,拖ProgressBar到场景中,命名为:positionBar,拖Slider到场景中,命名为:volumeSlider,点开Video组。拖PlayButton到场景中,命名为:playButton,拖PauseButton到场景中,命名为:pauseButton,拖StopButton到场景中,命名为:stopButton,拖BackButton到场景中,命名为:backButton,拖ForwardButton到场景中,命名为:forwardButton。组织好位置如图1图2:


2、创建VideoJukebox.as文档文件,代码如下:(代码可直接拷贝)
  1. package {
  2.         import fl.controls.*;
  3.         import fl.events.SliderEvent;
  4.        
  5.         import flash.display.MovieClip;
  6.         import flash.display.Sprite;
  7.         import flash.events.Event;
  8.         import flash.events.MouseEvent;
  9.         import flash.events.NetStatusEvent;
  10.         import flash.events.TimerEvent;
  11.         import flash.media.SoundTransform;
  12.         import flash.media.Video;
  13.         import flash.net.NetConnection;
  14.         import flash.net.NetStream;
  15.         import flash.net.URLLoader;
  16.         import flash.net.URLRequest;
  17.         import flash.utils.Timer;

  18.         public class VideoJukebox extends Sprite {
  19.                 /**
  20.                  * The amount of time between calls to update the playhead timer, in
  21.                  * milliseconds.
  22.                  */
  23.                 private const PLAYHEAD_UPDATE_INTERVAL_MS:uint = 10;

  24.                 /**
  25.                  * The path to the XML file containing the video playlist.
  26.                  */
  27.                 private const PLAYLIST_XML_URL:String = "playlist.xml";

  28.                 /**
  29.                  * The client object to use for the NetStream object.
  30.                  */
  31.                 private var client:Object;

  32.                 /**
  33.                  * The index of the currently playing video.
  34.                  */
  35.                 private var idx:uint = 0;

  36.                 /**
  37.                  * A copy of the current video's metadata object.
  38.                  */
  39.                 private var meta:Object;
  40.                 private var nc:NetConnection;
  41.                 private var ns:NetStream;
  42.                 private var playlist:XML;
  43.                 private var t:Timer;
  44.                 private var uldr:URLLoader;
  45.                 private var vid:Video;
  46.                 private var videosXML:XMLList;
  47.                
  48.                 /**
  49.                  * The SoundTransform object used to set the volume for the NetStream.
  50.                  */
  51.                 private var volumeTransform:SoundTransform;

  52.                 /**
  53.                  * Constructor
  54.                  */
  55.                 public function VideoJukebox() {
  56.                         // Initialize the uldr variable which will be used to load the external
  57.                         // playlist XML file.
  58.                         uldr = new URLLoader();
  59.                         uldr.addEventListener(Event.COMPLETE, xmlCompleteHandler);
  60.                         uldr.load(new URLRequest(PLAYLIST_XML_URL));
  61.                 }

  62.                 /**
  63.                  * Once the XML file has loaded, parse the file contents into an XML object,
  64.                  * and create an XMList for the video nodes in the XML.
  65.                  */
  66.                 private function xmlCompleteHandler(event:Event):void {
  67.                         playlist = XML(event.target.data);
  68.                         videosXML = playlist.video;
  69.                         main();
  70.                 }

  71.                 /**
  72.                  * The main application.
  73.                  */
  74.                 private function main():void {
  75.                         volumeTransform = new SoundTransform();

  76.                         // Create the client object for the NetStream, and set up a callback
  77.                         // handler for the onMetaData event.
  78.                         client = new Object();
  79.                         client.onMetaData = metadataHandler;

  80.                         nc = new NetConnection();
  81.                         nc.connect(null);

  82.                         // Initialize the NetSteam object, add a listener for the netStatus
  83.                         // event, and set the client for the NetStream.
  84.                         ns = new NetStream(nc);
  85.                         ns.addEventListener(NetStatusEvent.NET_STATUS, netStatusHandler);
  86.                         ns.client = client;

  87.                         // Initialize the Video object, attach the NetStram, and add the Video
  88.                         // object to the display list.
  89.                         vid = new Video();
  90.             vid.x = 20;
  91.             vid.y = 75;
  92.                         vid.attachNetStream(ns);
  93.                         addChild(vid);

  94.                         // Begin playback of the first video.
  95.                         playVideo();

  96.                         // Initialize the Timer object and set the delay to
  97.                         // PLAYHEAD_UPDATE_INTERVAL_MS milliseconds.
  98.                         t = new Timer(PLAYHEAD_UPDATE_INTERVAL_MS);
  99.                         t.addEventListener(TimerEvent.TIMER, timerHandler);

  100.                         // Configure the positionBar ProgressBar instance and set the mode to
  101.                         // MANUAL. Progress  bar values will be explicitly set using the
  102.                         // setProgress() method.
  103.                         positionBar.mode = ProgressBarMode.MANUAL;

  104.                         // Configure the volumeSlider Slider component instance. The maximum
  105.                         // value is set to 1 because the volume in the SoundTransform object
  106.                         // is set to a number between 0 and 1. The snapInterval and tickInterval
  107.                         // properties are set to 0.1 which allows users to set the volume to
  108.                         // 0, 0.1 - 0.9, 1.0 which allows users to increment or decrement the
  109.                         // volume by 10%.
  110.                         volumeSlider.value = volumeTransform.volume;
  111.                         volumeSlider.minimum = 0;
  112.                         volumeSlider.maximum = 1;
  113.                         volumeSlider.snapInterval = 0.1;
  114.                         volumeSlider.tickInterval = volumeSlider.snapInterval;

  115.                         // Setting the liveDragging property to true causes the Slider
  116.                         // instance's change event to be dispatched whenever the slider is
  117.                         // moved, rather than when the user releases the slider thumb.
  118.                         volumeSlider.liveDragging = true;
  119.                         volumeSlider.addEventListener(SliderEvent.CHANGE, volumeChangeHandler);

  120.                         // Configure the various Button instances. Each Button instance uses
  121.                         // the same click handler.
  122.                         playButton.addEventListener(MouseEvent.CLICK, buttonClickHandler);
  123.                         pauseButton.addEventListener(MouseEvent.CLICK, buttonClickHandler);
  124.                         stopButton.addEventListener(MouseEvent.CLICK, buttonClickHandler);
  125.                         backButton.addEventListener(MouseEvent.CLICK, buttonClickHandler);
  126.                         forwardButton.addEventListener(MouseEvent.CLICK, buttonClickHandler);
  127.                 }

  128.                 /**
  129.                  * Event listener for the volumeSlider instance. Called when the user
  130.                  * changes the value of the volume slider.
  131.                  */
  132.                 private function volumeChangeHandler(event:SliderEvent):void {
  133.                         // Set the volumeTransform's volume property to the current value of the
  134.                         // Slider and set the NetStream object's soundTransform property.
  135.                         volumeTransform.volume = event.value;
  136.                         ns.soundTransform = volumeTransform;
  137.                 }

  138.                 /**
  139.                  * Event listener for the ns object. Called when the net stream's status
  140.                  * changes.
  141.                  */
  142.                 private function netStatusHandler(event:NetStatusEvent):void {
  143.                         try {
  144.                                 switch (event.info.code) {
  145.                                         case "NetStream.Play.Start" :
  146.                                                 // If the current code is Start, start the timer object.
  147.                                                 t.start();
  148.                                                 break;
  149.                                         case "NetStream.Play.StreamNotFound" :
  150.                                         case "NetStream.Play.Stop" :
  151.                                                 // If the current code is Stop or StreamNotFound, stop
  152.                                                 // the timer object and play the next video in the playlist.
  153.                                                 t.stop();
  154.                                                 playNextVideo();
  155.                                                 break;
  156.                                 }
  157.                         } catch (error:TypeError) {
  158.                                 // Ignore any errors.
  159.                         }
  160.                 }

  161.                 /**
  162.                  * Event listener for the ns object's client property. This method is called
  163.                  * when the net stream object receives metadata information for a video.
  164.                  */
  165.                 private function metadataHandler(metadataObj:Object):void {
  166.                         // Store the metadata information in the meta object.
  167.                         meta = metadataObj;
  168.                         // Resize the Video instance on the display list with the video's width
  169.                         // and height from the metadata object.
  170.                         vid.width = meta.width;
  171.                         vid.height = meta.height;
  172.                         // Reposition and resize the positionBar progress bar based on the
  173.                         // current video's dimensions.
  174.                         positionBar.move(vid.x, vid.y + vid.height);
  175.                         positionBar.width = vid.width;
  176.                 }

  177.                 /**
  178.                  * Retrieve the current video from the playlist XML object.
  179.                  */
  180.                 private function getVideo():String {
  181.                         return videosXML[idx].@url;
  182.                 }

  183.                 /**
  184.                  * Play the currently selected video.
  185.                  */
  186.                 private function playVideo():void {
  187.                         var url:String = getVideo();
  188.                         ns.play(url);
  189.                 }

  190.                 /**
  191.                  * Decrease the current video index and begin playback of the video.
  192.                  */
  193.                 private function playPreviousVideo():void {
  194.                         if (idx > 0) {
  195.                                 idx--;
  196.                                 playVideo();
  197.                                 // Make sure the positionBar progress bar is visible.
  198.                                 positionBar.visible = true;
  199.                         }
  200.                 }

  201.                 /**
  202.                  * Increase the current video index and begin playback of the video.
  203.                  */
  204.                 private function playNextVideo():void {
  205.                         if (idx < (videosXML.length() - 1)) {
  206.                                 // If this is not the last video in the playlist increase the
  207.                                 // video index and play the next video.
  208.                                 idx++;
  209.                                 playVideo();
  210.                                 // Make sure the positionBar progress bar is visible.
  211.                                 positionBar.visible = true;
  212.                         } else {
  213.                                 // If this is the last video in the playlist increase the video
  214.                                 // index, clear the contents of the Video object and hide the
  215.                                 // positionBar progress bar. The video index is increased so that
  216.                                 // when the video ends, clicking the backButton will play the
  217.                                 // correct video.
  218.                                 idx++;
  219.                                 vid.clear();
  220.                                 positionBar.visible = false;
  221.                         }
  222.                 }

  223.                 /**
  224.                  * Click handler for each of the video playback buttons.
  225.                  */
  226. private function buttonClickHandler(event:MouseEvent):void {
  227.         // Use a switch statement to determine which button was clicked.
  228.         switch (event.currentTarget) {
  229.                 case playButton :
  230.                         // If the play button was clicked, resume the video playback.
  231.                         // If the video was already playing, this has no effect.
  232.                         ns.resume();
  233.                         break;
  234.                 case pauseButton :
  235.                         // If the pause button was clicked, pause the video playback.
  236.                         // If the video was already playing, the video will be paused.
  237.                         // If the video was already paused, the video will be resumed.
  238.                         ns.togglePause();
  239.                         break;
  240.                 case stopButton :
  241.                         // If the stop button was clicked, pause the video playback
  242.                         // and reset the playhead back to the beginning of the video.
  243.                         ns.pause();
  244.                         ns.seek(0);
  245.                         break;
  246.                 case backButton :
  247.                         // If the back button was clicked, play the previous video in
  248.                         // the playlist.
  249.                         playPreviousVideo();
  250.                         break;
  251.                 case forwardButton :
  252.                         // If the forward button was clicked, play the next video in
  253.                         // the playlist.
  254.                         playNextVideo();
  255.                         break;
  256.         }
  257. }

  258.                 /**
  259.                  * Event handler for the timer object. This method is called every
  260.                  * PLAYHEAD_UPDATE_INTERVAL_MS milliseconds as long as the timer is running.
  261.                  */
  262.                 private function timerHandler(event:TimerEvent):void {
  263.                         try {
  264.                                 // Update the progress bar and label based on the amount of video
  265.                                 // that has played back.
  266.                                 positionBar.setProgress(ns.time, meta.duration);
  267.                                 positionLabel.text = ns.time.toFixed(1) + " of " + meta.duration.toFixed(1) + " seconds";
  268.                         } catch (error:Error) {
  269.                                 // Ignore this error.
  270.                         }
  271.                 }
  272.         }
  273. }
复制代码
3、建一个xml文件,打开记事本输入下面内容:(此文件包涵3段flv地址,需要的话按下面格式添加)
  1. <?xml version="1.0"?>
  2. <videos>
  3.     <video url="http://www.helpexamples.com/flash/video/typing_short.flv" />
  4.     <video url="http://www.helpexamples.com/flash/video/cuepoints.flv" />
  5.     <video url="http://www.helpexamples.com/flash/video/sheep.flv" />
  6. </videos>
复制代码
在记事本中,选择【文件】【另存为】命令,输入文件名为:playlist.xml,在编码选项中选择“UTF-8”,单击【保存】按钮。如图3:

 用IE浏览器打开“playlist.xml”文件,如果能看到里面的内容,说明XML文件创建成功,如图4:

4、返回到fla场景中,在属性面板类输入框中输入:VideoJukebox。
5、把VideoJukebox.as文档文件,playlist.xml文件,fla文件保存在同一目录下,测试。
本帖的地址:http://bbs.jcwcn.com/forum.php?mod=viewthread&tid=259899
跟着教程做一遍,做完的图要到这里评论交作业,教程有看不懂的地方,可以在贴子下面评论

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有帐号?[立即注册]

x

评分

参与人数 3金币 +16 威望 +1 热心度 +4 收起 理由
祁连山 + 1 支持教程哈
xyl7422 + 8 + 2 对论坛做出贡献
zctmh0336 + 8 + 2 好教程

查看全部评分

发表于 2009-7-26 11:06:46 | 显示全部楼层
酷素材
交份作业

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有帐号?[立即注册]

x
回复 支持 反对

使用道具 举报

发表于 2010-8-30 10:07:13 | 显示全部楼层
搞了半天原来命名为:postionLabel  打错了
应该是 positionLabel
回复 支持 反对

使用道具 举报

发表于 2011-7-20 17:46:56 | 显示全部楼层
本帖最后由 hbwh风云岁月 于 2011-7-20 19:42 编辑

回复 cao4811 的帖子

问好老师,学习了,可是测试的时候出错了,说1120: 访问的属性 positionLabel 未定义。,不知道是为什么,

上面的问题找到了,已解决,测试出来了,但是有一个新问题,不知道视频画面怎样定位,出来的视频在偏下了好多,上面是空白的,先交上作业,请老师指点,谢谢了。

点击浏览作业



评分

参与人数 1金币 +3 收起 理由
sanbos + 3 支持练习

查看全部评分

回复 支持 反对

使用道具 举报

发表于 2012-6-21 09:39:52 | 显示全部楼层
酷素材
THANK YOU,TEACHER!
回复 支持 反对

使用道具 举报

发表于 2012-7-13 09:44:49 | 显示全部楼层
酷素材
label 这几个字怎么去除

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有帐号?[立即注册]

x
回复 支持 反对

使用道具 举报

发表于 2012-10-24 15:16:54 | 显示全部楼层
嗯,挺不错的
回复 支持 反对

使用道具 举报

发表于 2012-10-24 15:17:30 | 显示全部楼层
能在全屏跳转就更好了
回复 支持 反对

使用道具 举报

发表于 2013-4-22 08:49:46 | 显示全部楼层
能在全屏跳转就更好了
回复 支持 反对

使用道具 举报

发表于 2017-12-30 11:00:50 | 显示全部楼层
楼主是超人
回复 支持 反对

使用道具 举报

发表于 2017-12-30 11:09:31 | 显示全部楼层
说的非常好
回复 支持 反对

使用道具 举报

发表于 2017-12-30 10:26:17 | 显示全部楼层
不错不错
回复 支持 反对

使用道具 举报

发表于 2017-12-30 10:36:57 | 显示全部楼层
LZ真是人才
回复 支持 反对

使用道具 举报

发表于 2017-12-30 11:07:29 | 显示全部楼层
好帖子要收藏
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | [立即注册]

本版积分规则

2345