Windows phone 7 自定义矩形，角上有圆windows phone 7
我正在windows phone 7中开发一个照片应用程序。我想要一个在角上有圆的矩形，这将允许用户从角圆调整矩形的大小，如果用户想要移动矩形，则将其向任何方向拖动。请参见示例1和示例2 我正在使用这种机制通过这个矩形裁剪图像，你会在图像编辑器中看到这种类型的控件，尤其是在iPhone照片应用程序中。我在google.com上查看了所有的AAP样本和其他想法，但从未见过这样的想法。我也读过画布和它们的操纵事件概念，但不知道如何实现，甚至不知道它是否用于这种机制？请在这方面提供完整的源代码，我们将不胜感激 看到样本数字，你就会明白我到底想要什么 您可以创建表示此类形状的UserControl。在UserControl中放置一个网格，并在其中放置一个矩形和四个圆。例如：Windows phone 7 自定义矩形，角上有圆windows phone 7,windows-phone-7,canvas,crop,rectangles,Windows Phone 7,Canvas,Crop,Rectangles,我正在windows phone 7中开发一个照片应用程序。我想要一个在角上有圆的矩形，这将允许用户从角圆调整矩形的大小，如果用户想要移动矩形，则将其向任何方向拖动。请参见示例1和示例2 我正在使用这种机制通过这个矩形裁剪图像，你会在图像编辑器中看到这种类型的控件，尤其是在iPhone照片应用程序中。我在google.com上查看了所有的AAP样本和其他想法，但从未见过这样的想法。我也读过画布和它们的操纵事件概念，但不知道如何实现，甚至不知道它是否用于这种机制？请在这方面提供完整的源代码，我们将
<Grid x:Name="LayoutRoot" Background="Transparent">
<Rectangle Stroke="Green"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
Margin="25" />
<Ellipse HorizontalAlignment="Left" VerticalAlignment="Top"
Stroke="Red"
Width="50" Height="50"/>
<Ellipse HorizontalAlignment="Left" VerticalAlignment="Bottom"
Stroke="Red"
Width="50" Height="50"/>
<Ellipse HorizontalAlignment="Right" VerticalAlignment="Top"
Stroke="Red"
Width="50" Height="50"/>
<Ellipse HorizontalAlignment="Right" VerticalAlignment="Bottom"
Stroke="Red"
Width="50" Height="50"/>
</Grid>
<Grid>
<Grid HorizontalAlignment="Center" VerticalAlignment="Center">
<Image Source="Assets/someImage.png" IsHitTestVisible="False" Opacity="0.3" ></Image>
<Image Name="imgSauce" Source="Assets/someImage.png" >
<Image.Clip>
<RectangleGeometry x:Name="clipRect" ></RectangleGeometry>
</Image.Clip>
</Image>
<Rectangle Name="rectTopLeft" Width="20" Height="20" Margin="-10" Fill="Yellow" HorizontalAlignment="Left" VerticalAlignment="Top" >
<Rectangle.RenderTransform>
<TranslateTransform></TranslateTransform>
</Rectangle.RenderTransform>
</Rectangle>
<Rectangle Name="rectTopRight" Width="20" Height="20" Margin="-10" Fill="Yellow" HorizontalAlignment="Right" VerticalAlignment="Top" >
<Rectangle.RenderTransform>
<TranslateTransform></TranslateTransform>
</Rectangle.RenderTransform>
</Rectangle>
<Rectangle Name="rectBotLeft" Width="20" Height="20" Margin="-10" Fill="Yellow" HorizontalAlignment="Left" VerticalAlignment="Bottom" >
<Rectangle.RenderTransform>
<TranslateTransform></TranslateTransform>
</Rectangle.RenderTransform>
</Rectangle>
<Rectangle Name="rectBotRight" Width="20" Height="20" Margin="-10" Fill="Yellow" HorizontalAlignment="Right" VerticalAlignment="Bottom" >
<Rectangle.RenderTransform>
<TranslateTransform></TranslateTransform>
</Rectangle.RenderTransform>
</Rectangle>
</Grid>
</Grid>
public partial class CropPage : Page
{
private Rectangle _draggedRect = null;
public CropPage()
{
InitializeComponent();
var rects = new Rectangle[] { rectTopRight, rectTopLeft, rectBotRight, rectBotLeft };
Point _dragOrigin =new Point();
double origLeftPerc= 0, origRightPerc = 0, origTopPerc = 0, origBotPerc = 0;
var setOrigin = new Action<Point>((p) => {
_dragOrigin = p;
origLeftPerc = this._clipLeftPerc;
origRightPerc = this._clipRightPerc;
origTopPerc = this._clipTopPerc;
origBotPerc = this._clipBotPerc;
});
foreach (var aRect in rects)
{
aRect.MouseLeftButtonDown += (s, e) => {
var r = (Rectangle)s;
_draggedRect = r;
setOrigin( e.GetPosition(this.imgSauce));
r.CaptureMouse();
};
aRect.MouseLeftButtonUp += (s, e) => {
_draggedRect = null;
};
aRect.MouseMove += (s, e) => {
if (_draggedRect != null) {
var pos = e.GetPosition(this.imgSauce);
if (s == this.rectTopLeft || s == this.rectTopRight) {
// Adjust top
_clipTopPerc = origTopPerc + (pos.Y - _dragOrigin.Y) / imgSauce.ActualHeight;
}
if (s == this.rectTopLeft || s == this.rectBotLeft) {
// Adjust Left
_clipLeftPerc = origLeftPerc + (pos.X - _dragOrigin.X) / imgSauce.ActualWidth;
}
if (s == this.rectBotLeft || s == this.rectBotRight) {
// Adjust bottom
_clipBotPerc = origBotPerc - (pos.Y - _dragOrigin.Y) / imgSauce.ActualHeight;
}
if (s == this.rectTopRight || s == this.rectBotRight) {
// Adjust Right
_clipRightPerc = origRightPerc - (pos.X - _dragOrigin.X) / imgSauce.ActualWidth;
}
this.updateClipAndTransforms();
}
};
}
var draggingImg = false;
imgSauce.MouseLeftButtonDown += (s, e) => {
setOrigin( e.GetPosition(this.imgSauce));
imgSauce.CaptureMouse();
draggingImg = true;
};
imgSauce.MouseLeftButtonUp += (s, e) => {
draggingImg = false;
};
imgSauce.MouseMove += (s, e) => {
if (draggingImg) {
var pos = e.GetPosition(this.imgSauce);
var xAdjust = (pos.X - _dragOrigin.X) / imgSauce.ActualWidth;
var yAdjust = (pos.Y - _dragOrigin.Y) / imgSauce.ActualHeight;
_clipLeftPerc = origLeftPerc + xAdjust;
_clipRightPerc = origRightPerc - xAdjust;
_clipTopPerc = origTopPerc + yAdjust;
_clipBotPerc = origBotPerc - yAdjust;
this.updateClipAndTransforms();
}
};
imgSauce.SizeChanged += (x,y) => {
this.updateClipAndTransforms();
};
this.updateClipAndTransforms();
}
private double _clipLeftPerc, _clipRightPerc, _clipTopPerc, _clipBotPerc = 0;
void updateClipAndTransforms()
{
// Check bounds
if (_clipLeftPerc + _clipRightPerc >= 1)
_clipLeftPerc = (1 - _clipRightPerc) - 0.04;
if (_clipTopPerc + _clipBotPerc >= 1)
_clipTopPerc = (1 - _clipBotPerc) - 0.04;
if (_clipLeftPerc < 0)
_clipLeftPerc = 0;
if (_clipRightPerc < 0)
_clipRightPerc = 0;
if (_clipBotPerc < 0)
_clipBotPerc = 0;
if (_clipTopPerc < 0)
_clipTopPerc = 0;
if (_clipLeftPerc >= 1)
_clipLeftPerc = 0.99;
if (_clipRightPerc >= 1)
_clipRightPerc = 0.99;
if (_clipBotPerc >= 1)
_clipBotPerc = 0.99;
if (_clipTopPerc >= 1)
_clipTopPerc = 0.99;
// Image Clip
var leftX = _clipLeftPerc * this.imgSauce.ActualWidth;
var topY = _clipTopPerc * this.imgSauce.ActualHeight;
clipRect.Rect = new Rect(leftX, topY, (1 -_clipRightPerc) * this.imgSauce.ActualWidth - leftX, (1 - _clipBotPerc) * this.imgSauce.ActualHeight - topY);
// Rectangle Transforms
((TranslateTransform)this.rectTopLeft.RenderTransform).X = clipRect.Rect.X;
((TranslateTransform)this.rectTopLeft.RenderTransform).Y = clipRect.Rect.Y;
((TranslateTransform)this.rectTopRight.RenderTransform).X = -_clipRightPerc * this.imgSauce.ActualWidth;
((TranslateTransform)this.rectTopRight.RenderTransform).Y = clipRect.Rect.Y;
((TranslateTransform)this.rectBotLeft.RenderTransform).X = clipRect.Rect.X;
((TranslateTransform)this.rectBotLeft.RenderTransform).Y = - _clipBotPerc * this.imgSauce.ActualHeight;
((TranslateTransform)this.rectBotRight.RenderTransform).X = -_clipRightPerc * this.imgSauce.ActualWidth;
((TranslateTransform)this.rectBotRight.RenderTransform).Y = -_clipBotPerc * this.imgSauce.ActualHeight;
}
}
为什么这个问题被标记为powershell？我已经编辑删除它，并添加了windows-phone-7标签…我已经更改了标签，它可能被错误地标记了！现在请回答我的问题，我也用图片解释了我的问题，以便更好地理解。请我已经修复了你的标签…请回答我的问题。请给出一个大概的想法，这是如何可能的。谢谢托尼·佩特里纳的回答。我已经做了这个自定义控件，但实际上不知道如何实现这样的机制，当我拖动矩形时，它会移动，当我想调整矩形的大小时，它应该通过从角圆按住并拖动来调整大小。请给我完整的硬代码，我知道你已经理解我的问题，所以你可以解决它。请写作不是小事，我也没有足够的时间。您需要使用操纵*事件来处理移动。处理这些事件并在屏幕上移动控件。