水平・垂直拡大メニュー : ActionScript
水平・垂直拡大メニュー
/*
* 水平、垂直拡大メニュー
* horizonalSpreadMenu
* 縦と横の項目数は同じタイプ
*/
function Container()
{
// 項目数
var itemLength:Number;
// 区切数
var delimLength:Number;
// 区切(垂直, 水平)
var delimVArr:Array = [];
var delimHArr:Array = [];
//デフォルトの項目幅、高さ
var defaultWidth:Number;
var defaultHeight:Number;
//ロールオーバー時に開いている項目幅、高さ
var openWidth:Number;
var openHeight:Number;
//ロールオーバー時に閉じている項目幅、高さ
var closeWidth:Number;
var closeHeight:Number;
// コンテナ(自身)の幅、高さ
var containerWidth:Number;
var containerWidth:Number;
// テキスト
var textArr:Array = [];
//--------------------------------------------------------------------------
//
// 初期化処理 : 項目数, 項目幅(デフォルト), 項目幅(開)
//
//--------------------------------------------------------------------------
this.initContainer = function(argItemLength, argDefaultWidth, argOpenWidth, argDefaultHeight, argOpenHeight)
{
// 項目数(垂直と水平の項目の数が同数のタイプ)
itemLength = argItemLength;
// 区切数(垂直と水平の区切りの数が同数のタイプ)
delimLength = itemLength + 1;
//デフォルトの項目幅、高さ
defaultWidth = argDefaultWidth;
defaultHeight = argDefaultHeight;
// コンテナの幅
containerWidth = defaultWidth * itemLength;
containerHeight = defaultHeight * itemLength;
//ロールオーバー時に開いている項目幅、高さ
openWidth = argOpenWidth;
openHeight = argOpenHeight;
//ロールオーバー時に閉じている項目幅、高さ
closeWidth = (containerWidth - openWidth) / (itemLength - 1);
closeHeight = (containerHeight - openHeight) / (itemLength - 1);
// 区切作成
for (var i = 0; i < delimLength; i++)
{
// 両端の区切りは作成しない
if (!(i == 0) && !(i == delimLength - 1))
{
delimVArr[i] = this.attachMovie("DelimV", "delimV" + i, this.getNextHighestDepth(), new Delim(i * defaultWidth, 0));
delimHArr[i] = this.attachMovie("DelimH", "delimH" + i, this.getNextHighestDepth(), new Delim(0, i * defaultHeight));
}
}
// テキスト作成
for (var i = 0; i < itemLength; i++)
{
textArr[i] = [];
for (var j = 0; j < itemLength; j++)
{
// テキストのX座標
if (j == 0)
{
var left = 0;
}
else
{
var left = delimVArr[j]._x;
}
if (j == itemLength - 1)
{
var right = container._width;
}
else
{
var right = delimVArr[j + 1]._x;
}
var x = (left + right) / 2;
// テキストのY座標
if (i == 0)
{
var top = 0;
}
else
{
var top = delimHArr[i]._y;
}
if (i == itemLength - 1)
{
var bottom = containerHeight;
}
else
{
var bottom = delimHArr[i + 1]._y;
}
var y = (top + bottom) / 2;
textArr[i][j] = this.attachMovie("Text", "text" + i + j, this.getNextHighestDepth(), new Text(x, y));
}
}
this.onEnterFrame = frameHandler;
};
//--------------------------------------------------------------------------
//
// フレーム処理
//
//--------------------------------------------------------------------------
var frameHandler = function ()
{
var hit = this.hitTest(_root._xmouse, _root._ymouse, true);
if (hit)
{
rolloverHorizonal();
rolloverVertical();
changeText();
}
else
{
rolloutHorizonal();
rolloutVertical();
changeText();
}
};
//--------------------------------------------------------------------------
//
// 水平方向処理
//
//--------------------------------------------------------------------------
// ロールオーバー
var rolloverHorizonal = function ()
{
for (i = 1; i < delimLength - 1; i++)
{
if (delimVArr[i]._x < _root._xmouse)
{
// マウス位置より小さい区切りのイージング
var targetX = closeWidth * i;
var dx = targetX - delimVArr[i]._x;
if (Math.abs(dx) > 1)
{
var vx = dx * 0.2;
delimVArr[i]._x += vx;
}
else
{
delimVArr[i]._x = targetX;
}
}
else
{
// マウス位置より大きい区切りのイージング
var targetX = containerWidth - closeWidth * (delimLength - i - 1);
var dx = targetX - delimVArr[i]._x;
if (Math.abs(dx) > 1)
{
var vx = dx * 0.2;
delimVArr[i]._x += vx;
}
else
{
delimVArr[i]._x = targetX;
}
}
}
};
// ロールアウト
var rolloutHorizonal = function ()
{
for (i = 1; i < delimLength - 1; i++)
{
var vx = (i * defaultWidth - delimVArr[i]._x) * 0.2;
if (Math.abs(vx) > 1)
{
delimVArr[i]._x += vx;
}
else
{
delimVArr[i]._x = i * defaultWidth;
}
}
};
//--------------------------------------------------------------------------
//
// 垂直方向処理
//
//--------------------------------------------------------------------------
// ロールオーバー
var rolloverVertical = function ()
{
for (i = 0; i < delimLength - 1; i++)
{
if (delimHArr[i]._y < _root._ymouse)
{
// マウス位置より小さい区切りのイージング
var targetY = closeHeight * i;
var dy = (targetY - delimHArr[i]._y);
var vy = dy * 0.2;
delimHArr[i]._y += vy;
if (Math.abs(dy) > 1)
{
var vy = dy * 0.2;
delimHArr[i]._y += vy;
}
else
{
delimHArr[i]._y = targetY;
}
}
else
{
// マウス位置より大きい区切りのイージング
var targetY = containerHeight - closeHeight * (itemLength - i);
var dy = (targetY - delimHArr[i]._y);
if (Math.abs(dy) > 1)
{
var vy = dy * 0.2;
delimHArr[i]._y += vy;
}
else
{
delimHArr[i]._y = targetY;
}
}
}
};
// ロールアウト関数
var rolloutVertical = function ()
{
for (i = 0; i < itemLength; i++)
{
var vy = (i * defaultHeight - delimHArr[i]._y) * 0.2;
if (Math.abs(vy) > 1)
{
delimHArr[i]._y += vy;
}
else
{
delimHArr[i]._y = i * defaultHeight;
}
}
};
//--------------------------------------------------------------------------
//
// 文字
//
//--------------------------------------------------------------------------
// 文字変更
var changeText = function ()
{
// テキスト作成
for (var i = 0; i < itemLength; i++)
{
for (var j = 0; j < itemLength; j++)
{
// テキストのX座標
if (j == 0)
{
var left = 0;
}
else
{
var left = delimVArr[j]._x;
}
if (j == itemLength - 1)
{
var right = container._width;
}
else
{
var right = delimVArr[j + 1]._x;
}
var x = (left + right) / 2;
// テキストのY座標
if (i == 0)
{
var top = 0;
}
else
{
var top = delimHArr[i]._y;
}
if (i == itemLength - 1)
{
var bottom = containerHeight;
}
else
{
var bottom = delimHArr[i + 1]._y;
}
var y = (top + bottom) / 2;
textArr[i][j]._x = x;
textArr[i][j]._y = y;
}
}
};
}
//--------------------------------------------------------------------------
//
// 区切
//
//--------------------------------------------------------------------------
function Delim(argX, argY)
{
this._x = argX;
this._y = argY;
}
//--------------------------------------------------------------------------
//
// テキスト
//
//--------------------------------------------------------------------------
function Text(argX, argY)
{
this._x = argX;
this._y = argY;
}
//--------------------------------------------------------------------------
//
// メイン処理
//
//--------------------------------------------------------------------------
var prop = new Container();
var container = _root.attachMovie('container', 'container', _root.getNextHighestDepth(), prop);
// コントローラ初期化 : 項目数, 項目幅(デフォルト), 項目幅(開)
container.initContainer(4, 100, 140, 25, 40);コメント
No comments yet.
コメントの投稿
改行と段落タグは自動で挿入されます。
メールアドレスは表示されません。