我创建了一个BezierSpline编辑器来制作自定义动画宽松函数。 用户将有可能添加beziercurve部件来创建他自己的缓动功能。wpf mvvm将贝塞尔曲线添加到画布
我有一个MainWindow和2个用户控件DesignerControl和InfoControl共享一个DesignerVM作为DataContext。
DesignerControl是使用可拖动的矩形查看和编辑样条线的主视图,InfoControl是用于创建,选择,删除带按钮和列表框的样条线部分以及使用文本块编辑控制点的视图。
DesignerVM包含一个SplineVM的ObservableCollection。
我在绑定到ObservableCollection的每个usercontrol中都有一个列表框。
我已经使用ItemsPanelTemplate将列表框更改为designerControl中的Canvas,现在我使用DataTemplate作为ListBox.ItemTemplate来更改名为SplineControl的usercontrol中的项目。
在这个SplineControl中,我有一个包含定义曲线的Path的固定大小的画布和4个用于定义控制点的Rectangle。
<UserControl x:Class="Easing_Spline_Tool.SplineControl"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:local="clr-namespace:Easing_Spline_Tool"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="300"
DataContext="SplineVM">
<UserControl.Resources>
<local:MathConverter x:Key="mathconverter"/>
</UserControl.Resources>
<Canvas Width="300" Height="300" x:Name="mycanvas" Background="Black">
<Path x:Name="curve" Stroke="#F02828" StrokeThickness="3">
<Path.Data>
<PathGeometry>
<PathGeometry.Figures>
<PathFigureCollection>
<PathFigure>
<PathFigure.Segments>
<PathSegmentCollection x:Name="pathsegment"/>
</PathFigure.Segments>
</PathFigure>
</PathFigureCollection>
</PathGeometry.Figures>
</PathGeometry>
</Path.Data>
</Path>
<Rectangle Fill="White" x:Name="curvePoint1" Width="8" Height="8" Canvas.Bottom="0" Canvas.Left="0"/>
<Rectangle Fill="White" x:Name="curvePoint2" Width="8" Height="8" RadiusX="4" RadiusY="4" Canvas.Bottom="0" Canvas.Left="{Binding ElementName=mycanvas, Path=ActualWidth, Converter={StaticResource mathconverter}, ConverterParameter=(@VALUE/4)}"/>
<Rectangle Fill="White" x:Name="curvePoint3" Width="8" Height="8" RadiusX="4" RadiusY="4" Canvas.Bottom="0" Canvas.Left="{Binding ElementName=mycanvas, Path=ActualWidth, Converter={StaticResource mathconverter}, ConverterParameter=(@VALUE/2)}"/>
<Rectangle Fill="White" x:Name="curvepoint4" Width="4" Height="4" Canvas.Bottom="0" Canvas.Left="{Binding ElementName=mycanvas, Path=ActualWidth, Converter={StaticResource mathconverter}, ConverterParameter=(@VALUE)}"/>
</Canvas>
</UserControl>
编辑: 我使用雷切尔Lim的MathConverter我的矩形中的绑定和他们的工作非常出色。
当我启动应用程序时,我的用户控件位于主窗口画布的右下角,应该位于左下角。我设置我的用户的垂直对齐和水平对齐方式下和左...
我也试图设置Canvas.Bottom和Canvas.Left对我的用户,但没有改变
我缺少的东西?
可以显示包含此UserControl的代码和路径的段数据吗? – Rachel