ScaleTransform在LayoutTransform不工作，但有工作的RenderTransform [英] ScaleTransform in LayoutTransform not working but works with RenderTransform

问题描述

我试图做两件事情在我的应用程序。

1。变焦图像

能与的RenderTransform 做的。但需要在 LayoutTransform 来实现，以使的ScrollViewer 。

XAML

工作

 < Image.RenderTransform> 
< ScaleTransform的ScaleX ={结合的ScaleX}的scaleY ={结合的scaleY}/> 
< /Image.RenderTransform> 
  

不工作

 < Image.LayoutTransform> 
< ScaleTransform的ScaleX ={结合的ScaleX}的scaleY ={结合的scaleY}/> 
< /Image.LayoutTransform> 
  

2。旋转图像

作品有两个 ScaleTransform 和的RenderTransform ，但需要用 ScaleTransform 获得的ScrollViewer

但问题是在 ScaleTransform 与 LayoutTransform

 < Image.LayoutTransform> 
<&的TransformGroup GT; 
< ScaleTransform的ScaleX ={结合的ScaleX}的scaleY ={结合的scaleY}/> 
< RotateTransform角={结合RotateAngle}/> 
< /&的TransformGroup GT; 
< /Image.LayoutTransform> 
  

没能过达到既 ScaleTransform 和 RotateTransform 与的ScrollViewer

我曾尝试与画布

XAML

 < Canvas.LayoutTransform> 
<&的TransformGroup GT; 
< ScaleTransform的ScaleX ={结合的ScaleX}的scaleY ={结合的scaleY}/> 
< RotateTransform角={结合RotateAngle}/> 
< /&的TransformGroup GT; 
< /Canvas.LayoutTransform> 
  

旋转的不同的行为，但能够实现这两个功能的工作，但的ScrollViewer 不滚动

旋转行为画布

-

想这样做具有相同视框

旋转用的ScrollViewer变焦不工作的作品。

<以下

p>完整的代码

 <&的ScrollViewer GT; 
< Viewbox控件RenderTransformOrigin =0.5,0.5HEIGHT =自动WIDTH =自动ScrollViewer.CanContentScroll =真> 
< Viewbox.LayoutTransform> 
<&的TransformGroup GT; 
< ScaleTransform的ScaleX ={结合的ScaleX}的scaleY ={结合的scaleY}/> 
< RotateTransform角={结合RotateAngle}/> 
< /&的TransformGroup GT; 
< /Viewbox.LayoutTransform> 
<图像RenderTransformOrigin =0.5,0.5> 
< Image.Source> 
< BitmapImage的UriSource ={结合的ImagePath}ScrollViewer.CanContentScroll =真>< / BitmapImage的GT&; 
< /Image.Source> 
< /图像> 
< / Viewbox控件> 
< /&的ScrollViewer GT; 
  

任何人都可以帮助我的建议。

为我工作的解决方案通过GazTheDestroyer

XAML

 建议<图像RenderTransformOrigin =0.5,0.5拉伸=无> 
< Image.LayoutTransform> 
<&的TransformGroup GT; 
< ScaleTransform的ScaleX ={结合的ScaleX}的scaleY ={结合的scaleY}/> 
< RotateTransform角={结合RotateAngle}/> 
< /&的TransformGroup GT; 
< /Image.LayoutTransform> 
< Image.Source> 
< BitmapImage的UriSource ={结合的ImagePath}ScrollViewer.CanContentScroll =真>< / BitmapImage的GT&; 
< /Image.Source> 
< /图像> 
  

解决方案

尝试添加拉伸=无到提供一个明确的高度和宽度你的图片标签，或失败。

在某些面板WPF将图像自动伸展到面板中的可用空间，这将使你的尺度变换冗余时，它的布局过程的一部分。

I am trying to do two things in my application.

1. Zoom Image

Able to do with RenderTransform. but need to achieve in LayoutTransform to enable Scrollviewer.

xaml

working.

 <Image.RenderTransform>
      <ScaleTransform ScaleX="{Binding ScaleX}" ScaleY="{Binding ScaleY}" />
 </Image.RenderTransform>

Not Working

<Image.LayoutTransform>
     <ScaleTransform ScaleX="{Binding ScaleX}" ScaleY="{Binding ScaleY}" />
</Image.LayoutTransform>

2. Rotate Image

works with both ScaleTransform and RenderTransform but need it with ScaleTransform to obtain ScrollViewer

Problem is in ScaleTransform with LayoutTransform

<Image.LayoutTransform>
    <TransformGroup> 
       <ScaleTransform ScaleX="{Binding ScaleX}" ScaleY="{Binding ScaleY}" />
       <RotateTransform Angle="{Binding RotateAngle}"/>
    </TransformGroup>
</Image.LayoutTransform>

Not able too achieve both ScaleTransform and RotateTransform with ScrollViewer

I have tried with Canvas

xaml

<Canvas.LayoutTransform>
   <TransformGroup> 
      <ScaleTransform ScaleX="{Binding ScaleX}" ScaleY="{Binding ScaleY}" />
      <RotateTransform Angle="{Binding RotateAngle}"/>
   </TransformGroup>
</Canvas.LayoutTransform>

Different behavior of rotate but able to achieve both functionality working but ScrollViewer not scrolling.

Rotate Behavior for canvas

-

Tried doing the same with ViewBox

rotate works with ScrollViewer Zoom not working.

Full Code below

<ScrollViewer>
    <Viewbox  RenderTransformOrigin="0.5,0.5" Height="Auto" Width="Auto" ScrollViewer.CanContentScroll="True">
         <Viewbox.LayoutTransform>
                <TransformGroup> 
                    <ScaleTransform ScaleX="{Binding ScaleX}" ScaleY="{Binding ScaleY}" />
                    <RotateTransform Angle="{Binding RotateAngle}"/>
                </TransformGroup>
            </Viewbox.LayoutTransform>
        <Image RenderTransformOrigin="0.5,0.5" >               
            <Image.Source>                    
                <BitmapImage UriSource="{Binding ImagePath}" ScrollViewer.CanContentScroll="True"></BitmapImage>
            </Image.Source>
        </Image>
    </Viewbox>
 </ScrollViewer>

Anyone can help me with suggestions.

Worked solution for me suggested by 'GazTheDestroyer'

XAML

<Image RenderTransformOrigin="0.5,0.5" Stretch="None" >
            <Image.LayoutTransform>
                <TransformGroup>
                  <ScaleTransform ScaleX="{Binding ScaleX}" ScaleY="{Binding ScaleY}" />
                  <RotateTransform Angle="{Binding RotateAngle}"/>
               </TransformGroup>
           </Image.LayoutTransform>
         <Image.Source>                    
           <BitmapImage UriSource="{Binding ImagePath}" ScrollViewer.CanContentScroll="True"></BitmapImage>
         </Image.Source>
 </Image>

解决方案

Try adding Stretch="None" to your Image tag, or failing that supply an explicit height and width.

In certain panels WPF will automatically stretch the image to the available space in the panel, which will make your scale transform redundant when it's part of the layout process.

这篇关于ScaleTransform在LayoutTransform不工作，但有工作的RenderTransform的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！