スマホ対応アニメーション支援ライブラリ
Box 表示オブジェクト
表示オブジェクト。入れ子構造を作ることも可能。
Divエレメントをラップしている。
記述例
var stage = new smart.Stage("demo2"); var box1 = new smart.Box(200,100); box1.style({background:"#ee6600"}); box1.x = 20; box1.y = 20; stage.addChild(box1); var box2 = new smart.Box(100,50); box2.style({background:"#6699ff"}); box2.x = 20; box2.y = 20; box1.addChild(box2);
プロトタイプ
メソッド
new Box(width,height) | Boxオブジェクトを作成します。引数(幅、高さ、ピクセル指定)は省略可能です。 |
on(eventName,fn) | オブジェクトがイベントを発行した時に実行する関数を登録。 eventNameはスペースでつなげて複数設定することも可能。 |
off([eventName,fn]) | オブジェクトがイベントを発行した時に実行する関数を削除。 関数指定が無い場合には、指定されたtypeに紐づく全ての関数を削除。eventName指定が無い場合には、全ての関数を削除。 |
trigger(eventName,[data]) | eventNameで指定したイベントを発行する。 発行するイベントオブジェクトにはtype,target(発行元)が自動的に設定される。data(オブジェクト)を設定することでイベントオブジェクトを拡張できる。 |
reg(x,y) | ※暫定機能 回転や拡大縮小の際の基準y座標を0~1で指定。デフォルトは 0.5 |
style(styleObject) | ※暫定機能 スタイルをオブジェクト形式で指定。 |
addChild(view,[index]) | 表示オブジェクトを追加する。indexを指定して挿入位置を変更可能。 |
removeChild(view) | 表示オブジェクトを削除する |
child(id) | idを指定して表示オブジェクトを取得する |
プロパティ
enabled | Boolean | イベントの発行の有効/無効を設定、または取得。 false を代入すると、"click"、"mouseover" などの処理を unbindせずに一時的に無効化できる。 |
element | DOMElement | 読み取り専用。自身のDOMElementへアクセスする。 |
id | String | idを指定、取得する。DOMエレメント名。 |
parent | View | 読み取り専用。自身が配置されている親表示オブジェクトを取得する |
visible | Boolean | 表示 /非表示を指定、取得する |
x | Number | x座標を指定、取得する |
y | Number | y座標を指定、取得する |
z | Number | z-indexを指定、取得する |
alpha | Number | 不透明度を指定、取得する。デフォルトは 1 |
scaleX | Number | 幅方向の拡大率を指定、取得する。デフォルトは 1 |
scaleY | Number | 高さ方向の拡大率を指定、取得する。デフォルトは 1 |
scale | Number | 拡大率を指定、取得する。デフォルトは 1 |
rotation | Number | 回転角度を指定、取得する。例) view.rotation = 45; |
regX | Number | 回転や拡大縮小の際の基準x座標を指定、取得する。デフォルトは 0。(左上) |
regY | Number | 回転や拡大縮小の際の基準y座標を指定、取得する。デフォルトは 0。(左上) |
stage | Stage | 読み取り専用。自身が配置されたStageオブジェクトを返す |
width | Number | 幅をピクセルで指定、取得する。例外的に "auto" のみ代入可能。(デフォルト auto) |
height | Number | 高さをピクセルで指定、取得する。例外的に "auto" のみ代入可能。(デフォルト auto) |
mask | Boolean | 指定した幅、高さをはみ出した子オブジェクトを表示するかどうか指定する |
children | Array | 読み取り専用。addChildされた子オブジェクトの配列を返す |
html | String | テキスト(HTMLタグを含む)を指定。取得する。 |
イベント
"click" | 自身をクリックときに発行 |
"mouseover" | カーソルが自身の領域に入ったときに発行 |
"mouseout" | カーソルが自身の領域から外れたときに発行 |
"mousedown" | カーソルが押されたときに発行 |
"mouseup" | カーソルが離されたときに発行 |
"mousemove" | カーソルが動いたときに発行 |
"touchstart" | タッチが開始したとき発行 |
"touchmove" | タッチしたまま移動しているときに発行 |
"touchend" | タッチが終了したとき発行 その他、"touchcancel","gesturestart","gesturechange","gestureend"も対応デバイスで発行 |
Copyright (C) 2011-2017 akira igarashi (UNIZONBEX) All Rights Reserved.