Question

我正在使用silverlight在asp.net中使用流程图类型的应用程序..我是Silvelight的初学者，使用代码隐藏中的SHAPE和LINE对象动态创建元素（Rectangle，Ellipse，Line ..）

这些形状将动态生成，这意味着我将在后端调用Web服务来确定需要创建多少个对象/形状。确定后，我需要将对象/形状连接在一起。

如何将动态创建的形状与Silverlight中的一行连接，如流程图。

我阅读了下面的文章，但它不适用于我，realHeight＆amp; actualWidth of shapes值为0。 Connecting two shapes together, Silverlight 2

这是我的 MainPage.xaml

<UserControl x:Class="LightTest1.MainPage">

<Canvas x:Name="LayoutRoot" Background="White">
    <Canvas x:Name="MyCanvas" Background="Red"></Canvas>
    <Button x:Name="btnPush" Content="AddRectangle" Height="20" Width="80" Margin="12,268,348,12" Click="btnPush_Click"></Button>               
</Canvas>

MainPage.xaml.cs

后面的代码

    StackPanel sp1 = new StackPanel();

    public MainPage()
    {
        InitializeComponent();
        sp1.Orientation = Orientation.Vertical;
        MyCanvas.Children.Add(sp1);
    }

    Rectangle rect1;
    Rectangle rect2;
    Line line1;

    private void btnPush_Click(object sender, RoutedEventArgs e)
    {
        rect1 = new Rectangle()
        {
            Height = 30,
            Width = 30,
            StrokeThickness = 3,
            Stroke = new SolidColorBrush(Colors.Red),
        };
        sp1.Children.Add(rect1);           

        rect2 = new Rectangle()
        {
            Height = 30,
            Width = 30,
            StrokeThickness = 3,
            Stroke = new SolidColorBrush(Colors.Red),
        };
        sp1.Children.Add(rect2);

        connectShapes(rect1, rect2);
    }

    private void connectShapes(Shape s1, Shape s2)
    {
        var transform1 = s1.TransformToVisual(s1.Parent as UIElement);
        var transform2 = s2.TransformToVisual(s2.Parent as UIElement);

        var lineGeometry = new LineGeometry()
          {
              StartPoint = transform1.Transform(new Point(1, s1.ActualHeight / 2.0)),
              EndPoint = transform2.Transform(new Point(s2.ActualWidth, s2.ActualHeight / 2.0))
          }; 

        var path = new Path()
        {
            Data = lineGeometry,
            Stroke = new SolidColorBrush(Colors.Green),
        };
        sp1.Children.Add(path);          
    }

我在按钮点击事件中所做的只是添加两个矩形形状并将它们与一条线连接（如流程图）。请告诉我的代码有什么问题..

Answer 1

尝试替换

行

    connectShapes(rect1, rect2);

与

    Dispatcher.BeginInvoke(() => connectShapes(rect1, rect2));

我不确定其工作原理的确切原因，但我相信只有在控件传递出代码后才会呈现形状，只有在渲染完成后才会执行ActualWidth和{{1} }属性有一个有用的值。呼叫ActualHeight会在短时间内调用您的代码;实际上，您可能会注意到在矩形后面稍微绘制的线条。

Dispatcher.BeginInvoke方法的行为与TransformToVisual和ActualWidth属性的行为方式大致相同。如果尚未渲染形状，它将返回标识转换。即使你的线条被绘制成具有明确的宽度和高度，它们最终也会在左上角全部绘制在一起。

我还发现我需要将线条添加到Canvas，而不是StackPanel，以便在矩形上绘制它们。否则StackPanel会很快填满上面有很多空间的线条。

使用silverlight中的线形连接两个动态创建的形状

1 个答案: