hh？！.. event.localXは、スケールされたスプライトに "比率"を保持しますか？

Question

私は、メディアプレーヤーのための単純なプログレスバーを配置し、色付きの矩形を描き、必要に応じて幅プロパティを変更することを計画しました。視覚的にはそれはうまく見える - うまくスケール（私はゼロ幅で描くことができなかったので、私は0.1の最小値を割り当てた）。

実際の問題は異なっていますが、非常に奇妙な、または少なくとも絶対に明らかではないようです。その進行状況バーのユーザーのクリックを監視する必要があるので、メディアストリームのシーク操作をサポートするために、私はクリックイベントを検出し、親DisplayObjectからのオフセットとしてx座標をとり、時間に再計算してシークを行います。今度は、event.localXはスプライトと共に実際にはスケールされません。私が言ったように、プログレスバーの最も右の座標は0.1で、実際のバーがどのように広がっても5,100,1000になります（バーの最も右のピクセルをクリックすると、それは - 0.1になります！

hh ... ..

明らかに何か間違っています。多分、refreshCoordinates（）なんかのようなメソッドがありますか？それは何ですか？..

Answer 1

なぜ起こるのかを理解することは、Flashの仕組みを理解する上で非常に重要です。キーは、すべての表示オブジェクトに独自の座標系があることを認識することです。スコープがそのシステムの内部にあるときは、オブジェクト自体が回転、拡大縮小などされているかどうかは関係ありません。グラフィックは0.1ピクセル幅で、クリックが右の境界線で発生したことです。あなたが住んでいる表示オブジェクトが階層のどこかに引き伸ばされているかどうかは分かりません。そのため、あなたが見ているイベントプロパティはlocalXと呼ばれています。その表示オブジェクト内でクリックが発生した場所をローカルでに伝えます。

これは、この状況では、バーのグラフィックを100ピクセル幅にしてから、ステージ上で必要に応じてサイズを変更するのが一般的です。グラフィックが内部で100ピクセルで、そのスコープ内でクリックが検出された場合は、localXを割合として扱うことができます。そして、ページを再設計してバーの視覚的な幅を変更すると、コードに触れる必要はありません。

ちなみに、座標系を別の座標系に変換する場合は、localToGlobalとglobalToLocalを一緒に使用してください。それは次のとおりです。

var localToThis:Point = new Point(someX, someY); 
var globalToStage:Point = localToGlobal(localToThis); 
var localToParent:Point = parent.globalToLocal(globalToStage); 

（またはあなたの問題を解決する別の方法は、単純ではなく、それはない、グラフィックの内部よりも、さらにバーは本当に100pxに広い表示階層、アップクリックイベントをキャプチャすることです。）

最後の1つの注意点：0.1ピクセル幅のグラフィックスを作る習慣を身に付けないでください。 x,rotationなどのレンダリングに関連する値を使用すると、パフォーマンス上の理由から、視覚的に区別できるサイズ以下のものが丸ごと表示されることがあります。オブジェクトを100ピクセルまたは何でも作成し、好きなだけ小さくしてください。

Answer 2

これは、グローバルvsローカル座標と関係があると推測しています。なぜLocalToGlobalメソッドを試してみませんか？ Hereは、その機能を説明する記事です。

Answer 3

私はこれまでにこれまでに遭遇したことはありませんが、確かに奇妙に見えます。問題の描画をgraphicsオブジェクトで再現し、スプライトの幅を変更することができました。

とにかく、簡単な回避策があります。最大幅を先にしてバーを描き、それを拡大縮小します。このような何か：

var sp:Sprite = new Sprite(); 

sp.graphics.beginFill(0xff0000); 
sp.graphics.drawRect(0,0,200,30); 
sp.graphics.endFill(); 
sp.scaleX = 0; 

sp.addEventListener(Event.ENTER_FRAME,handleEnterFrame); 
sp.addEventListener(MouseEvent.CLICK,handleClick); 
addChild(sp); 

function handleClick(e:MouseEvent):void { 
    trace(e.localX); 
} 

function handleEnterFrame(e:Event):void { 
    sp.scaleX += 0.01; 
} 

私は進行状況をシミュレートするためのフレームを入力して使用していますが、ポイントは、あなたが進捗状況を反映するために、スプライトのscaleX代わりにwidthを更新することです。