我創建了一個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