イメージの中心をレイアウト変換の元にズーム

Question

キャンバスコントロールの中心を原点にして画像を拡大したい。最初はレンダリングの変換がうまくいったが、ズーム後にスクロールバーが表示されなかったそれについてレイアウト変換がその目的のために使用されるべきであることを発見しました。私の問題はズーム後にスクロールバーを取得していますが、ズーム原点がキャンバスの左上にあります。

<ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto"> 
     <Canvas x:Name="grdMain" RenderTransformOrigin="0.5,0.5"> 

      <Image Source="{Binding BmpImageSource,UpdateSourceTrigger=PropertyChanged}" x:Name="TargetImage" > 
      </Image> 



      <!-- <Canvas.RenderTransform> 
       <TransformGroup> 
        <ScaleTransform ScaleX="{Binding ScaleFactor}" ScaleY="{Binding ScaleFactor}" /> 
       </TransformGroup> 
      </Canvas.RenderTransform>--> 
      <Canvas.LayoutTransform> 
       <TransformGroup> 
        <ScaleTransform ScaleX="{Binding ScaleFactor}" ScaleY="{Binding ScaleFactor}" /> 
       </TransformGroup> 
      </Canvas.LayoutTransform> 



     </Canvas> 
    </ScrollViewer> 

私はレイアウト変換にcenterXとcenterYを設定すると言っていますが、アプリケーションのサイズが動的で固定されていない場合があります。

<ScaleTransform ScaleX="{Binding ScaleFactor}" ScaleY="{Binding ScaleFactor}" 
     CenterX="250" CenterY="250"/> 

Answer 1

いくつかの提案は、変換レイアウトにcenterXとcenterYを設定すると言うが、私のアプリケーションのサイズは動的であり、私は中心点を固定しない場合があります。

次に、あなたが動的にCenterXとCenterYプロパティの値を計算する必要があります。 LayoutTransformを使用する場合は、これらのプロパティを使用してコントロールの中心を基準にしてスケールする必要があります。

は

あなたは、例えば、プログラムLayoutTransformを適用するためにCanvasのLoadedイベントを処理できます。

<Canvas x:Name="grdMain" Loaded="grdMain_Loaded">... 

---

private void grdMain_Loaded(object sender, RoutedEventArgs e) 
{ 
    Canvas canvas = sender as Canvas; 
    ScaleTransform st = new ScaleTransform(); 
    BindingOperations.SetBinding(st, ScaleTransform.ScaleXProperty, new Binding("ScaleFactor")); 
    BindingOperations.SetBinding(st, ScaleTransform.ScaleYProperty, new Binding("ScaleFactor")); 
    st.CenterX = canvas.ActualWidth/2; 
    st.CenterY = canvas.ActualHeight/2; 
    canvas.LayoutTransform = st; 
}