WPF Graphics: Draw some lines using pure XAML

This entry is part 2 of 8 in the series WPF Graphics

I just realised that it is possible to draw lines using pure XAML.  No code-behind is needed.

This example is taken from Microsoft site.

MainWindow.xaml:

<Window x:Class="WpfApplication8.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApplication8"
        mc:Ignorable="d"
        Title="MainWindow" Height="350" Width="525">

    <Canvas Height="300" Width="300">

        <!-- Draws a diagonal line from (10,10) to (50,50). -->
        <Line
    X1="10" Y1="10"
    X2="250" Y2="250"
    Stroke="Black"
    StrokeThickness="4" />

        <!-- Draws a diagonal line from (10,10) to (50,50)
       and moves it 100 pixels to the right. -->
        <Line
    X1="10" Y1="10"
    X2="280" Y2="280"
    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="Blue" Offset="0.25" />
                    </RadialGradientBrush.GradientStops>
                </RadialGradientBrush>
            </Line.Stroke>
        </Line>

        <!-- Draws a horizontal line from (10,60) to (150,60). -->
        <Line
     X1="10" Y1="60"
     X2="350" Y2="60"
     Stroke="Black"
     StrokeThickness="4"/>

    </Canvas>

</Window>

MainWindow.xaml.cs:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace WpfApplication8
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }
    }
}

xamlline

Series Navigation<< WPF Graphics: Drawing a line
WPF Graphics: Draw an ellipse using pure XAML >>