0

DisplayObjectを特定のポイントにズームしようとしています。簡単だと思いましたが、今は1日かけて理解しようとしています。

基本的に、これはうまくいくはずだと思います。強調する必要があります。

//newPoint is the point being centered. There is no initial scaling, so I do not need to compensate for that (yet)
//scale is the zoom level
//container is the parent of the obj
//obj is the object being scaled/panned
var p:Point = new Point(
    ( this.container.width - this.obj.width * scale + newPoint.x * scale ) / 2, 
    ( this.container.height - this.obj.height * scale + newPoint.y * scale ) / 2 
);

this.obj.scaleX = this.obj.scaleY = scale;
this.obj.x = p.x;
this.obj.y = p.y;

スケールが1の場合はポイントが中心になりますが、スケールを大きくすると中心から離れていきます。私は何十もの異なる方法を試しました。私がいくつかのサイトで見たこの方法は、まったく同じ結果をもたらしました。誰かがこれを機能させる方法を知っていますか？

編集10-1-12：フォローアップとして、LondonDrugs_MediaServicesが提供したコードスニペットを元の問題の基礎として使用しました。スケールされていない画像に対して特定のスケールで特定のポイントにズームできる必要がありました（Googleマップが特定の場所にズームする方法を考えてみてください）。これを行うには、翻訳コードを実行する前に、画像をポイントの中央に配置する必要がありました。以下に追加のコードを投稿しました。他の用途（ピンチしてズーム、スクロール、ダブルクリック）には、Vesperが提供するコードを使用しました。これは非常にうまく機能しました。

//obj is the object being translated
//container is its parent
//x and y are the coordinates to be zoomed to, in untranslated scaling
//obj.scaleX and obj.scaleY are always identical in my class, so there is no need to account for that


//calculates current center point, with scaling
var center:Point = new Point( ( this.container.width - this.obj.width * this.obj.scaleX ) / 2, ( this.container.height - this.obj.height * this.obj.scaleX ) / 2 );

//calulcates the distance from center the point is, with scaling
var distanceFromCenter:Point = new Point( this.obj.width * this.obj.scaleX / 2 - x * this.obj.scaleX, this.obj.height * this.obj.scaleX / 2 - y * this.obj.scaleX );

//center the object on that specific point
this.obj.x = center.x + distanceFromCenter.x;
this.obj.y = center.y + distanceFromCenter.y;
4

4 に答える 4

1 
var mat:Matrix=new Matrix();
mat.translate(-p.x,-p.y);
mat.scale(desiredScale,desiredScale);
mat.translate(p.x,p.y);
yourObject.transform.matrix=mat;

核心は、スケーリングが (0,0) の周りで行われることですが、アフィン変換を記述する行列で行うことができます。最初に空の行列 (つまり、変換しない行列) を作成し、次にそれに一連の変換を適用します。最初に、-1* 座標で移動して目的の点を (0,0) に配置し、次にスケーリングしてから元に戻します。

于 2012-09-29T04:33:46.133 に答える
1

こんにちはみんな....あなたのコメントに感謝します...私は答えを見つけました...コード：

gambar.addEventListener(TransformGestureEvent.GESTURE_ZOOM , onZoom);
関数 onZoom(event:TransformGestureEvent):void {

    var locX:Number=event.localX;

    var locY:Number=event.localY;

    var stX:Number=event.stageX;

    var stY:Number=event.stageY;

    var prevScaleX:Number=gambar.scaleX;

    var prevScaleY:Number=gambar.scaleY;

    var mat:Matrix;

    var externalPoint=new Point(stX,stY);

    var internalPoint=new Point(locX,locY);

    gambar.scaleX *= event.scaleX;

    gambar.scaleY *= event.scaleY;

     if(event.scaleX>1 && gambar.scaleX>6){

         gambar.scaleX=prevScaleX;

         gambar.scaleY=prevScaleY;

       }

     if(event.scaleY>1 && gambar.scaleY>6){

         gambar.scaleX=prevScaleX;

         gambar.scaleY=prevScaleY;

       } 

      if(event.scaleX<1 && gambar.scaleX<0.8){

         gambar.scaleX=prevScaleX;

         gambar.scaleY=prevScaleY;

       }

     if(event.scaleY<1 && gambar.scaleY<0.8){

         gambar.scaleX=prevScaleX;

         gambar.scaleY=prevScaleY;

       }  

     mat=gambar.transform.matrix.clone();

     MatrixTransformer.matchInternalPointWithExternal(mat,internalPoint,externalPoint);

     gambar.transform.matrix=mat;

    }
于 2014-01-09T01:36:58.057 に答える
0

マトリックスの答えは完全に正しいですが、Club GreenSock のメンバーである場合は、TransformAroundPointPlugin を使用した非常に単純なコードでいくつかの優れた機能を利用できます。

http://www.greensock.com/as/docs/tween/com/greensock/plugins/TransformAroundPointPlugin.html

プラグイン エクスプローラーで例を確認できます: http://www.greensock.com/tweenlite/#plugins

これを使用してすべてのズームをトゥイーンし、これを手動で実行しようとしたときよりもパフォーマンスが大幅に向上しました。IMOライブラリ全体が金の重さの価値があります（ライブラリが好きなこと以外に関係はありません）。他の機能が必要な場合は、検討します。また、ThrowProps プラグイン ( http://www.greensock.com/throwprops/ ) も含まれています。これは、モバイルでバウンディング ボックスを作成し、境界にスムーズに戻りたい場合に非常に重要です。

于 2012-10-01T21:27:08.480 に答える
-1

obj.xを-pxに、obj.yを-pyに設定し、コンテナーscaleXとscaleYを目的の値に設定し、pxをコンテナーxに、pyをコンテナーyに追加します。終わり！

于 2012-09-28T23:01:05.863 に答える