裁剪变换使用低分辨率的图像，并将其分配给我的用户控制 [英] Clipping a low resolution image using Transforms and assigning it to my user control

查看：191
本文介绍了裁剪变换使用低分辨率的图像，并将其分配给我的用户控制的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我一直在努力，用户是拉伸=统一将一个图像加载在Windows RT 8.1应用程序。
中的图像可以是尽可能的小和尽可能大。
裁剪发生在我的用户控制，当我点击/按住屏幕/图像上出现我的用户控件。当我点击并按住并移动我的手指/鼠标一点，在后台图像周围
裁剪发生。



我现在面临的问题是




  1. 每当应用程序是加载的第一次仿真器，以及当点击/点击和控股执行的第一时间，用户控制显示在屏幕左侧的顶部，然后它来到我的点击/保持区​​域的上方。我要求是它应该总是出现，无论我点击并按住每当我点击并按住。在松开手指/鼠标，它应该崩溃。


  2. 我使用的中心变换。我想在用户控制在中心准确显示在我的鼠标是目前区域（像素），如果我加载一个小分辨率的图像480 * 800或更小，地区我的鼠标没有进入该中心。
    。要更清晰，想象一下，我点击并按住对人类eye.The角膜的角膜应显示在用户控制中心和区域的上方和下方应覆盖其余的部分。




  3. 我不希望我的控制去我的形象边界之外，如果我的鼠标在图像的最后一个像素时，应显示的图像的一些部分和背景的某些部分。


  4. 我需要如图旋转控制在 影片
    查找下面的完整代码。




MainPage.xaml中 

 <第
X：类=App78.MainPage
的xmlns =http://schemas.microsoft.com/winfx/2006/xaml/presentation
的xmlns：X =http://schemas.microsoft.com/winfx/2006/xaml
的xmlns：本地=使用：App78
的xmlns：D =HTTP：//模式.microsoft.com /表达/混合/ 2008
的xmlns：MC =http://schemas.openxmlformats.org/markup-compatibility/2006
 MC：可忽略=D> 
 
<电网
X：NAME =LayoutGrid
保证金=0,0
背景={ThemeResource ApplicationPageBackgroundThemeBrush}
控股= LayoutGrid_Holding
 PointerMoved =LayoutGrid_OnPointerMoved
 PointerWheelChanged =LayoutGrid_OnPointerWheelChanged
 PointerPressed =LayoutGrid_OnPointerPressed
 PointerReleased =LayoutGrid_OnPointerReleased> 
<图像
X：NAME =BigImage
的Horizo​​ntalAlignment =中心
 VerticalAlignment =中心
弹力=统一
来源= http://blog.al.com/space-news/2009/04/iss015e22574.jpg/> 
 
<局部：放大镜VerticalAlignment =顶部的Horizo​​ntalAlignment =左X：NAME =MagnifierTip能见度=折叠/> 
< /网格和GT; 
< /页>



MainPage.xaml.cs中 



 使用系统;使用System.Diagnostics程序
;使用Windows.UI.Xaml.Controls 
; 
使用Windows.UI.Xaml.Input; 
使用Windows.UI.Xaml.Media; 
使用Windows.UI.Xaml.Media.Imaging; 
 
命名空间App78 
 {
公共密封部分类的MainPage：第
 {
私人双zoomScale = 2; 
私人双pointerX = 0; 
私人双pointerY = 0; 
私人常量双MinZoomScale = 0.25; 
私人常量双MaxZoomScale = 32; 
 
 
公众的MainPage（）
 {
 this.InitializeComponent（）; 
 
 VAR BI =（BitmapImage的）BigImage.Source; 
 bi.ImageOpened + = bi_ImageOpened; 
 this.SizeChanged + = MainPage_SizeChanged; 
} 
 
无效MainPage_SizeChanged（对象发件人，Windows.UI.Xaml.SizeChangedEventArgs E）
 {
 this.UpdateImageLayout（）; 
} 
 
无效bi_ImageOpened（对象发件人，Windows.UI.Xaml.RoutedEventArgs E）
 {
 this.UpdateImageLayout（）; 
} 
 
私人无效UpdateImageLayout（）
 {
 VAR BI =（BitmapImage的）BigImage.Source; 
如果（bi.PixelWidth< this.LayoutGrid.ActualWidth&放大器;&安培; 
 bi.PixelHeight< this.LayoutGrid.ActualHeight）
 {
 this.BigImage.Stretch = Stretch.None; 
} 
，否则
 {
 this.BigImage.Stretch = Stretch.Uniform; 
} 
 
 this.UpdateMagnifier（）; 
} 
 
私人无效LayoutGrid_OnPointerMoved（对象发件人，PointerRoutedEventArgs E）
 {
 // DV：如果指针是不接触，我们可以忽略它
如果（e.Pointer.IsInContact！）{返回; } 
 
 VAR点= e.GetCurrentPoint（this.LayoutGrid）; 
 this.pointerX = point.Position.X; 
 this.pointerY = point.Position.Y; 
 this.UpdateMagnifier（）; 
} 
 
私人无效UpdateMagnifier（）
 {
 VAR BI =（BitmapImage的）BigImage.Source; 
 
双offsetX = 0; 
双offsetY = 0; 
双imageScale = 1; 
 
 VAR imageRatio =（双）bi.PixelWidth / bi.PixelHeight; 
 VAR gridRatio = this.LayoutGrid.ActualWidth / this.LayoutGrid.ActualHeight; 
 
如果（bi.PixelWidth< this.LayoutGrid.ActualWidth&放大器;&安培; 
 bi.PixelHeight< this.LayoutGrid.ActualHeight）
 {
 offsetX = 0.5 *（this.LayoutGrid.ActualWidth  -  bi.PixelWidth）; 
 offsetY = 0.5 *（this.LayoutGrid.ActualHeight  -  bi.PixelHeight）; 
 // imageScale = 1; - 保持
} 
，否则如果（imageRatio< gridRatio）
 {
 offsetX = 0.5 *（this.LayoutGrid.ActualWidth  -  imageRatio * this.LayoutGrid.ActualHeight）; 
 offsetY = 0; 
 imageScale = BigImage.ActualHeight / bi.PixelHeight; 
} 
，否则
 {
 offsetX = 0; 
 offsetY = 0.5 *（this.LayoutGrid.ActualHeight  -  this.LayoutGrid.ActualWidth / imageRatio）; 
 imageScale = BigImage.ActualWidth / bi.PixelWidth; 
} 
 
 // DV：这可能是不再$ B $需要b //MagnifierTip.MagnifierTransform.X = this.pointerX; 
 //MagnifierTip.MagnifierTransform.Y = this.pointerY; 
 MagnifierTip.PositionTransform.X =（-this.pointerX + offsetX）/ imageScale; 
 MagnifierTip.PositionTransform.Y =（-this.pointerY + offsetY）/ imageScale; 
 
 // DV：我没有测试过的缩放/缩放
 MagnifierTip.ZoomTransform.ScaleX = imageScale * zoomScale; 
 MagnifierTip.ZoomTransform.ScaleY = imageScale * zoomScale; 
 
 MagnifierTip.CenterTransform.X = MagnifierTip.MagnifierEllipse.ActualWidth / 2  -  MagnifierTip.MagnifierEllipse.StrokeThickness / 2; 
 MagnifierTip.CenterTransform.Y = MagnifierTip.MagnifierEllipse.ActualHeight / 2  -  MagnifierTip.MagnifierEllipse.StrokeThickness / 2; 
 
 // DV：我添加了一个GlobalGrid变换它转换孩童
 MagnifierTip.MagnifierTransformGrid.X = this.pointerX  - （MagnifierTip.ActualWidth / 2）; 
 MagnifierTip.MagnifierTransformGrid.Y = this.pointerY  - （MagnifierTip.ActualHeight）; ; 
 
} 
 
私人无效LayoutGrid_OnPointerWheelChanged（对象发件人，PointerRoutedEventArgs E）
 {
如果（e.GetCurrentPoint（this.LayoutGrid）.Properties.MouseWheelDelta大于0）
 {
 zoomScale = Math.Max（MinZoomScale，Math.Min（MaxZoomScale，zoomScale * 1.2））; 
} 
，否则
 {
 zoomScale = Math.Max（MinZoomScale，Math.Min（MaxZoomScale，zoomScale / 1.2））; 
} 
 
 this.UpdateMagnifier（）; 
} 
 
 
 // DV：控股通常只适用于触摸https://msdn.microsoft.com/en-us/library/windows/apps/windows.ui .xaml.uielement.holding.aspx F = 255安培; MSPPError = -2147217396 
私人无效LayoutGrid_Holding（对象发件人，HoldingRoutedEventArgs E）
 {
 // 
} 
 
 // DV：指针按下同时支持鼠标和触摸，但火灾immeadiatley。你必须找出一种拖延战术使用，或持有触摸，然后右击鼠标
私人无效LayoutGrid_OnPointerPressed（对象发件人，PointerRoutedEventArgs E）
 {
 MagnifierTip.Visibility = Windows.UI .Xaml.Visibility.Visible; 
} 
 
 // DV：指针推出同时支持鼠标和触摸。 
私人无效LayoutGrid_OnPointerReleased（对象发件人，PointerRoutedEventArgs E）
 {
 MagnifierTip.Visibility = Windows.UI.Xaml.Visibility.Collapsed; 
} 
} 
}



Magnifier.XAML 

 <用户控件
X：类=App78.Magnifier
的xmlns = http://schemas.microsoft.com/winfx/2006/xaml/presentation
的xmlns：X =http://schemas.microsoft.com/winfx/2006/xaml
的xmlns：本地=使用：App78
的xmlns：D =http://schemas.microsoft.com/expression/blend/2008
的xmlns：MC =http://schemas.openxmlformats.org/标记兼容性/ 2006
 MC：可忽略=D
 HEIGHT =230
 WIDTH =170> 
 
 
<电网HEIGHT =230WIDTH =170> 
 
<  -  DV：这是全局的变换，我添加 - > 
< Grid.RenderTransform> 
<&的TransformGroup GT; 
< TranslateTransform X：NAME =MagnifierTransformGridX：FieldModifier =公/> 
< /&的TransformGroup GT; 
< /Grid.RenderTransform> 
<椭圆透明度=1能见度=可见填充={ThemeResource ApplicationPageBackgroundThemeBrush}的Horizo​​ntalAlignment =中心VerticalAlignment =评出的IsHitTestVisible =FALSEWIDTH =135HEIGHT =128 StrokeThickness =3保证金=0,17,0,0/> 
<椭圆X：NAME =MagnifierEllipseX：FieldModifier =公不透明度=1能见度=可见的Horizo​​ntalAlignment =左VerticalAlignment =评出的IsHitTestVisible =FALSEWIDTH =150 HEIGHT =150行程=白StrokeThickness =3保证金=11,8,0,0> 
< Ellipse.Fill> 
<的ImageBrush 
的ImageSource =http://blog.al.com/space-news/2009/04/iss015e22574.jpg
弹力=无
 AlignmentX =左
 AlignmentY =评出的> 
< ImageBrush.Transform> 
<&的TransformGroup GT; 
< TranslateTransform X：FieldModifier =公
 X：NAME =CenterTransform/> 
< TranslateTransform X：FieldModifier =公
 X：NAME =PositionTransform/> 
< ScaleTransform X：FieldModifier =公
 X：NAME =ZoomTransform/> 
< /&的TransformGroup GT; 
< /ImageBrush.Transform> 
< /&的ImageBrush GT; 
< /Ellipse.Fill> 
< /椭圆> 
<路径数据=M25.533,0C15.457,0,7.262,8.199,7.262,18.271c0,9.461,13.676,19.698,17.63,32.338 c0.085,0.273,0.34,0.459,0.626， 0.457c0.287-0.004,0.538-0.192,0.619-0.467c3.836-12.951,17.666-22.856,17.667-32.33 C43.803,8.199,35.607,0,25.533,0z M25.533,32.131c-7.9,0 -14.328-6.429-14.328-14.328c0-7.9,6.428-14.328,14.328-14.328 c7.898,0,14.327,6.428,14.327,14.328C39.86,25.702,33.431,32.131,25.533,32.131z
填写=＃FFF4F4F5
拉伸=填充
行程=黑
 UseLayoutRounding =FALSE
 HEIGHT =227
 WIDTH = 171>< /路径和GT; 
< /网格和GT; 
< /用户控件>



为了方便，可以将项目从的此处。为了更好地理解，我希望你能看到这个影片。这是究竟是什么我需要执行


解决方案

我得到了它的一些变化和三角的这里。



MainPage.xaml中 

 <第
X：类=MagnifierApp .MainPage
的xmlns =http://schemas.microsoft.com/winfx/2006/xaml/presentation
的xmlns：X =http://schemas.microsoft.com/winfx/2006 / XAML
的xmlns：本地=使用：MagnifierApp
的xmlns：D =http://schemas.microsoft.com/expression/blend/2008
的xmlns：MC = http://schemas.openxmlformats.org/markup-compatibility/2006
 MC：可忽略=D> 
 
<电网
X：NAME =LayoutGrid
保证金=0,0
背景={ThemeResource ApplicationPageBackgroundThemeBrush}
 PointerMoved = LayoutGrid_OnPointerMoved
 PointerWheelChanged =LayoutGrid_OnPointerWheelChanged
 PointerPressed =LayoutGrid_OnPointerPressed
 PointerReleased =LayoutGrid_OnPointerReleased> 
<图像
X：NAME =BigImage
的Horizo​​ntalAlignment =中心
 VerticalAlignment =中心
弹力=统一
来源= http://blog.al.com/space-news/2009/04/iss015e22574.jpg/> 
<局部：放大镜
 X：NAME =MagnifierTip
 VerticalAlignment =评出的
的Horizo​​ntalAlignment =左
能见度=坍塌/> 
< /网格和GT; 
< /页>



MainPage.xaml.cs中 



 使用系统;使用Windows.UI.Xaml.Controls 
; 
使用Windows.UI.Xaml.Input; 
使用Windows.UI.Xaml.Media; 
使用Windows.UI.Xaml.Media.Imaging; 
 
命名空间MagnifierApp 
 {
公共密封部分类的MainPage：第
 {
私人双zoomScale = 2; 
私人双pointerX = 0; 
私人双pointerY = 0; 
私人常量双MinZoomScale = 0.25; 
私人常量双MaxZoomScale = 32; 
私人布尔isFirst = TRUE; 
 
公众的MainPage（）
 {
 this.InitializeComponent（）; 
 
 VAR BI =（BitmapImage的）BigImage.Source; 
 bi.ImageOpened + = bi_ImageOpened; 
 this.SizeChanged + = MainPage_SizeChanged; 
} 
 
无效MainPage_SizeChanged（对象发件人，Windows.UI.Xaml.SizeChangedEventArgs E）
 {
 this.UpdateImageLayout（）; 
} 
 
无效bi_ImageOpened（对象发件人，Windows.UI.Xaml.RoutedEventArgs E）
 {
 this.UpdateImageLayout（）; 
} 
 
私人无效UpdateImageLayout（）
 {
 VAR BI =（BitmapImage的）BigImage.Source; 
 
如果（bi.PixelWidth< this.LayoutGrid.ActualWidth&放大器;&安培; 
 bi.PixelHeight< this.LayoutGrid.ActualHeight）
 {
本。 BigImage.Stretch = Stretch.None; 
} 
，否则
 {
 this.BigImage.Stretch = Stretch.Uniform; 
} 
 
 this.UpdateMagnifier（）; 
} 
 
私人无效LayoutGrid_OnPointerMoved（对象发件人，PointerRoutedEventArgs E）
 {
如果（！e.Pointer.IsInContact）
 {
返回; 
} 
 
 VAR点= e.GetCurrentPoint（this.LayoutGrid）; 
 this.pointerX = point.Position.X; 
 this.pointerY = point.Position.Y; 
 this.UpdateMagnifier（）; 
} 
 
私人无效LayoutGrid_OnPointerWheelChanged（对象发件人，PointerRoutedEventArgs E）
 {
如果（e.GetCurrentPoint（this.LayoutGrid）.Properties.MouseWheelDelta大于0） 
 {
 zoomScale = Math.Max（MinZoomScale，Math.Min（MaxZoomScale，zoomScale * 1.2））; 
} 
，否则
 {
 zoomScale = Math.Max（MinZoomScale，Math.Min（MaxZoomScale，zoomScale / 1.2））; 
} 
 
 this.UpdateMagnifier（）; 
} 
 
私人无效LayoutGrid_OnPointerPressed（对象发件人，PointerRoutedEventArgs E）
 {
如果（e.Pointer.IsInContact！）{返回; } 
 
 VAR点= e.GetCurrentPoint（this.LayoutGrid）; 
 
 this.pointerX = point.Position.X; 
 this.pointerY = point.Position.Y; 
 this.UpdateMagnifier（）; 
 MagnifierTip.Visibility = Windows.UI.Xaml.Visibility.Visible; 
} 
 
私人无效LayoutGrid_OnPointerReleased（对象发件人，PointerRoutedEventArgs E）
 {
 MagnifierTip.Visibility = Windows.UI.Xaml.Visibility.Collapsed; 
} 
 
私人无效UpdateMagnifier（）
 {
 VAR BI =（BitmapImage的）BigImage.Source; 
 
双offsetX; 
双offsetY; 
双imageScale; 
 CalculateImageScaleAndOffsets（双向，出offsetX，出offsetY，出imageScale）; 
 
 MagnifierTip.PositionTransform.X =（-this.pointerX + offsetX）/ imageScale; 
 MagnifierTip.PositionTransform.Y =（-this.pointerY + offsetY）/ imageScale; 
 MagnifierTip.ZoomTransform.ScaleX = imageScale * zoomScale; 
 MagnifierTip.ZoomTransform.ScaleY = imageScale * zoomScale; 
 
 MagnifierTip.CenterTransform.X = MagnifierTip.MagnifierEllipse.ActualWidth / 2  -  MagnifierTip.MagnifierEllipse.StrokeThickness / 2; 
 MagnifierTip.CenterTransform.Y = MagnifierTip.MagnifierEllipse.ActualHeight / 2  -  MagnifierTip.MagnifierEllipse.StrokeThickness / 2; 
 
 MagnifierTip.MagnifierTranslateTransform.X = this.pointerX  - （MagnifierTip.ActualWidth / 2）; 
 MagnifierTip.MagnifierTranslateTransform.Y = this.pointerY  - （MagnifierTip.ActualHeight）; 
 
布尔tooHigh = MagnifierTip.MagnifierTranslateTransform.Y< 0; 
布尔tooLeft = MagnifierTip.MagnifierTranslateTransform.X< 0; 
布尔tooRight = MagnifierTip.MagnifierTranslateTransform.X + MagnifierTip.ActualWidth> this.LayoutGrid.ActualWidth; 
 
如果（tooHigh || tooLeft || tooRight）
 {
双角= 0.0; 
 
如果（tooLeft&安培;&安培;！tooHigh）
 {
变种DX = -MagnifierTip.MagnifierTranslateTransform.X; 
变种R = MagnifierTip.ActualHeight  -  MagnifierTip.ActualWidth / 2; 
 VAR阿拉德= Math.Asin（DX / R）; 
角=阿拉德* 180 / Math.PI; 
} 
，否则如果（tooLeft&安培;&安培; tooHigh）
 {
变种DX = -MagnifierTip.MagnifierTranslateTransform.X; 
变种DY = -MagnifierTip.MagnifierTranslateTransform.Y; 
变种R = MagnifierTip.ActualHeight  -  MagnifierTip.ActualWidth / 2; 
 VAR arad1 = Math.Asin（DX / R）; 
 VAR arad2 = Math.Acos（（R  -  DY）/ R）; 
 VAR阿拉德= Math.Max（arad1，arad2）; 
角=阿拉德* 180 / Math.PI; 
} 
，否则如果（tooHigh&安培;&安培;！tooRight）
 {
变种DY = -MagnifierTip.MagnifierTranslateTransform.Y; 
变种R = MagnifierTip.ActualHeight  -  MagnifierTip.ActualWidth / 2; 
 VAR阿拉德= Math.Acos（（R  -  DY）/ R）; 
 
如果（MagnifierTip.MagnifierTranslateTransform.X + Math.Sin（阿拉德）* R + MagnifierTip.ActualWidth> this.LayoutGrid.ActualWidth）
 {
阿拉德= -arad; 
} 
 
角=阿拉德* 180 / Math.PI; 
} 
，否则如果（tooHigh）
 {
变种DY = -MagnifierTip.MagnifierTranslateTransform.Y; 
变种DX = MagnifierTip.MagnifierTranslateTransform.X + MagnifierTip.ActualWidth  -  this.LayoutGrid.ActualWidth; 
变种R = MagnifierTip.ActualHeight  -  MagnifierTip.ActualWidth / 2; 
 VAR arad1 = -Math.Acos（（R  -  DY）/ R）; 
 VAR arad2 = -Math.Asin（DX / R）; 
 VAR阿拉德= Math.Min（arad1，arad2）; 
角=阿拉德* 180 / Math.PI; 
} 
，否则//如果（tooRight）
 {
变种DX = MagnifierTip.MagnifierTranslateTransform.X + MagnifierTip.ActualWidth  -  this.LayoutGrid.ActualWidth; 
变种R = MagnifierTip.ActualHeight  -  MagnifierTip.ActualWidth / 2; 
 VAR阿拉德= -Math.Asin（DX / R）; 
角=阿拉德* 180 / Math.PI; 
} 
 
 MagnifierTip.RotateTransform.Angle =角; 
 MagnifierTip.LensRotateTransform.Angle =利用广角; 
} 
，否则
 {
 MagnifierTip.RotateTransform.Angle = 0; 
 MagnifierTip.LensRotateTransform.Angle = 0; 
} 
} 
 
私人无效CalculateImageScaleAndOffsets（BitmapImage的双向，出双offsetX，出双offsetY，出双imageScale）
 {
 VAR imageRatio =（双）bi.PixelWidth / bi.PixelHeight; 
 VAR gridRatio = this.LayoutGrid.ActualWidth / this.LayoutGrid.ActualHeight; 
 
如果（bi.PixelWidth< this.LayoutGrid.ActualWidth&放大器;&安培; 
 bi.PixelHeight< this.LayoutGrid.ActualHeight）
 {
 offsetX = 0.5 *（this.LayoutGrid.ActualWidth  -  bi.PixelWidth）; 
 offsetY = 0.5 *（this.LayoutGrid.ActualHeight  -  bi.PixelHeight）; 
 imageScale = 1; 
} 
，否则如果（imageRatio< gridRatio）
 {
 offsetX = 0.5 *（this.LayoutGrid.ActualWidth  -  imageRatio * this.LayoutGrid.ActualHeight）; 
 offsetY = 0; 
 imageScale = BigImage.ActualHeight / bi.PixelHeight; 
} 
，否则
 {
 offsetX = 0; 
 offsetY = 0.5 *（this.LayoutGrid.ActualHeight  -  this.LayoutGrid.ActualWidth / imageRatio）; 
 imageScale = BigImage.ActualWidth / bi.PixelWidth; 
} 
} 
} 
}

< STRONG> Magnifier.xaml 

 <用户控件
X：类=MagnifierApp.Magnifier
的xmlns =http://schemas.microsoft.com/winfx/2006/xaml/presentation
的xmlns：X =http://schemas.microsoft.com/winfx/2006/xaml
的xmlns：本地=使用：MagnifierApp
的xmlns：D =http://schemas.microsoft.com/expression/blend/2008
的xmlns：MC =HTTP：//模式.openxmlformats.org /标记兼容性/ 2006
 MC：可忽略=D
 HEIGHT =227
 WIDTH =170> 
<电网
 HEIGHT =227
 WIDTH =170
 RenderTransformOrigin =0.5,1> 
< Grid.RenderTransform> 
<&的TransformGroup GT; 
< RotateTransform 
 X：FieldModifier =公
 X：NAME =RotateTransform
角=0/> 
< TranslateTransform 
 X：NAME =MagnifierTranslateTransform
 X：FieldModifier =公/> 
< /&的TransformGroup GT; 
< /Grid.RenderTransform> 
<椭圆
的Horizo​​ntalAlignment =左
 VerticalAlignment =评出的
 IsHitTestVisible =FALSE
 WIDTH =152
 HEIGHT = 152
填充={ThemeResource ApplicationPageBackgroundThemeBrush}
保证金=9,10,0,0
 RenderTransformOrigin =0.5,0.5
 StrokeThickness =0> ; 
< /椭圆> 
<椭圆
X：NAME =MagnifierEllipse
X：FieldModifier =公
的Horizo​​ntalAlignment =左
 VerticalAlignment =评出的
 IsHitTestVisible =FALSE
 WIDTH =152
 HEIGHT =152
行程=白
保证金=9,10,0,0
 RenderTransformOrigin =0.5,0.5
 StrokeThickness =0> 
< Ellipse.RenderTransform> 
< RotateTransform 
 X：FieldModifier =公
 X：NAME =LensRotateTransform
角=0/> 
< /Ellipse.RenderTransform> 
< Ellipse.Fill> 
<的ImageBrush 
的ImageSource =http://blog.al.com/space-news/2009/04/iss015e22574.jpg
弹力=无
 AlignmentX =左
 AlignmentY =评出的> 
< ImageBrush.Transform> 
<&的TransformGroup GT; 
< TranslateTransform 
 X：FieldModifier =公
 X：NAME =PositionTransform/> 
< ScaleTransform 
 X：FieldModifier =公
 X：NAME =ZoomTransform/> 
< TranslateTransform 
 X：FieldModifier =公
 X：NAME =CenterTransform/> 
< /&的TransformGroup GT; 
< /ImageBrush.Transform> 
< /&的ImageBrush GT; 
< /Ellipse.Fill> 
< /椭圆> 
<路径
数据=M85,11 C43.8548,11 10.5,44.3548 10.5,85.5 C10.5,126.645 43.8548,160 85160 C126.145,160 159.5,126.645 159.5,85.5 C159.5,44.3548 126.145 ，11 85,11žM85,0.5 C131.668,0.5 169.5,38.3319 169.5,85 C169.5,103.959 163.256,121.459 152.713,135.558 L151.895,136.625 L152,136.625 L84.2999,226 L18,136.625 L18.1054,136.625 L17。 2872,135.558 C6.74375,121.459 0.5,103.959 0.5,85 C0.5,38.3319 38.3319,0.5 85,0.5 Z
保证金=0,0.5,0,0
拉伸=填写
行程=黑
 UseLayoutRounding =假
 StrokeThickness =0
填充=白/> 
< /网格和GT; 
< /用户控件>


I have been working on a Windows 8.1 RT app where the user loads an image with Stretch=Uniform. The image can be as small as possible and as big as possible. The clipping happens in my user control and my user control appears when I tap/press and hold on the screen/image. Clipping happens when when I tap and hold and move my finger/mouse around the image that is in the background.

The Problems I am facing are

  1. Whenever the app is loaded for the first time on Emulator , and for the very first time when the tap /clicks and holding is performed , the user control appears on the top left on the screen and then it comes above my clicked/hold area. What I require is it should always appear wherever I click and hold and whenever I click and hold. On releasing the finger/mouse , it should collapse.

  2. I am using center transform. I want the region(the pixel) where my mouse is currently to be displayed exactly in the center of the user control , If i am loading a small resolution image 480*800 or even smaller , the region of my mouse is not coming into the center. To be more clearer, Imagine I am tapping and holding on the CORNEA of the human eye.The cornea should be displayed in the center of the user control and area above and below should cover the rest of the part.

    1. I don't want my control to go outside my image boundary, if my mouse is at the last pixel of the image , some part of image and some part of background should be displayed.

  3. I need to rotate the control as shown in the video Find the complete code below.

MainPage.XAML

<Page
    x:Class="App78.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:App78"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid
        x:Name="LayoutGrid"
        Margin="0,0"
        Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
        Holding="LayoutGrid_Holding"
        PointerMoved="LayoutGrid_OnPointerMoved"
        PointerWheelChanged="LayoutGrid_OnPointerWheelChanged"
        PointerPressed="LayoutGrid_OnPointerPressed"
        PointerReleased="LayoutGrid_OnPointerReleased">
        <Image
            x:Name="BigImage"
            HorizontalAlignment="Center"
            VerticalAlignment="Center"
            Stretch="Uniform"
            Source="http://blog.al.com/space-news/2009/04/iss015e22574.jpg" />

        <local:Magnifier VerticalAlignment="Top" HorizontalAlignment="Left" x:Name="MagnifierTip" Visibility="Collapsed" />
    </Grid>
</Page>

MAINPAGE.XAML.CS

using System;
using System.Diagnostics;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Media.Imaging;

namespace App78
{
    public sealed partial class MainPage : Page
    {
        private double zoomScale = 2;
        private double pointerX = 0;
        private double pointerY = 0;
        private const double MinZoomScale = .25;
        private const double MaxZoomScale = 32;


        public MainPage()
        {
            this.InitializeComponent();

            var bi = (BitmapImage)BigImage.Source;
            bi.ImageOpened += bi_ImageOpened;
            this.SizeChanged += MainPage_SizeChanged;
        }

        void MainPage_SizeChanged(object sender, Windows.UI.Xaml.SizeChangedEventArgs e)
        {
            this.UpdateImageLayout();
        }

        void bi_ImageOpened(object sender, Windows.UI.Xaml.RoutedEventArgs e)
        {
            this.UpdateImageLayout();
        }

        private void UpdateImageLayout()
        {
            var bi = (BitmapImage)BigImage.Source;
            if (bi.PixelWidth < this.LayoutGrid.ActualWidth &&
                bi.PixelHeight < this.LayoutGrid.ActualHeight)
            {
                this.BigImage.Stretch = Stretch.None;
            }
            else
            {
                this.BigImage.Stretch = Stretch.Uniform;
            }

            this.UpdateMagnifier();
        }

        private void LayoutGrid_OnPointerMoved(object sender, PointerRoutedEventArgs e)
        {
            //DV: If pointer is not in contact we can ignore it
            if (!e.Pointer.IsInContact) { return; }

            var point = e.GetCurrentPoint(this.LayoutGrid);
            this.pointerX = point.Position.X;
            this.pointerY = point.Position.Y;
            this.UpdateMagnifier();
        }

        private void UpdateMagnifier()
        {
            var bi = (BitmapImage)BigImage.Source;

            double offsetX = 0;
            double offsetY = 0;
            double imageScale = 1;

            var imageRatio = (double)bi.PixelWidth / bi.PixelHeight;
            var gridRatio = this.LayoutGrid.ActualWidth / this.LayoutGrid.ActualHeight;

            if (bi.PixelWidth < this.LayoutGrid.ActualWidth &&
                bi.PixelHeight < this.LayoutGrid.ActualHeight)
            {
                offsetX = 0.5 * (this.LayoutGrid.ActualWidth - bi.PixelWidth);
                offsetY = 0.5 * (this.LayoutGrid.ActualHeight - bi.PixelHeight);
                //imageScale = 1; - remains
            }
            else if (imageRatio < gridRatio)
            {
                offsetX = 0.5 * (this.LayoutGrid.ActualWidth - imageRatio * this.LayoutGrid.ActualHeight);
                offsetY = 0;
                imageScale = BigImage.ActualHeight / bi.PixelHeight;
            }
            else
            {
                offsetX = 0;
                offsetY = 0.5 * (this.LayoutGrid.ActualHeight - this.LayoutGrid.ActualWidth / imageRatio);
                imageScale = BigImage.ActualWidth / bi.PixelWidth;
            }

            //DV: This is probably not need anymore
           //MagnifierTip.MagnifierTransform.X = this.pointerX;
           //MagnifierTip.MagnifierTransform.Y = this.pointerY;
            MagnifierTip.PositionTransform.X = (-this.pointerX + offsetX) / imageScale;
            MagnifierTip.PositionTransform.Y = (-this.pointerY + offsetY) / imageScale;

            //DV: I haven't tested the Scaling/Zoom
            MagnifierTip.ZoomTransform.ScaleX = imageScale * zoomScale;
            MagnifierTip.ZoomTransform.ScaleY = imageScale * zoomScale;

            MagnifierTip.CenterTransform.X = MagnifierTip.MagnifierEllipse.ActualWidth / 2 - MagnifierTip.MagnifierEllipse.StrokeThickness / 2;
            MagnifierTip.CenterTransform.Y = MagnifierTip.MagnifierEllipse.ActualHeight / 2 - MagnifierTip.MagnifierEllipse.StrokeThickness / 2;

            //DV: I added a GlobalGrid Transform which translates every children
            MagnifierTip.MagnifierTransformGrid.X = this.pointerX - (MagnifierTip.ActualWidth / 2);
            MagnifierTip.MagnifierTransformGrid.Y = this.pointerY - (MagnifierTip.ActualHeight); ;

        }

        private void LayoutGrid_OnPointerWheelChanged(object sender, PointerRoutedEventArgs e)
        {
            if (e.GetCurrentPoint(this.LayoutGrid).Properties.MouseWheelDelta > 0)
            {
                zoomScale = Math.Max(MinZoomScale, Math.Min(MaxZoomScale, zoomScale * 1.2));
            }
            else
            {
                zoomScale = Math.Max(MinZoomScale, Math.Min(MaxZoomScale, zoomScale / 1.2));
            }

            this.UpdateMagnifier();
        }


        //DV: Holding usually only works with touch https://msdn.microsoft.com/en-us/library/windows/apps/windows.ui.xaml.uielement.holding.aspx?f=255&MSPPError=-2147217396
        private void LayoutGrid_Holding(object sender, HoldingRoutedEventArgs e)
        {
            //
        }

        //DV: pointer pressed supports both mouse and touch but fires immeadiatley. You'll have to figure out a delay strategy or using holding for touch and right click for mouse
        private void LayoutGrid_OnPointerPressed(object sender, PointerRoutedEventArgs e)
        {
            MagnifierTip.Visibility = Windows.UI.Xaml.Visibility.Visible;
        }

        //DV: pointer released supports both mouse and touch.
        private void LayoutGrid_OnPointerReleased(object sender, PointerRoutedEventArgs e)
        {
            MagnifierTip.Visibility = Windows.UI.Xaml.Visibility.Collapsed;
        }
    }
}

Magnifier.XAML

<UserControl
    x:Class="App78.Magnifier"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:App78"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    Height="230"
    Width="170">


    <Grid Height="230" Width="170">

        <!-- DV: This is the global transform I added -->
        <Grid.RenderTransform>
            <TransformGroup>
                <TranslateTransform x:Name="MagnifierTransformGrid" x:FieldModifier="public"/>
            </TransformGroup>
        </Grid.RenderTransform>
        <Ellipse Opacity="1" Visibility="Visible" Fill="{ThemeResource ApplicationPageBackgroundThemeBrush}"  HorizontalAlignment="Center" VerticalAlignment="Top" IsHitTestVisible="False" Width="135" Height="128"  StrokeThickness="3" Margin="0,17,0,0" />
        <Ellipse x:Name="MagnifierEllipse" x:FieldModifier="public" Opacity="1" Visibility="Visible" HorizontalAlignment="Left" VerticalAlignment="Top" IsHitTestVisible="False" Width="150" Height="150" Stroke="White" StrokeThickness="3" Margin="11,8,0,0" >
            <Ellipse.Fill>
                <ImageBrush
                    ImageSource="http://blog.al.com/space-news/2009/04/iss015e22574.jpg"
                    Stretch="None"
                    AlignmentX="Left"
                    AlignmentY="Top">
                    <ImageBrush.Transform>
                        <TransformGroup>
                            <TranslateTransform x:FieldModifier="public"
                                x:Name="CenterTransform"/>
                            <TranslateTransform x:FieldModifier="public"
                                x:Name="PositionTransform"/>
                            <ScaleTransform x:FieldModifier="public"
                                x:Name="ZoomTransform"/>
                        </TransformGroup>
                    </ImageBrush.Transform>
                </ImageBrush>
            </Ellipse.Fill>
        </Ellipse>
        <Path Data="M25.533,0C15.457,0,7.262,8.199,7.262,18.271c0,9.461,13.676,19.698,17.63,32.338 c0.085,0.273,0.34,0.459,0.626,0.457c0.287-0.004,0.538-0.192,0.619-0.467c3.836-12.951,17.666-22.856,17.667-32.33 C43.803,8.199,35.607,0,25.533,0z M25.533,32.131c-7.9,0-14.328-6.429-14.328-14.328c0-7.9,6.428-14.328,14.328-14.328 c7.898,0,14.327,6.428,14.327,14.328C39.86,25.702,33.431,32.131,25.533,32.131z"
              Fill="#FFF4F4F5"
              Stretch="Fill"
              Stroke="Black"
              UseLayoutRounding="False"
              Height="227"
              Width="171" ></Path>
    </Grid>
</UserControl>

For ease , the project can be downloaded from here. For better understanding , I would like you to see this video. This is what exactly I need to implement.

解决方案

I got it working with some changes and trigonometry here.

MainPage.xaml

<Page
    x:Class="MagnifierApp.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:MagnifierApp"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid
        x:Name="LayoutGrid"
        Margin="0,0"
        Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
        PointerMoved="LayoutGrid_OnPointerMoved"
        PointerWheelChanged="LayoutGrid_OnPointerWheelChanged"
        PointerPressed="LayoutGrid_OnPointerPressed"
        PointerReleased="LayoutGrid_OnPointerReleased">
        <Image
            x:Name="BigImage"
            HorizontalAlignment="Center"
            VerticalAlignment="Center"
            Stretch="Uniform"
            Source="http://blog.al.com/space-news/2009/04/iss015e22574.jpg" />
        <local:Magnifier
            x:Name="MagnifierTip"
            VerticalAlignment="Top"
            HorizontalAlignment="Left"
            Visibility="Collapsed" />
    </Grid>
</Page>

MainPage.xaml.cs

using System;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Media.Imaging;

namespace MagnifierApp
{
    public sealed partial class MainPage : Page
    {
        private double zoomScale = 2;
        private double pointerX = 0;
        private double pointerY = 0;
        private const double MinZoomScale = .25;
        private const double MaxZoomScale = 32;
        private bool isFirst = true;

        public MainPage()
        {
            this.InitializeComponent();

            var bi = (BitmapImage)BigImage.Source;
            bi.ImageOpened += bi_ImageOpened;
            this.SizeChanged += MainPage_SizeChanged;
        }

        void MainPage_SizeChanged(object sender, Windows.UI.Xaml.SizeChangedEventArgs e)
        {
            this.UpdateImageLayout();
        }

        void bi_ImageOpened(object sender, Windows.UI.Xaml.RoutedEventArgs e)
        {
            this.UpdateImageLayout();
        }

        private void UpdateImageLayout()
        {
            var bi = (BitmapImage)BigImage.Source;

            if (bi.PixelWidth < this.LayoutGrid.ActualWidth &&
                bi.PixelHeight < this.LayoutGrid.ActualHeight)
            {
                this.BigImage.Stretch = Stretch.None;
            }
            else
            {
                this.BigImage.Stretch = Stretch.Uniform;
            }

            this.UpdateMagnifier();
        }

        private void LayoutGrid_OnPointerMoved(object sender, PointerRoutedEventArgs e)
        {
            if (!e.Pointer.IsInContact)
            {
                return;
            }

            var point = e.GetCurrentPoint(this.LayoutGrid);
            this.pointerX = point.Position.X;
            this.pointerY = point.Position.Y;
            this.UpdateMagnifier();
        }

        private void LayoutGrid_OnPointerWheelChanged(object sender, PointerRoutedEventArgs e)
        {
            if (e.GetCurrentPoint(this.LayoutGrid).Properties.MouseWheelDelta > 0)
            {
                zoomScale = Math.Max(MinZoomScale, Math.Min(MaxZoomScale, zoomScale * 1.2));
            }
            else
            {
                zoomScale = Math.Max(MinZoomScale, Math.Min(MaxZoomScale, zoomScale / 1.2));
            }

            this.UpdateMagnifier();
        }

        private void LayoutGrid_OnPointerPressed(object sender, PointerRoutedEventArgs e)
        {
            if (!e.Pointer.IsInContact) { return; }

            var point = e.GetCurrentPoint(this.LayoutGrid);

            this.pointerX = point.Position.X;
            this.pointerY = point.Position.Y;
            this.UpdateMagnifier();
            MagnifierTip.Visibility = Windows.UI.Xaml.Visibility.Visible;
        }

        private void LayoutGrid_OnPointerReleased(object sender, PointerRoutedEventArgs e)
        {
            MagnifierTip.Visibility = Windows.UI.Xaml.Visibility.Collapsed;
        }

        private void UpdateMagnifier()
        {
            var bi = (BitmapImage)BigImage.Source;

            double offsetX;
            double offsetY;
            double imageScale;
            CalculateImageScaleAndOffsets(bi, out offsetX, out offsetY, out imageScale);

            MagnifierTip.PositionTransform.X = (-this.pointerX + offsetX) / imageScale;
            MagnifierTip.PositionTransform.Y = (-this.pointerY + offsetY) / imageScale;
            MagnifierTip.ZoomTransform.ScaleX = imageScale * zoomScale;
            MagnifierTip.ZoomTransform.ScaleY = imageScale * zoomScale;

            MagnifierTip.CenterTransform.X = MagnifierTip.MagnifierEllipse.ActualWidth / 2 - MagnifierTip.MagnifierEllipse.StrokeThickness / 2;
            MagnifierTip.CenterTransform.Y = MagnifierTip.MagnifierEllipse.ActualHeight / 2 - MagnifierTip.MagnifierEllipse.StrokeThickness / 2;

            MagnifierTip.MagnifierTranslateTransform.X = this.pointerX - (MagnifierTip.ActualWidth / 2);
            MagnifierTip.MagnifierTranslateTransform.Y = this.pointerY - (MagnifierTip.ActualHeight);

            bool tooHigh = MagnifierTip.MagnifierTranslateTransform.Y < 0;
            bool tooLeft = MagnifierTip.MagnifierTranslateTransform.X < 0;
            bool tooRight = MagnifierTip.MagnifierTranslateTransform.X + MagnifierTip.ActualWidth > this.LayoutGrid.ActualWidth;

            if (tooHigh || tooLeft || tooRight)
            {
                double angle = 0.0;

                if (tooLeft && !tooHigh)
                {
                    var dx = -MagnifierTip.MagnifierTranslateTransform.X;
                    var r = MagnifierTip.ActualHeight - MagnifierTip.ActualWidth / 2;
                    var arad = Math.Asin(dx / r);
                    angle = arad * 180 / Math.PI;
                }
                else if (tooLeft && tooHigh)
                {
                    var dx = -MagnifierTip.MagnifierTranslateTransform.X;
                    var dy = -MagnifierTip.MagnifierTranslateTransform.Y;
                    var r = MagnifierTip.ActualHeight - MagnifierTip.ActualWidth / 2;
                    var arad1 = Math.Asin(dx / r);
                    var arad2 = Math.Acos((r - dy) / r);
                    var arad = Math.Max(arad1, arad2);
                    angle = arad * 180 / Math.PI;
                }
                else if (tooHigh && !tooRight)
                {
                    var dy = -MagnifierTip.MagnifierTranslateTransform.Y;
                    var r = MagnifierTip.ActualHeight - MagnifierTip.ActualWidth / 2;
                    var arad = Math.Acos((r - dy) / r);

                    if (MagnifierTip.MagnifierTranslateTransform.X + Math.Sin(arad) * r + MagnifierTip.ActualWidth > this.LayoutGrid.ActualWidth)
                    {
                        arad = -arad;
                    }

                    angle = arad * 180 / Math.PI;
                }
                else if (tooHigh)
                {
                    var dy = -MagnifierTip.MagnifierTranslateTransform.Y;
                    var dx = MagnifierTip.MagnifierTranslateTransform.X + MagnifierTip.ActualWidth - this.LayoutGrid.ActualWidth;
                    var r = MagnifierTip.ActualHeight - MagnifierTip.ActualWidth / 2;
                    var arad1 = -Math.Acos((r - dy) / r);
                    var arad2 = -Math.Asin(dx / r);
                    var arad = Math.Min(arad1, arad2);
                    angle = arad * 180 / Math.PI;
                }
                else //if (tooRight)
                {
                    var dx = MagnifierTip.MagnifierTranslateTransform.X + MagnifierTip.ActualWidth - this.LayoutGrid.ActualWidth;
                    var r = MagnifierTip.ActualHeight - MagnifierTip.ActualWidth / 2;
                    var arad = -Math.Asin(dx / r);
                    angle = arad * 180 / Math.PI;
                }

                MagnifierTip.RotateTransform.Angle = angle;
                MagnifierTip.LensRotateTransform.Angle = -angle;
            }
            else
            {
                MagnifierTip.RotateTransform.Angle = 0;
                MagnifierTip.LensRotateTransform.Angle = 0;
            }
        }

        private void CalculateImageScaleAndOffsets(BitmapImage bi, out double offsetX, out double offsetY, out double imageScale)
        {
            var imageRatio = (double)bi.PixelWidth / bi.PixelHeight;
            var gridRatio = this.LayoutGrid.ActualWidth / this.LayoutGrid.ActualHeight;

            if (bi.PixelWidth < this.LayoutGrid.ActualWidth &&
                bi.PixelHeight < this.LayoutGrid.ActualHeight)
            {
                offsetX = 0.5 * (this.LayoutGrid.ActualWidth - bi.PixelWidth);
                offsetY = 0.5 * (this.LayoutGrid.ActualHeight - bi.PixelHeight);
                imageScale = 1;
            }
            else if (imageRatio < gridRatio)
            {
                offsetX = 0.5 * (this.LayoutGrid.ActualWidth - imageRatio * this.LayoutGrid.ActualHeight);
                offsetY = 0;
                imageScale = BigImage.ActualHeight / bi.PixelHeight;
            }
            else
            {
                offsetX = 0;
                offsetY = 0.5 * (this.LayoutGrid.ActualHeight - this.LayoutGrid.ActualWidth / imageRatio);
                imageScale = BigImage.ActualWidth / bi.PixelWidth;
            }
        }
    }
}

Magnifier.xaml

<UserControl
    x:Class="MagnifierApp.Magnifier"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:MagnifierApp"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    Height="227"
    Width="170">
    <Grid
        Height="227"
        Width="170"
        RenderTransformOrigin="0.5,1">
        <Grid.RenderTransform>
            <TransformGroup>
                <RotateTransform
                    x:FieldModifier="public"
                    x:Name="RotateTransform"
                    Angle="0" />
                <TranslateTransform
                    x:Name="MagnifierTranslateTransform"
                    x:FieldModifier="public" />
            </TransformGroup>
        </Grid.RenderTransform>
        <Ellipse
            HorizontalAlignment="Left"
            VerticalAlignment="Top"
            IsHitTestVisible="False"
            Width="152"
            Height="152"
            Fill="{ThemeResource ApplicationPageBackgroundThemeBrush}"
            Margin="9,10,0,0"
            RenderTransformOrigin="0.5,0.5"
            StrokeThickness="0">
        </Ellipse>
        <Ellipse
            x:Name="MagnifierEllipse"
            x:FieldModifier="public"
            HorizontalAlignment="Left"
            VerticalAlignment="Top"
            IsHitTestVisible="False"
            Width="152"
            Height="152"
            Stroke="White"
            Margin="9,10,0,0"
            RenderTransformOrigin="0.5,0.5"
            StrokeThickness="0">
            <Ellipse.RenderTransform>
                <RotateTransform
                    x:FieldModifier="public"
                    x:Name="LensRotateTransform"
                    Angle="0" />
            </Ellipse.RenderTransform>
            <Ellipse.Fill>
                <ImageBrush
                    ImageSource="http://blog.al.com/space-news/2009/04/iss015e22574.jpg"
                    Stretch="None"
                    AlignmentX="Left"
                    AlignmentY="Top">
                    <ImageBrush.Transform>
                        <TransformGroup>
                            <TranslateTransform
                                x:FieldModifier="public"
                                x:Name="PositionTransform" />
                            <ScaleTransform
                                x:FieldModifier="public"
                                x:Name="ZoomTransform" />
                            <TranslateTransform
                                x:FieldModifier="public"
                                x:Name="CenterTransform" />
                        </TransformGroup>
                    </ImageBrush.Transform>
                </ImageBrush>
            </Ellipse.Fill>
        </Ellipse>
        <Path
            Data="M85,11 C43.8548,11 10.5,44.3548 10.5,85.5 C10.5,126.645 43.8548,160 85,160 C126.145,160 159.5,126.645 159.5,85.5 C159.5,44.3548 126.145,11 85,11 z M85,0.5 C131.668,0.5 169.5,38.3319 169.5,85 C169.5,103.959 163.256,121.459 152.713,135.558 L151.895,136.625 L152,136.625 L84.2999,226 L18,136.625 L18.1054,136.625 L17.2872,135.558 C6.74375,121.459 0.5,103.959 0.5,85 C0.5,38.3319 38.3319,0.5 85,0.5 z"
            Margin="0,0.5,0,0"
            Stretch="Fill"
            Stroke="Black"
            UseLayoutRounding="False"
            StrokeThickness="0"
            Fill="White" />
    </Grid>
</UserControl>

这篇关于裁剪变换使用低分辨率的图像，并将其分配给我的用户控制的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文
相关文章
C#/.NET最新文章
热门教程
热门工具
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆