[Flash动画制作]Flash加载外部文件创建进度条3种方法

分类:Flash动画制作    发布时间:2017年06月06日    点击:1027次

[Flash动画制作]Flash加载外部文件创建进度条3种方法


  加载外部文件的进度条(看帮助文档整理),只适合那些不愿看帮助文档的新手。我只不过加了一些注释。

  为加载图像文件或 SWF 文件创建进度条

  创建一个名为 loadImage.fla 的新 Flash 文档。

  选择"修改">"文档",在宽度文本框中键入 700,在高度文本框中键入 500,从而更改文档的尺寸。

  在时间轴中选择第 1 帧,然后在"动作"面板中键入下面的代码: // 创建剪辑来承载您的内容

  this.createEmptyMovieClip("progressBar_mc", 0);

  progressBar_mc.createEmptyMovieClip("bar_mc", 1);

  progressBar_mc.createEmptyMovieClip("stroke_mc", 2);

  // 创建进度框

  with (progressBar_mc.stroke_mc) {

  lineStyle(0, 0x000000);

  moveTo(0, 0);

  lineTo(100, 0);

  lineTo(100, 10);

  lineTo(0, 10);

  lineTo(0, 0);

  }

  //创建进度条

  with (progressBar_mc.bar_mc) {

  beginFill(0xFF0000, 100);

  moveTo(0, 0);

  lineTo(100, 0);

  lineTo(100, 10);

  lineTo(0, 10);

  lineTo(0, 0);

  endFill();

  _xscale = 0;

  }

  //进度坐标

  progressBar_mc._x = 2;

  progressBar_mc._y = 2;

  //加载进度

  var mclListener:Object = new Object();

  //开始加载时进度条缩放为0

  mclListener.onLoadStart = function(target_mc:MovieClip) {

  progressBar_mc.bar_mc._xscale = 0;

  };

  //在加载过程中进度条进行缩放

  mclListener.onLoadProgress = function(target_mc:MovieClip, bytesLoaded:Number, bytesTotal:Number) {

  progressBar_mc.bar_mc._xscale = Math.round(bytesLoaded/bytesTotal*100);

  };

  //加载完成后进度移除

  mclListener.onLoadComplete = function(target_mc:MovieClip) {

  progressBar_mc.removeMovieClip();

  };

  //当执行加载的剪辑的第一帧上的动作时调用(这里设置加载的外部文件的宽高设置)

  mclListener.onLoadInit = function(target_mc:MovieClip) {

  target_mc._height = 500;

  target_mc._width = 700;

  };

  // 创建一个剪辑来承载图像。

  this.createEmptyMovieClip("image_mc", 100);

  var image_mcl:MovieClipLoader = new MovieClipLoader();

  image_mcl.addListener(mclListener);

  image_mcl.loadClip("http://www.helpexamples.com/flash/images/gallery1/images/pic3.jpg", image_mc);

  为加载 MP3 文件创建进度条

  创建一个名为 loadSound.fla 的新 Flash 文档。

  在时间轴中选择第 1 帧,然后在"动作"面板中键入下面的代码:

  //设置宽高变量

  var pb_height:Number = 10;

  var pb_width:Number = 100;

  //在影片剪辑pb中创建进度

  var pb:MovieClip = this.createEmptyMovieClip("progressBar_mc", this.getNextHighestDepth());

  //在影片剪辑pb中创建进度条

  pb.createEmptyMovieClip("bar_mc", pb.getNextHighestDepth());

  //在影片剪辑pb中创建进度条右边直线

  pb.createEmptyMovieClip("vBar_mc", pb.getNextHighestDepth());

  //在影片剪辑pb中创建进度框

  pb.createEmptyMovieClip("stroke_mc", pb.getNextHighestDepth());

  //在影片剪辑pb中创建动态文本

  pb.createTextField("pos_txt", pb.getNextHighestDepth(), 0, pb_height, pb_width, 22);

  //影片剪辑pb的坐标设置

  pb._x = 100;

  pb._y = 100;

  //画进度条

  with (pb.bar_mc) {

  beginFill(0x00FF00);

  moveTo(0, 0);

  lineTo(pb_width, 0);

  lineTo(pb_width, pb_height);

  lineTo(0, pb_height);

  lineTo(0, 0);

  endFill();

  _xscale = 0;

  }

  //画进度条右边直线

  with (pb.vBar_mc) {

  lineStyle(1, 0x000000);

  moveTo(0, 0);

  lineTo(0, pb_height);

  }

  //画进度框

  with (pb.stroke_mc) {

  lineStyle(3, 0x000000);

  moveTo(0, 0);

  lineTo(pb_width, 0);

  lineTo(pb_width, pb_height);

  lineTo(0, pb_height);

  lineTo(0, 0);

  }

  //设置一些变量

  var my_interval:Number;

  var my_sound:Sound = new Sound();

  //加载声音自动调用

  my_sound.onLoad = function(success:Boolean) {

  if (success) {

  trace("sound loaded");

  }

  };

  //声音播放完毕时调用

  my_sound.onSoundComplete = function() {

  clearInterval(my_interval);

  trace("Cleared interval");

  }

  //加载声音路径

  my_sound.loadSound("http://www.helpexamples.com/flash/sound/song2.mp3", true);

  //每隔一定时间就调用下面的updateProgressBar函数

  my_interval = setInterval(updateProgressBar, 100, my_sound);

  function updateProgressBar(the_sound:Sound):Void {

  //设置声音进度(声音已播放时间除以声音总时间乘以100)

  var pos:Number = Math.round(the_sound.position / the_sound.duration * 100);

  //进度条进行缩放

  pb.bar_mc._xscale = pos;

  //进度条右边直线的X坐标等于进度条的宽

  pb.vBar_mc._x = pb.bar_mc._width;

  //动态文本显示进度

  pb.pos_txt.text = pos "%";

  }

  为加载视频创建进度条

  创建一个名为 flvProgress.fla 的新 FLA 文件。

  在"库"面板("窗口">"库")中,从"库"弹出菜单中选择"新建视频"。

  在"视频属性"对话框中,为视频元件命名并选择"视频"(由 Actionscript 控制)。

  单击"确定",创建一个视频对象。

  将该视频对象从"库"面板拖动到舞台上,以创建视频对象实例。

  使视频对象在舞台上保持选中状态,在属性检查器("窗口">"属性">"属性")中的"实例名称"文本框中键入 my_video。

  使视频实例保持选中状态,在宽度文本框中键入 320,在高度文本框中键入 213。

  在时间轴中选择第 1 帧,然后在"动作"面板中键入下面的代码:

  //创建 NetConnection 对象,您可以将该对象与 NetStream 对象一起使用来播放视频流 (FLV) 文件

  var connection_nc:NetConnection = new NetConnection();

  对于此参数,必须传递 null

  connection_nc.connect(null);

  创建可用于通过指定的 NetConnection 对象播放 FLV 文件的流

  var stream_ns:NetStream = new NetStream(connection_nc);

  //指定将在舞台上的 Video 对象的边界内显示的视频流

  my_video.attachVideo(stream_ns);

  //播放外部视频 (FLV) 文件

  stream_ns.play("http://www.helpexamples.com/flash/video/typing_short.flv");

  //创建动态文本(显示进度)

  this.createTextField("loaded_txt", this.getNextHighestDepth(), 10, 10, 160, 22);

  //创建进度影片剪辑

  this.createEmptyMovieClip("progressBar_mc", this.getNextHighestDepth());

  //在进度影片剪辑中创建进度条

  progressBar_mc.createEmptyMovieClip("bar_mc", progressBar_mc.getNextHighestDepth());

  //画进度条

  with (progressBar_mc.bar_mc) {

  beginFill(0xFF0000);

  moveTo(0, 0);

  lineTo(100, 0);

  lineTo(100, 10);

  lineTo(0, 10);

  lineTo(0, 0);

  endFill();

  _xscale = 0;

  }

  //在进度影片剪辑中创建进度框

  progressBar_mc.createEmptyMovieClip("stroke_mc", progressBar_mc.getNextHighestDepth());

  //画进度框

  with (progressBar_mc.stroke_mc) {

  lineStyle(0, 0x000000);

  moveTo(0, 0);

  lineTo(100, 0);

  lineTo(100, 10);

  lineTo(0, 10);

  lineTo(0, 0);

  }

  //每隔一定时间就调用下面的checkBytesLoaded函数

  var loaded_interval:Number = setInterval(checkBytesLoaded, 500, stream_ns);

  function checkBytesLoaded(my_ns:NetStream) {

  //进度值设置

  var pctLoaded:Number = Math.round(my_ns.bytesLoaded / my_ns.bytesTotal * 100);

  //动态文本显示进度

  loaded_txt.text = Math.round(my_ns.bytesLoaded / 1000) " of " Math.round(my_ns.bytesTotal / 1000) " KB loaded (" pctLoaded "%)";

  //进度条进行缩放

  progressBar_mc.bar_mc._xscale = pctLoaded;

  //加载完成后清除间隔

  if (pctLoaded>=100) {

  clearInterval(loaded_interval);

  }

  }

推荐阅读:

剧场版动画《BLAME!》最新预告公开 樱井孝宏等声优加盟配音

三维挖掘机动画制作

Flash科普公益动画制作:夏季节约用电小知识

最近发表
标签列表