AnimatedImageDrawableクラス
AnimatedImageDrawableを使用すると、スプライトシートを使用してアニメーションを表示することができます。
スプライトシートは、アニメーションに必要なすべてのキーフレームを含む画像ファイルです。キーフレームのサイズ(幅と高さ)はすべてのキーフレームについて同じである必要があり、このサイズをインスタンス生成時に渡します。キーフレームは0から始まる配列で管理されます。配列の要素は、一番上の行から左から右の順に格納されます。スプライトシートの端にあるサイズが不完全なキーフレームは無視されます。
インスタンス生成時にパラメーターを渡して、AnimatedImageDrawableのプロパティをカスタマイズできます。
//create a new AnimatedImageDrawable from an ImageResource and pass some setup parameters var animatedImageDrawable = new AR.AnimatedImageDrawable(imageResource, 5, 40, 50 { enabled : false, translate : { x: 1 }, rotate : { z: 190 } }); // start playing the Animation, with keyframes 0-4, each keyframe is shown 10 miliseconds, and the animation is looped 10 times animatedImageDrawable.animate([0, 1, 2, 3, 4], 10, 10);
コンストラクター
AnimatedImageDrawable
-
imageResource
-
height
-
keyFrameWidth
-
keyFrameHeight
-
options
パラメーター:
-
imageResource
ImageResourceAnimatedImageDrawableに使用されるスプライトシートを表すimageResource。
-
height
NumberAnimatedImageDrawableの高さ(SDU単位)。高さはインスタンス生成時に設定され、幅は基になるキーフレームのアスペクト比に従って計算されます。
-
keyFrameWidth
Numberスプライトシート上のキーフレームの幅(ピクセル単位)。整数にする必要があります。
-
keyFrameHeight
Numberスプライトシート上のキーフレームの高さ(ピクセル単位)。整数にする必要があります。
-
options
Object オプション追加のオブジェクトプロパティをカスタマイズするためのパラメーター。
設定可能なプロパティは以下のとおりです。-
enabled
(デフォルト値:true
) Boolean オプション -
mirrored
(デフォルト値:true
) Boolean オプション -
onClick
Function オプション -
onDragBegan
Function オプション -
onDragChanged
Function オプション -
onDragEnded
Function オプション -
onPanBegan
Function オプション -
onPanChanged
Function オプション -
onPanEnded
Function オプション -
onRotationBegan
Function オプション -
onRotationChanged
Function オプション -
onRotationEnded
Function オプション -
onScaleBegan
Function オプション -
onScaleChanged
Function オプション -
onScaleEnded
Function オプション -
rotate.x
(デフォルト値:0
) Number オプション -
rotate.y
(デフォルト値:0
) Number オプション -
rotate.z
(デフォルト値:0
) Number オプション -
rotate.global.x
(デフォルト値:0
) Number オプション -
rotate.global.y
(デフォルト値:0
) Number オプション -
rotate.global.z
(デフォルト値:0
) Number オプション -
translate.x
(デフォルト値:0
) Number オプション -
translate.y
(デフォルト値:0
) Number オプション -
translate.z
(デフォルト値:0
) Number オプション -
translate.global.x
(デフォルト値:0
) Number オプション -
translate.global.y
(デフォルト値:0
) Number オプション -
translate.global.z
(デフォルト値:0
) Number オプション -
scale.x
(デフォルト値:1
) Number オプション -
scale.y
(デフォルト値:1
) Number オプション -
scale.z
(デフォルト値:1
) Number オプション -
horizontalAnchor
(デフォルト値:AR.CONST.HORIZONTAL_ANCHOR.CENTER
) Object オプション -
verticalAnchor
(デフォルト値:AR.CONST.VERTICAL_ANCHOR.MIDDLE
) Object オプション -
zOrder
(デフォルト値:0
) Number オプション -
opacity
(デフォルト値:1
) Number オプション -
onFinish
Function オプション -
keyFrame
(デフォルト値:0
) Number オプション開始キーフレーム。
-
項目索引
プロパティ
- destroyed
- enabled
- height
- horizontalAnchor
- imageResource
- mirrored
- offsetX 非推奨
- offsetY 非推奨
- opacity
- rotate
- rotate.global.x
- rotate.global.y
- rotate.global.z
- rotate.heading 非推奨
- rotate.roll 非推奨
- rotate.tilt 非推奨
- rotate.x
- rotate.y
- rotate.z
- rotatesToCamera
- rotation 非推奨
- scale 非推奨
- scale.x
- scale.y
- scale.z
- translate
- translate.global.x
- translate.global.y
- translate.global.z
- translate.x
- translate.y
- translate.z
- verticalAnchor
- zOrder
メソッド
animate
-
keyFrames
-
duration
-
loopTimes
指定したキーフレームに基づいてアニメーションを開始します。
destroy
()
オブジェクトを破棄します。
getBoundingRectangle
()
BoundingRectangle
このDrawable2DのBoundingRectangleを返します。エラーの場合はnullが返されます。
戻り値:
Drawable2DのBoundingRectangle。
setKeyFrame
-
keyFramePos
アニメーションを停止し、AnimatedImageDrawableの内容をkeyFramePosの位置にあるキーフレームに設定します。keyFramePosに指定した数値が使用可能なキーフレームの数を超えている場合は、キーフレーム配列内の有効な位置に自動で調整されます。
パラメーター:
-
keyFramePos
Int配列内のキーフレームの位置。
プロパティ
enabled
Boolean
Drawableを有効または無効にするフラグ。無効なDrawableはカメラビューに表示されず、トリガーも発生しません。有効な場合は状況に応じてレンダリングされ、トリガーが発生します。
デフォルト値: true
horizontalAnchor
Number
Drawable2Dによって表されるGeoObjectのスクリーン位置に、Drawable2Dのどのピクセル(水平ピクセル列内)が配置されるか、水平方向のアンカーを設定します。
有効な値はAR.CONST.HORIZONTAL_ANCHORで定義されています。たとえば、ImageDrawableの水平アンカーとしてLEFTを設定した場合は、拡張オブジェクトの左端がアンカーポイントとして設定されます。
デフォルトの水平アンカーポイントは、Drawable2Dによって表される拡張オブジェクトの種類によって異なります。
mirrored
Boolean
このDrawableのミラーリングを有効または無効にするフラグ。フロントカメラを使用したとき、ミラーリングしたDrawableはy軸を中心に180°回転します。
デフォルト値: 一般的なDrawableの場合はtrue、ラベルとHTMLDrawableの場合はfalse
opacity
Number
Drawable2Dによって表される拡張オブジェクトの透明度を定義する0.0~1.0の範囲内の値。値に0を設定すると拡張オブジェクトは完全に透明になり、値に1を設定すると完全に不透明で表示されます。
デフォルト値: 1
rotate
Object
Drawableの中央を中心とした回転を定義します。このプロパティを使用すると、最高のパフォーマンスを出すために、Wikitude SDKのネイティブサイドへの1回の呼び出しで、x、y、zコンポーネントを同時に設定できます。 Objectは、x、y、z、またはそのサブセットを含むことができます。
rotate.global.x
Number
ターゲット画像のx軸を中心としたDrawableの回転(度単位)を定義します。値には360の剰余が適用されます。つまり、361°を設定した場合と1°を設定した場合は同じ結果になります。すべてのグローバル変換は、ローカル変換後に適用されます。
デフォルト値: 0
rotate.global.y
Number
ターゲット画像のy軸を中心としたDrawableの回転(度単位)を定義します。値には360の剰余が適用されます。つまり、361°を設定した場合と1°を設定した場合は同じ結果になります。すべてのグローバル変換は、ローカル変換後に適用されます。
デフォルト値: 0
rotate.global.z
Number
ターゲット画像のz軸を中心としたDrawableの回転(度単位)を定義します。値には360の剰余が適用されます。つまり、361°を設定した場合と1°を設定した場合は同じ結果になります。すべてのグローバル変換は、ローカル変換後に適用されます。
デフォルト値: 0
rotate.x
Number
x軸を中心としたDrawableの回転(度単位)を定義します。値には360の剰余が適用されます。つまり、361°を設定した場合と1°を設定した場合は同じ結果になります。
デフォルト値: 0
rotate.y
Number
y軸を中心としたDrawableの回転(度単位)を定義します。値には360の剰余が適用されます。つまり、361°を設定した場合と1°を設定した場合は同じ結果になります。
デフォルト値: 0
rotate.z
Number
z軸を中心としたDrawableの回転(度単位)を定義します。値には360の剰余が適用されます。つまり、361°を設定した場合と1°を設定した場合は同じ結果になります。
デフォルト値: 0
rotatesToCamera
Boolean
drawableがカメラに向くように指向されているかどうかを定義します。 これは、GeoObjectにアタッチされているDrawablesに対してのみ可能です。
デフォルト値: 汎用drawablesの場合はtrue、モデルの場合はfalse。
translate
Object
Drawableの平行移動を定義します。 このプロパティを使用すると、最高のパフォーマンスを出すために、Wikitude SDKのネイティブサイドへの1回の呼び出しで、x、y、zコンポーネントを同時に設定できます。 Objectは、x、y、z、またはそのサブセットを含むことができます。
translate.global.x
Number
Drawableの計算された位置までのSDU単位の水平オフセット。 Drawableの位置は、xに正の値を設定すると右に移動し、負の値を設定すると左に移動します。 すべてのグローバル変換は、ローカル変換後に適用されます。
デフォルト値: 0
translate.global.y
Number
Drawableの計算された位置までのSDU単位の垂直オフセット。Drawableの位置は、yに正の値を設定すると上に移動し、負の値を設定すると下に移動します。 すべてのグローバル変換は、ローカル変換後に適用されます。
デフォルト値: 0
translate.global.z
Number
Drawableの計算された位置までのSDU単位の深さオフセット。 Drawableの位置は、zに正の値を設定するとユーザーの方に移動し、負の値を設定すると奥に移動します。 すべてのグローバル変換は、ローカル変換後に適用されます。
デフォルト値: 0
translate.x
Number
Drawableの計算された位置までのSDU単位の水平オフセット。 Drawableの位置は、xに正の値を設定すると右に移動し、負の値を設定すると左に移動します。
デフォルト値: 0
translate.y
Number
Drawableの計算された位置までのSDU単位の垂直オフセット。Drawableの位置は、yに正の値を設定すると上に移動し、負の値を設定すると下に移動します。
デフォルト値: 0
translate.z
Number
Drawableの計算された位置までのSDU単位の深さオフセット。 Drawableの位置は、zに正の値を設定するとユーザーの方に移動し、負の値を設定すると奥に移動します。
デフォルト値: 0
verticalAnchor
Number
Drawable2Dによって表されるGeoObjectのスクリーン位置に、Drawable2Dのどのピクセル(垂直ピクセル列内)が配置されるか、垂直方向のアンカーを設定します。
有効な値はAR.CONST.VERTICAL_ANCHORで定義されています。たとえば、Imageの垂直アンカーとしてTOPを設定した場合は、拡張オブジェクトの上端がアンカーポイントとして設定されます。
デフォルトの垂直アンカーポイントは、Drawable2Dによって表される拡張オブジェクトの種類によって異なります。
zOrder
Number
特定のGeoObjectに複数のDrawable2Dが割り当てられている場合、zOrderによってそれらのDrawableの描画順序が決まります。複数のDrawableが重なる場合は、zOrder値の高いDrawableの方が前面にレンダリングされます(たとえば、zOrder = 1のDrawableはzOrder = 0のDrawableより前面にレンダリングされます)。同じzOrderを持つDrawableが重なった場合の動作は不定であり、予期しない結果になる可能性があります。そのため、重なる可能性のあるDrawableにはzOrderを定義することを推奨します。
異なるGeoObjectに属するDrawableのレンダリング順序を指定するには、GeoObject.renderingOrderを参照してください。
整数にする必要があります。
デフォルト値: 0
イベント
onClick
Drawableをクリックすると、Drawable.onClickトリガーが実行されます。画面上のクリックは複数のDrawableにヒットする場合があるため、最前面のDrawableを先頭とする"クリックされたDrawableのキュー"が作成されます。トリガーの戻り値は、このDrawableのonClick()トリガーが実行された後にキューの次のDrawableのonClick()トリガーを実行するかどうかを決定します。キューの最後のDrawableがさらにonClick()トリガーの実行を要求した場合は、ARObject.onClick()トリガーが実行されます。さらにキューの実行が要求された場合は、context.onScreenClick()トリガーが実行されます。
このトリガーの戻り値により後続のクリックキューの処理を決定します。falseの場合、クリックキューの実行はこのDrawableで停止しません。したがって、次のDrawableのonClick()トリガーが実行されます。これは、戻り値が設定されていない場合、またはこのDrawableに対してonClickトリガーが定義されていない場合のデフォルト値です。trueの場合、キューの実行は現在のDrawableで停止し、後続のDrawableのonClick()トリガーは実行されません。
イベントペイロード:
-
arObject
ARObjectクリックされたDrawableにアタッチされているARObject。
このトリガーのデフォルト値はnullであり、トリガーが発生したときに何もアクションは実行されません。開発者はonClickトリガーにカスタム関数を指定することで、カスタム機能を追加できます。
onDragBegan
ユーザーが1本の指でDrawableのドラッグを開始したときに実行されます。このコールバックは、イベント伝播の流れとしてonClickコールバックと同じように動作します。
イベントペイロード:
-
xNormalized
Number開始タッチ位置と更新タッチ位置[-1,1]との間のX軸上の距離。 ドラッグジェスチャへの変更が発生していない場合、onDragBeganは常に0です。
-
yNormalized
Number開始タッチ位置と更新タッチ位置[-1,1]との間のY軸上の距離。 ドラッグジェスチャへの変更が発生していない場合、onDragBeganは常に0です。
-
xIntersection
Numberワールド空間における、開始タッチレイとインスタントトラッキング平面の交点位置のX座標 [-無限, 無限]。InstantTrackableが使用できない場合は未定義
-
yIntersection
Numberワールド空間における、開始タッチレイとインスタントトラッキング平面の交点位置のY座標 [-無限, 無限]。InstantTrackableが使用できない場合は未定義
onDragChanged
ユーザーが1本の指でDrawableをドラッグすると実行されます。このコールバックは、イベント伝播の流れとしてonClickコールバックと同じように動作します。
イベントペイロード:
-
xNormalized
Number開始タッチ位置と更新タッチ位置[-1,1]との間のX軸上の距離。
-
yNormalized
Number開始タッチ位置と更新タッチ位置[-1,1]との間のY軸上の距離。
-
xIntersection
Numberワールド空間における、更新されたタッチレイとインスタントトラッキング平面の交点位置のX座標 [-無限, 無限]。InstantTrackableが使用できない場合は未定義
-
yIntersection
Numberワールド空間における、更新されたタッチレイとインスタントトラッキング平面の交点位置のY座標 [-無限, 無限]。InstantTrackableが使用できない場合は未定義
onDragEnded
ユーザーが1本の指でDrawableのドラッグを停止したときに実行されます。このコールバックは、イベント伝播の流れとしてonClickコールバックと同じように動作します。
イベントペイロード:
-
xNormalized
Number開始タッチ位置と更新タッチ位置[-1,1]との間のX軸上の距離。 onDragChangedで受信した最新の距離と常に同じ
-
yNormalized
Number開始タッチ位置と更新タッチ位置[-1,1]との間のY軸上の距離。 onDragChangedで受信した最新の距離と常に同じ
-
xIntersection
Numberワールド空間における、終了タッチレイとインスタントトラッキング平面の交点位置のX座標 [-無限, 無限]。InstantTrackableが使用できない場合は未定義
-
yIntersection
Numberワールド空間における、更新されたタッチレイとインスタントトラッキング平面の交点位置のY座標 [-無限, 無限]。InstantTrackableが使用できない場合は未定義
onFinish
このトリガーは、AnimatedImageDrawableが完了したときに発生します。
このトリガーのデフォルト値はnullであり、トリガーが発生したときに何もアクションは実行されません。開発者はonFinishトリガーにカスタム関数を指定することで、カスタム機能を追加できます。
onPanBegan
ユーザーが2本の指でDrawableのドラッグを開始したときに実行されます。このコールバックは、イベント伝播の流れとしてonClickコールバックと同じように動作します。
イベントペイロード:
onPanChanged
ユーザーが2本の指でDrawableをドラッグすると実行されます。このコールバックは、イベント伝播の流れとしてonClickコールバックと同じように動作します。
onPanEnded
ユーザーが2本の指でDrawableのドラッグを停止したときに実行されます。このコールバックは、イベント伝播の流れとしてonClickコールバックと同じように動作します。
onRotationBegan
ユーザーが2本の指でDrawableの回転を開始したときに実行されます。このコールバックは、イベント伝播の流れとしてonClickコールバックと同じように動作します。
イベントペイロード:
-
angle
Number開始タッチ位置によって定義された線と更新されたタッチ位置[0,360]によって定義される線との間の角度でのCCW角度。回転ジェスチャの変更が発生していない場合、onRotationBeganでは常に0です。
onRotationChanged
ユーザーが2本の指でDrawableを回転したときに実行されます。このコールバックは、イベント伝播の流れとしてonClickコールバックと同じように動作します。
イベントペイロード:
-
angle
Number開始タッチ位置によって定義された線と更新されたタッチ位置[0,360]によって定義される線との間の角度でのCCW角度。
onRotationEnded
ユーザーが2本の指でDrawableの回転を停止したときに実行されます。このコールバックは、イベント伝播の流れとしてonClickコールバックと同じように動作します。
イベントペイロード:
-
angle
Number開始タッチ位置によって定義された線と更新されたタッチ位置[0,360]によって定義される線との間の角度でのCCW角度。onRotationChangedで受け取った最新の角度と常に同じ。
onScaleBegan
ユーザーが2本の指でDrawableの拡大縮小を開始するときに実行されます。このコールバックは、イベント伝播の流れとしてonClickコールバックと同じように動作します。
イベントペイロード:
-
scale
Number開始タッチと更新されたタッチ間の距離の比を定義した[0、inf]のスケール値。 スケールジェスチャへの変更が発生していない場合、onScaleBeganは常に1です。
onScaleChanged
ユーザーが2本の指でDrawableを拡大縮小するときに実行されます。このコールバックは、イベント伝播の流れとしてonClickコールバックと同じように動作します。
イベントペイロード:
-
scale
Number開始タッチと更新されたタッチ間の距離の比を定義した[0、inf]のスケール値。
onScaleEnded
ユーザーが2本の指でDrawableのスケーリングを停止したときに実行されます。このコールバックは、イベント伝播の流れとしてonClickコールバックと同じように動作します。
イベントペイロード:
-
scale
Number開始タッチと更新されたタッチ間の距離の比を定義した[0、inf]のスケール値。 onScaleChangedで受信した最新のスケールと常に同じ。