Slidemenu.as

2008年 3月 01日

出産を迎え仕事量を増やそうと約7年分の制作物を整理していたところ、試作したものの企画が潰れ眠っていた ActionScript 2 コードを見つけたので MIT License の元に公開することにした。この例では読み込み毎にランダムに配色するという挙動になっているが、setTab関数を改変し外部SWFファイルを読み込めば実用性があるだろう。とは言え、これは Flash のアップグレードを止め、今回公開を決断した理由の一つでもあるのだが、JavaScript でも表現できる時代となっている。

要件:

  • 横750px * 縦150px
  • 各領域をマウスオーバーで最大値横450pxになるようスライドして表示
  • マウスアウト時には5秒後に自動スライド開始

参考:

実例:

コード:ダウンロード

class Slidemenu
{
 private var __tabs_num:Number;
 private var __start_time:Number;
 private var __ad_width:Number;
 public function Slidemenu (tabs_num:Number, start_time:Number, ad_width:Number)
 {
  this.__tabs_num = tabs_num;
  this.__start_time = start_time;
  this.__ad_width = ad_width;
 }
 public function main (move_speed:Number):Void
 {
  var my_points:Array = getMyPoints ();
  var out_points:Array = getOutPoints ();
  var in_points:Array = getInPoints ();
  setTabs (move_speed, my_points, out_points, in_points);
 }
 private function setTabs (move_speed:Number, my_points:Array, out_points:Array, in_points:Array):Void
 {
  var i:Number;
  for (i = 0; i < this.__tabs_num; i++)
  {
   var tab_name:String = "tab" + i;
   _root.createEmptyMovieClip (tab_name, i);
   _root[tab_name]._x = my_points[i];
   _root[tab_name].id = i;
   setTab (_root[tab_name], 100);
   _root[tab_name].onRollOver = function ():Void 
   {
    _global.tab_id = this.id;
    clearInterval (_global.intervalId);
   };
   var to_point:Number;
   _root[tab_name].onEnterFrame = function ():Void 
   {
    if (_global.tab_id == null)
    {
     to_point = my_points[this.id];
    }
    else if (_global.tab_id >= this.id)
    {
     to_point = out_points[this.id];
    }
    else
    {
     to_point = in_points[this.id];
    }
    var xrate:Number = (to_point - this._x) * move_speed;
    this._x += xrate;
    if (Math.abs (xrate) < 0.1)
    {
     this._x = to_point;
    }
   };
  }
 }
 public function beginInterval ():Void
 {
  if (_global.intervalId != null)
  {
   clearInterval (_global.intervalId);
  }
  _global.intervalId = setInterval (this, "autoTabStart", this.__start_time);
 }
 private function autoTabStart ():Void
 {
  if (_global.tab_id == null || _global.tab_id >= this.__tabs_num - 1)
  {
   _global.tab_id = 0;
  }
  else
  {
   _global.tab_id++;
  }
 }
 private function getInPoints ():Array
 {
  return new Array (0, 450, (450 + 75 * 1), (450 + 75 * 2), (450 + 75 * 3));
 }
 private function getOutPoints ():Array
 {
  var i:Number;
  var points:Array = new Array ();
  for (i = 0; i < this.__tabs_num; i++)
  {
   points[i] = ((Stage.width - this.__ad_width) / (this.__tabs_num - 1)) * i;
  }
  return points;
 }
 private function getMyPoints ():Array
 {
  var i:Number;
  var points:Array = new Array ();
  for (i = 0; i < this.__tabs_num; i++)
  {
   points[i] = (Stage.width / this.__tabs_num) * i;
  }
  return points;
 }
 private function setTab (clip:MovieClip, alpha:Number):Void
 {
  clip.beginFill (getrndColors (), alpha);
  clip.lineStyle ();
  clip.moveTo (0, 0);
  clip.lineTo (Stage.width, 0);
  clip.lineTo (Stage.width, Stage.height);
  clip.lineTo (0, Stage.height);
  clip.lineTo (0, 0);
  clip.endFill ();
 }
 private function getrndColors ():Number
 {
  var rNum:Number = Math.round (Math.random () * 255);
  var gNum:Number = Math.round (Math.random () * 255);
  var bNum:Number = Math.round (Math.random () * 255);
  var c:Number = rNum * 0x10000 + gNum * 0x100 + bNum;
  return c;
 }
}