WPF Polygon rotatetransform 旋转移动方向
WPF Polygon rotatetransform rotates moving direction
所以我在 WPF 中构建这个应用程序,我在其中用箭头画了一条线。箭头是在资源字典中创建的多边形,如下所示:
<!-- This is the arrowhead of the wire -->
<Polygon x:Name="PART_arrow"
Points="{Binding Path=ArrowPathData}" IsHitTestVisible="True"
Stroke="{TemplateBinding Stroke}" StrokeThickness="{TemplateBinding InnerWireStrokeThickness}"
Fill="White" RenderTransformOrigin="0,0.5" RenderTransform="{Binding ArrowRotation}">
</Polygon>
在视图模型中,我正在创建带有点集合的箭头,其位置取决于线的最后一个关节的位置。最后箭头需要根据线的角度旋转,但这是为了以后。在这一刻,箭头可视化并跟随线条的最后一个关节。这仅在箭头的旋转为 0 时有效。当我更改旋转时,箭头的移动也会发生变化。所以例如当我将旋转设置为 90 度时。箭头旋转 90 度,但是当我将线向左移动时,箭头移动到顶部。我试图将 RenderTransform setter 更改为 LayoutTransform。我使用 Polygon.Rendertransform 并硬编码了一个角度。但没有任何效果。
public PointCollection ArrowPathData
{
get
{
PointCollection arrow = new PointCollection();
if(isArrowSelected)
arrow = PointCollection.Parse("0,0 3,5 0,0 -3,5");
else if (isWindowSelected)
arrow = PointCollection.Parse("0,0 5,10 0,20 -5,10");
else if (isRoofSelected)
arrow = PointCollection.Parse("0,0 5,10 -5,10");
IEnumerable<WireJoint> joints = Joints;
if (joints.Count<WireJoint>() > 0)
{
WireJoint lastJoint = joints.Last();
if (lastJoint != null)
{
for (int i = 0; i < arrow.Count; i++)
{
arrow[i] = new Point(lastJoint.Point.X + arrow[i].X - Offset.X, lastJoint.Point.Y + arrow[i].Y - Offset.Y);
}
}
return arrow;
}
else
return new PointCollection();
}
}
public RotateTransform ArrowRotation
{
get
{
return new RotateTransform(45) ;
}
}
谁能帮我解决这个问题?
编辑:在代码中添加了额外的箭头
您可能想要使用绑定转换器,它根据折线的最后两个点创建转换后的几何体:
public class ArrowHeadConverter : IValueConverter
{
public object Convert(
object value, Type targetType, object parameter, CultureInfo culture)
{
Geometry geometry = null;
var points = value as IList<Point>;
if (points != null && points.Count >= 2)
{
geometry = Geometry.Parse("M0,0 L5,10 -5,10Z").Clone();
var lastPoint = points[points.Count - 1];
var lastSegment = lastPoint - points[points.Count - 2];
var angle = Vector.AngleBetween(new Vector(0, -1), lastSegment);
var transform = Matrix.Identity;
transform.Rotate(angle);
transform.Translate(lastPoint.X, lastPoint.Y);
geometry.Transform = new MatrixTransform(transform);
}
return geometry;
}
public object ConvertBack(
object value, Type targetType, object parameter, CultureInfo culture)
{
throw new NotSupportedException();
}
}
您可以像这个简单示例中那样使用转换器:
<Canvas>
<Canvas.Resources>
<local:ArrowHeadConverter x:Key="ArrowHeadConverter"/>
</Canvas.Resources>
<Polyline x:Name="polyline" Stroke="Black" StrokeThickness="2"
Points="10,10 50,20 70,40 80,60"/>
<Path Fill="White" Stroke="Black" StrokeThickness="2"
Data="{Binding Points, ElementName=polyline,
Converter={StaticResource ArrowHeadConverter}}"/>
</Canvas>
所以我在 WPF 中构建这个应用程序,我在其中用箭头画了一条线。箭头是在资源字典中创建的多边形,如下所示:
<!-- This is the arrowhead of the wire -->
<Polygon x:Name="PART_arrow"
Points="{Binding Path=ArrowPathData}" IsHitTestVisible="True"
Stroke="{TemplateBinding Stroke}" StrokeThickness="{TemplateBinding InnerWireStrokeThickness}"
Fill="White" RenderTransformOrigin="0,0.5" RenderTransform="{Binding ArrowRotation}">
</Polygon>
在视图模型中,我正在创建带有点集合的箭头,其位置取决于线的最后一个关节的位置。最后箭头需要根据线的角度旋转,但这是为了以后。在这一刻,箭头可视化并跟随线条的最后一个关节。这仅在箭头的旋转为 0 时有效。当我更改旋转时,箭头的移动也会发生变化。所以例如当我将旋转设置为 90 度时。箭头旋转 90 度,但是当我将线向左移动时,箭头移动到顶部。我试图将 RenderTransform setter 更改为 LayoutTransform。我使用 Polygon.Rendertransform 并硬编码了一个角度。但没有任何效果。
public PointCollection ArrowPathData
{
get
{
PointCollection arrow = new PointCollection();
if(isArrowSelected)
arrow = PointCollection.Parse("0,0 3,5 0,0 -3,5");
else if (isWindowSelected)
arrow = PointCollection.Parse("0,0 5,10 0,20 -5,10");
else if (isRoofSelected)
arrow = PointCollection.Parse("0,0 5,10 -5,10");
IEnumerable<WireJoint> joints = Joints;
if (joints.Count<WireJoint>() > 0)
{
WireJoint lastJoint = joints.Last();
if (lastJoint != null)
{
for (int i = 0; i < arrow.Count; i++)
{
arrow[i] = new Point(lastJoint.Point.X + arrow[i].X - Offset.X, lastJoint.Point.Y + arrow[i].Y - Offset.Y);
}
}
return arrow;
}
else
return new PointCollection();
}
}
public RotateTransform ArrowRotation
{
get
{
return new RotateTransform(45) ;
}
}
谁能帮我解决这个问题?
编辑:在代码中添加了额外的箭头
您可能想要使用绑定转换器,它根据折线的最后两个点创建转换后的几何体:
public class ArrowHeadConverter : IValueConverter
{
public object Convert(
object value, Type targetType, object parameter, CultureInfo culture)
{
Geometry geometry = null;
var points = value as IList<Point>;
if (points != null && points.Count >= 2)
{
geometry = Geometry.Parse("M0,0 L5,10 -5,10Z").Clone();
var lastPoint = points[points.Count - 1];
var lastSegment = lastPoint - points[points.Count - 2];
var angle = Vector.AngleBetween(new Vector(0, -1), lastSegment);
var transform = Matrix.Identity;
transform.Rotate(angle);
transform.Translate(lastPoint.X, lastPoint.Y);
geometry.Transform = new MatrixTransform(transform);
}
return geometry;
}
public object ConvertBack(
object value, Type targetType, object parameter, CultureInfo culture)
{
throw new NotSupportedException();
}
}
您可以像这个简单示例中那样使用转换器:
<Canvas>
<Canvas.Resources>
<local:ArrowHeadConverter x:Key="ArrowHeadConverter"/>
</Canvas.Resources>
<Polyline x:Name="polyline" Stroke="Black" StrokeThickness="2"
Points="10,10 50,20 70,40 80,60"/>
<Path Fill="White" Stroke="Black" StrokeThickness="2"
Data="{Binding Points, ElementName=polyline,
Converter={StaticResource ArrowHeadConverter}}"/>
</Canvas>