在WPF中绘制直线和圆 [英] Draw lines and circles in WPF

问题描述

我需要绘制一个类似于公交车站模式的图形： o-School ---- o-Church ------- o-Police 。

因此，简单的直线和圆圈。我还需要缩放它。

I need to draw a graph like bus station schema: o-School----o-Church-------o-Police.
So, simple line and circles. Also I need to zoom it.

在我使用VS 2010时，我认为WPF（据我所知，它使用矢量化图形）应该是开始绘制的好画布。

As I have VS 2010, I thought WPF(as I understood it uses vectorized graphics) should be the good canvas to start drawing.

对WPF初学者来说，这可能，很复杂吗？

Is it possible, complicated, and what do you recommend for a WPF beginner.

谢谢。

编辑：
我可以为该行（短划线，dotDot ...）设置 DashStyle 吗？

推荐答案

以下内容可以帮助您入门。它具有包含一些形状的画布，以及允许您控制缩放的滑块控件。您可以根据需要在画布中添加其他元素。

Here's something that could help you get started. It has a Canvas containing a few shapes, and a Slider control that allows you to control zooming. You can just add other elements inside the Canvas as required.

<DockPanel>
    <Slider x:Name="slider" Minimum=".1" Maximum="10" Value="1" DockPanel.Dock="Top"/>
    <ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto">
        <Border BorderBrush="Black" BorderThickness="1" HorizontalAlignment="Center" VerticalAlignment="Center">
            <Canvas Width="300" Height="300">
                <Canvas.LayoutTransform>
                    <ScaleTransform ScaleX="{Binding ElementName=slider, Path=Value}"
                                ScaleY="{Binding ElementName=slider, Path=Value}"/>
                </Canvas.LayoutTransform>

                <Ellipse Canvas.Left="10" Canvas.Top="10" Width="20" Height="20"
                        Stroke="Black" StrokeThickness="1" Fill="Red"/>
                <Line Canvas.Left="20" Canvas.Top="30" X1="0" X2="0" Y1="0" Y2="50" 
                    Stroke="Black" StrokeThickness="1"/>
                <Ellipse Canvas.Left="10" Canvas.Top="80" Width="20" Height="20"
                        Stroke="Black" StrokeThickness="1" Fill="Yellow"/>
            </Canvas>
        </Border>
    </ScrollViewer>
</DockPanel>

编辑：

要更改线条的破折号样式，只需设置StrokeDashArray属性。它允许您指定线条的样式。它遵循段长度，间隙长度，段长度，间隙长度...的格式，因此设置此行：

To change the dash style for the line, simply set the StrokeDashArray property. It allows you to specify the pattern for how your line looks like. It follows a "segment length, gap length, segment length, gap length..." format, so setting this line:

<Line Canvas.Left="100" Canvas.Top="100" Stroke="Black"
                          X1="0" X2="100" Y1="0" Y2="0"
                          StrokeThickness="3" StrokeDashArray="2,2"/>

为您提供了这一点（即，由一系列长度为2的段组成的线，然后是长度为2的空格）：

gives you this (i.e. a line made up of a series of segments with a length of 2 followed by gaps with a length of 2):

将StrokeDashArray设置为

Setting the StrokeDashArray to

StrokeDashArray="5,1,1,1"

为您提供点划线模式。

这篇关于在WPF中绘制直线和圆的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！