Draw a Grid : Line « Windows Presentation Foundation « C# / CSharp Tutorial

1. C# / CSharp Tutorial
2. Windows Presentation Foundation
3. Line

<Canvas xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <Canvas.Resources>
        <Style x:Key="base" TargetType="Line">
            <Setter Property="Stroke" Value="Blue" />
        </Style>

        <Style x:Key="horz" TargetType="Line"
               BasedOn="{StaticResource base}">
            <Setter Property="X1" Value="100" />
            <Setter Property="X2" Value="300" />
            <Setter Property="Y2" Value="{Binding RelativeSource={RelativeSource self}, Path=Y1}" />
        </Style>

        <Style x:Key="vert" TargetType="Line" BasedOn="{StaticResource base}">
            <Setter Property="Y1" Value="100" />
            <Setter Property="Y2" Value="300" />
            <Setter Property="X2" Value="{Binding RelativeSource={RelativeSource self}, Path=X1}" />
        </Style>
    </Canvas.Resources>

    <Line Style="{StaticResource horz}" Y1="100" />
    <Line Style="{StaticResource horz}" Y1="125" />
    <Line Style="{StaticResource horz}" Y1="150" />
    <Line Style="{StaticResource horz}" Y1="175" />
    <Line Style="{StaticResource horz}" Y1="200" />
    <Line Style="{StaticResource horz}" Y1="225" />
    <Line Style="{StaticResource horz}" Y1="250" />
    <Line Style="{StaticResource horz}" Y1="275" />
    <Line Style="{StaticResource horz}" Y1="300" />

    <Line Style="{StaticResource vert}" X1="100" />
    <Line Style="{StaticResource vert}" X1="125" />
    <Line Style="{StaticResource vert}" X1="150" />
    <Line Style="{StaticResource vert}" X1="175" />
    <Line Style="{StaticResource vert}" X1="200" />
    <Line Style="{StaticResource vert}" X1="225" />
    <Line Style="{StaticResource vert}" X1="250" />
    <Line Style="{StaticResource vert}" X1="275" />
    <Line Style="{StaticResource vert}" X1="300" />
</Canvas>

24.84.Line
	24.84.1.	Create a line with point value
	24.84.2.	Set Top and left dimension based on its container
	24.84.3.	Origin in center. Y increases going down
	24.84.4.	Draws a line from (10,10) to (50,50)
	24.84.5.	Draws a diagonal line from (10,10) to (50,50) and moves it 100 pixels to the right
	24.84.6.	Draw a Grid
	24.84.7.	Creating Lines