如何在wpf中翻转图片
我最近学会了如何使用“TransformedBitmap”和“RotateTransformed”类来旋转BitmapImage。 现在我可以在我的图像上执行顺时针旋转。 但是,如何翻转图像? 我找不到类来执行BitmapImage的水平和垂直翻转。 请帮我弄清楚如何做到这一点。 例如,如果我的图像是一个看起来像“d”的graphics,那么垂直翻转会导致类似于“q”的东西,而水平翻转会导致某种东西变成“b”。 我希望这是清楚的。
提前致谢! 最好的问候,shashank
使用一个ScaleTransform ,水平的ScaleX为-1,垂直翻转的ScaleY为-1,应用于图像的RenderTransform
属性。 在图像上使用RenderTransformOrigin="0.5,0.5"
可以确保图像在其中心位置翻转,因此您不必额外使用TranslateTransform将其移动到位:
<Image Source="a.jpg" Padding="5" RenderTransformOrigin="0.5,0.5"> <Image.RenderTransform> <ScaleTransform ScaleX="-1"/> </Image.RenderTransform> </Image>
为水平翻转和
<Image Source="a.jpg" Padding="5" RenderTransformOrigin="0.5,0.5"> <Image.RenderTransform> <ScaleTransform ScaleY="-1"/> </Image.RenderTransform> </Image>
为垂直。
如果你想在代码隐藏方面做到这一点,在C#中应该看起来像这样:
img.RenderTransformOrigin = new Point(0.5,0.5); ScaleTransform flipTrans = new ScaleTransform(); flipTrans.ScaleX = -1; //flipTrans.ScaleY = -1; img.RenderTransform = flipTrans;
为了给你的翻转多一点“深度”,看起来更像是一个真正的翻转,你可能想要做一个小规模变换的扭曲变换。
你会想歪斜对象约20度,使它看起来好像是在3D翻转。 这是一个穷人3D翻转。 你可以在WPF中完成一个真正的3D翻转,但这需要更多的工作。
这会给你看起来更干净的animation,然后你可以切换两个不同面板上的可见性,给你的元素的前面和后面的印象。
<DoubleAnimationUsingKeyFrames Storyboard.TargetName="MyControl" Storyboard.TargetProperty="(FrameworkElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)"> <SplineDoubleKeyFrame KeyTime="00:00:00.0" Value="1" /> <SplineDoubleKeyFrame KeyTime="00:00:00.09" Value="0.3" /> <SplineDoubleKeyFrame KeyTime="00:00:00.12" Value="0.6" /> <SplineDoubleKeyFrame KeyTime="00:00:00.15" Value="0.8" /> <SplineDoubleKeyFrame KeyTime="00:00:00.18" Value="1" /> <SplineDoubleKeyFrame KeyTime="00:00:00.2" Value="1" /> </DoubleAnimationUsingKeyFrames> <DoubleAnimationUsingKeyFrames Storyboard.TargetName="MyControl" Storyboard.TargetProperty="(FrameworkElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)"> <SplineDoubleKeyFrame KeyTime="00:00:00.0" Value="1" /> <SplineDoubleKeyFrame KeyTime="00:00:00.09" Value="0.9" /> <SplineDoubleKeyFrame KeyTime="00:00:00.18" Value="1" /> <SplineDoubleKeyFrame KeyTime="00:00:00.2" Value="1" /> </DoubleAnimationUsingKeyFrames> <DoubleAnimationUsingKeyFrames Storyboard.TargetName="MyControl" Storyboard.TargetProperty="(FrameworkElement.RenderTransform).(TransformGroup.Children)[1].(SkewTransform.AngleY)"> <SplineDoubleKeyFrame KeyTime="00:00:00" Value="0" /> <SplineDoubleKeyFrame KeyTime="00:00:00.06" Value="-10" /> <SplineDoubleKeyFrame KeyTime="00:00:00.09" Value="-20" /> <SplineDoubleKeyFrame KeyTime="00:00:00.1" Value="20" /> <SplineDoubleKeyFrame KeyTime="00:00:00.18" Value="0" /> </DoubleAnimationUsingKeyFrames>
有趣的3d翻转用户控件: http ://flipcontrol.codeplex.com/releases/view/22358
在你的情况下,你将不得不在双方都显示相同的图像。
水平(仅)翻转btw的快速技巧是将FlowDirection属性设置为FlowDirection.RightToLeft。 如果组件是一个容器,它的一些孩子可能会以不同的方式解释属性(定制逻辑)
您可以使用ScaleTransform和ScaleX
/ ScaleY
:
<TextBlock Text="P"> <TextBlock.RenderTransform> <ScaleTransform ScaleY="-1" ScaleX="-1" /> </TextBlock.RenderTransform> </TextBlock>