1

スクロールビューア内で画像をズームイン/ズームアウトするときに問題が発生します。ズームインボタンを使用すると、ボタンがクリックされるたびに、画像の幅/高さが元のサイズの1.25になるようにダブルアニメーションが使用されます。倍率を0.75に設定するズームアウトボタンについても同じことが言えます。ここまでは順調ですね。

問題は、scrollviewer IDの中心を基準にしてクリックした場所に基づいて、クリックポイントに向かってスクロールしたいということです。これに基づいてデルタx/yを計算します。これは、x軸とy軸のスクロールの方向を決定するために使用されます。

double deltaX = (ClickPosition.X - center.X)
double deltaY = (ClickPosition.Y - center.Y)

ここで、垂直スクロールバーと水平スクロールバーにデルタを適用するときに、画像の現在のズーム率を考慮する必要があります（これも二重アニメーションでアニメーション化されます）。

ズームとスクロールを同時に行うと、最終的な位置が期待どおりになりません。画像スケーリングの原点は常に画像の0,0（左上隅）にあるように見えるので、それをどのように処理するかわからないため、中央の左側をクリックすると、クリックするよりも左に強くスクロールします中央の右側。

例： http： //212.214.41.66/SilverlightZoom/RealQImageMapTestPage.html

ソース： http： //212.214.41.66/SilverlightZoom/ImageMap.zip

4

1 に答える 1

1

コードでは、画像の幅と高さを増やして画像をズームします。これは常に左上の点の周りで発生します。ただし、スケーリング変換を使用する場合は、画像をスケーリングするポイントを設定できます。

<Image x:Name="img" Margin="151,127,208,142" Source="Waterfall.jpg" Stretch="Fill">
                   <Image.RenderTransform>
                   <ScaleTransform x:Name="imagescale" ScaleX="1.2" ScaleY="1.2" CenterX="100" CenterY="100">
                   </ScaleTransform>
                   </Image.RenderTransform>
                   </Image>

このコードサンプルはhereから取得されました

これにより、プロパティにバインドすることで、スケーリングを ClickPosition に設定できるようになります。

別のメモ: スケーリングがそのように機能することを意図しているかどうかはわかりませんが、1.25 倍にズームインする場合は、0.75 ではなく 1/1.25 でズームアウトする必要があります。これにより、ズームが一定に保たれ、ズームが進むにつれて変化します（つまり、2回ズームインして2回ズームアウトすると、ズーム1ではなくなります）。

于 2009-10-08T07:37:35.647 に答える