Draw a Grid : Line « Shapes « Silverlight






Draw a Grid

  
<UserControl x:Class='SilverlightApplication3.MainPage'
    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' 
    mc:Ignorable='d' 
    d:DesignWidth='640' 
    d:DesignHeight='480'>
    <UserControl.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>
    </UserControl.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" />


</UserControl>

   
    
  








Related examples in the same category

1.Draws a line from (10,10) to (50,50)Draws a line from (10,10) to (50,50)
2.Draws a diagonal line from (10,10) to (50,50) and moves it 100 pixels to the rightDraws a diagonal line from (10,10) to (50,50) and moves it 100 pixels to the right
3.Diagonal linear gradient - multiple colorsDiagonal linear gradient - multiple colors
4.Diagonal linear gradient multiple colors 2Diagonal linear gradient multiple colors 2
5.Diagonal linear gradient with 0.5 Offset for WhiteDiagonal linear gradient with 0.5 Offset for White
6.Vertical linear gradientVertical linear gradient
7.Vertical LineVertical Line
8.Horizontal LineHorizontal Line