WPF provides a number of ready-to-use Shape objects. All shape objects inherit from the Shape class. Available shape objects include Ellipse, Line, Path, Polygon, Polyline, and Rectangle. Shape objects share the following common properties.
Stroke : Describes how the shape’s outline is painted.
StrokeThickness : Describes the thickness of the shape’s outline.
Fill : Describes how the interior of the shape is painted.
in this article we learn that how to draw various type of line shape.
The Line class enables you to draw a line between two points. The following example shows several ways to specify line coordinates and stroke properties.
Draws a diagonal line
<Window x:Class="MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="wpfEllipse" Width="300" Height="300"> <Canvas Height="200" Width="250"> <Line X1="50" Y1="50" X2="200" Y2="100" Stroke="Black" StrokeThickness="4" /> </Canvas> </Window>
above code produce this result:
Draws a diagonal line with gradient effect
<Window x:Class="MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="Line in WPF" Width="292" Height="182"> <Canvas Height="150" Width="250"> <Line X1="10" Y1="10" X2="100" Y2="150" StrokeThickness="4" Canvas.Left="100"> <Line.Stroke> <RadialGradientBrush GradientOrigin="0.5,0.5" Center="0.5,0.5" RadiusX="0.5" RadiusY="0.5"> <RadialGradientBrush.GradientStops> <GradientStop Color="Red" Offset="0" /> <GradientStop Color="green" Offset="0.75" /> </RadialGradientBrush.GradientStops> </RadialGradientBrush> </Line.Stroke> </Line> </Canvas> </Window>
above code produce this result:
Draws a horizontal line
you can draw horizantal line in xaml with same Y1and Y2 points.
<Window x:Class="MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="Line in WPF" Width="292" Height="182"> <Canvas Height="150" Width="250"> <Line X1="10" Y1="60" X2="240" Y2="60" Stroke="Black" StrokeThickness="4"/> </Canvas> </Window>
above code produce this result:
Draws a vertical line
you can draw vertical line in xaml with same X1 and X2 points.
<Window x:Class="MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="Line in WPF" Width="292" Height="182"> <Canvas Height="146" Width="98"> <Line X1="50" Y1="10" X2="50" Y2="140" Stroke="Black" StrokeThickness="4"/> </Canvas> </Window>
above code produce this result:
Thanks this helped!
Thanks
I was wondering if any one can help me to answer this question?
for example for the table below I can draw 2 curves : one for x , one for y but my question is that if the figures change(2.4 changes to 3) how automatically it can be updated and draw the curves ?
x y
6 2.4 6.5
7 1.4 4.3
8 3.6 1.3
9 2.5 3.5