マウスホイールでズーム

Flash+AS3で、scaleを使ったやり方。

ブラウザロック(Gecko) ↑ソースコードはこちら(AS3)。

全体眺めて、気になるところへズームイン!

※IEの方は、Ctrl押しながらホイールしてください。
→ブラウザのフォントサイズ変わるけど。
 マウスホイールと埋め込みFlashは相性悪いようですね。

※FireFoxだと、Alt?よくわからない。
→どれも、ブラウザのフォントサイズを変えてしまうようでした。

※見づらい等の苦情は受け付けない。


scaleプロパティを使って簡単に拡大縮小できますが、ムービークリップの基準点(拡大縮小の中心点)をActionScriptからは変更できないため、若干使い勝手が悪い。

そこで、あるポイントを中心にscaleしたい場合は、「scaleした分、位置をずらす」という手法でやってみます。

ロジックは以下のとおりで、絵を描いてみれば、簡単な数学。



赤点を固定して、n倍からm倍に拡大するとき、X方向にずらさなければならない幅(Xo'-Xo)は、

  Xo' - Xo = m/n * P - P

よって、

  clip.x -= ( m / n - 1 ) * P

みたいなコードになります(Y軸も同じ)。ポイントは、拡大前のスケールも記憶しておくこと。


※サンプルのポインターが若干ずれるのは、埋め込みフォント(これはこれで独自のスケーリング)を利用しているため。・・と思われる。


コメント

コメントしてください

closed.