Silverlight - как нарисовать линию с дугой? - PullRequest
Новая
       21

Silverlight - как нарисовать линию с дугой?

2 голосов
/ 04 апреля 2011

Я разрабатываю небольшое приложение silverlight (используя siverlight 4 и c #).В моем приложении мне нужно нарисовать координаты на основе их X, Y.Затем мне нужно нарисовать линии между некоторыми точками, основываясь на связях между ними.Поскольку может быть несколько линий, и я не могу, чтобы они все пересекались друг с другом (поскольку это превратит это в беспорядок), мне нужно нарисовать некоторые из моих линий с аркой.

Итак, что будетлучший способ решить эту проблему?

  • Создать свою собственную систему x, y - позиционировать элементы в точках и рисовать линии - Если да, то как я могу нарисовать линию с аркой?
  • Использовать готовый элемент управления, который предоставляет аналогичные возможности?Если да, то какой контроль?

Спасибо!

Прилагается небольшое изображение, иллюстрирующее мои потребности (я не большой художник, извините).

enter image description here

1 Ответ

2 голосов
/ 04 апреля 2011

Посмотрите на рисование кривых Безье ( MSDN Link ) и узнайте о различных типах геометрии ( MSDN Link )

Ниже приведен пример кода для полученияВы начали, что будет производить следующее изображение: Bezier Curve Sample

<Canvas x:Name="LayoutRoot" Background="White">
        <Path Stroke="Blue" StrokeThickness="2" >
            <Path.Data>
                <PathGeometry>
                    <PathGeometry.Figures>
                        <PathFigureCollection>
                            <PathFigure StartPoint="50,50">
                                <PathFigure.Segments>
                                    <PathSegmentCollection>
                                       <BezierSegment 
                                           Point1="50,20"
                                           Point2="120,170"
                                           Point3="350,150"
                                       /> 
                                    </PathSegmentCollection>
                                </PathFigure.Segments>
                            </PathFigure>
                        </PathFigureCollection>
                    </PathGeometry.Figures>
                </PathGeometry>
            </Path.Data>
        </Path>
        <Path Fill="Gold" Stroke="Black" StrokeThickness="1">
            <Path.Data>
                <EllipseGeometry Center="50,50" RadiusX="20" RadiusY="20" />
            </Path.Data>
        </Path>
        <Path Fill="Gold" Stroke="Black" StrokeThickness="1">
            <Path.Data>
                <EllipseGeometry Center="350,150" RadiusX="20" RadiusY="20" />
            </Path.Data>
        </Path>
    </Canvas>
...