vs2010 学习Silverlight学习笔记(21):基本图形

概要：

       图形基础知识，需要记牢。

内容：

       基本图形有：Line、Ellipse、Rectangle、Path、Polygon、Polyline

    重要属性有：Stroke：对边框线填充

StrokeThickness：边框线的宽度

Fill： 对图形进行填充

线Line：

       <LineX1="10" Y1="10" X2="40" Y2="40"

               Stroke="Red"StrokeThickness="4"></Line>

       <Line X1="20" Y1="10" X2="100"Y2="100"

              StrokeThickness="6">

           <Line.Stroke>

                <LinearGradientBrush>

                    <GradientStopColor="Red" Offset="0.0"></GradientStop>

                    <GradientStopColor="Black"  Offset="1.1"></GradientStop>

                </LinearGradientBrush>

           </Line.Stroke>

       </Line>

圆Ellipse：

              <EllipseCanvas.Top="20" Canvas.Left="40"

            Width="160" Height="80" Fill="#FF9900"

            Stroke="Black" StrokeThickness="3">

       </Ellipse>

 

       <Ellipse Canvas.Top="20" Canvas.Left="260"

            Width="180" Height="100">

           <Ellipse.Fill>

                <RadialGradientBrushGradientOrigin="0.5,0.5" Center="0.5,0.5"

                RadiusX="0.5"RadiusY="0.5">

                    <GradientStopColor="#0099FF" Offset="0" />

                    <GradientStopColor="#FF0000" Offset="0.25" />

                    <GradientStopColor="#FCF903" Offset="0.75" />

                    <GradientStopColor="#3E9B01" Offset="1" />

                </RadialGradientBrush>

           </Ellipse.Fill>

       </Ellipse>

矩形Rectangle：

              <RectangleCanvas.Top="20" Canvas.Left="40"

        Width="160" Height="80" Fill="#FF9900"

        Stroke="Black" StrokeThickness="3">

       </Rectangle>

 

       <Rectangle Canvas.Top="20" Canvas.Left="260"

        Width="180" Height="100">

           <Rectangle.Fill>

                <RadialGradientBrushGradientOrigin="0.5,0.5" Center="0.5,0.5"

           RadiusX="0.5" RadiusY="0.5">

                    <GradientStopColor="#0099FF" Offset="0" />

                    <GradientStop Color="#FF0000"Offset="0.25" />

                    <GradientStopColor="#FCF903" Offset="0.75" />

                    <GradientStopColor="#3E9B01" Offset="1" />

                </RadialGradientBrush>

           </Rectangle.Fill>

       </Rectangle>

 

        <Rectangle Canvas.Top="120"Canvas.Left="120"

        Width="100" Height="100"

        Stroke="#000000" StrokeThickness="2"RadiusX="15" RadiusY="15">

           <Rectangle.Fill>

                <LinearGradientBrushStartPoint="0,1">

                    <GradientStop Color="#FFFFFF"Offset="0.0" />

                    <GradientStopColor="#FF9900" Offset="1.0" />

                </LinearGradientBrush>

           </Rectangle.Fill>

       </Rectangle>

轨迹Path：

              <PathStroke="Orange" StrokeThickness="3"

         Data="M 10, 40 L 300,40 V 100 H 240 S 300,240 400,175">

       </Path>

“迷你语言”的属性句法，来描述如何画出轨迹形状，包括M（移动命令，起 始点）、L（直线，结束点）、H（水平线）、V（垂直线）、C（三次贝塞尔曲线）、Q（两次贝塞尔曲线）、A（椭圆弧曲线）、Z（结束命令）等

多边形Polygon:

              <PolygonCanvas.Left="50" Canvas.Top="50"

            Points="50,20 300,20 300,160 200,160"

            Stroke="Green" StrokeThickness="3"Fill="Orange">

       </Polygon>

多边线Polyline:

<Polyline Canvas.Left="50" Canvas.Top="50"

            Points="50,20 300,20 300,160 200,160"

            Stroke="Green" StrokeThickness="3"Fill="Orange">

       </Polyline>