Silverlight的绘图能力是有目共睹的,那Phone7上也一样不会差,以下就是其绘图控件。
一.InkPresenter:可以产生手写效果的控件。
XAML:
<InkPresenter Grid.Row="1" Height="512" HorizontalAlignment="Left" Margin="24,65,0,0" Name="inkPresenter1" VerticalAlignment="Top" Width="444" LostMouseCapture="inkPresenter1_LostMouseCapture" MouseLeftButtonDown="inkPresenter1_MouseLeftButtonDown" MouseMove="inkPresenter1_MouseMove" Background="White"/>
代码:
private void inkPresenter1_LostMouseCapture(object sender, MouseEventArgs e)
{
NewStroke = null;
}
private void inkPresenter1_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
inkPresenter1.CaptureMouse();
StylusPointCollection spc = new StylusPointCollection();
spc.Add(e.StylusDevice.GetStylusPoints(inkPresenter1));
NewStroke = new Stroke();
this.inkPresenter1.Strokes.Add(NewStroke);
}
private void inkPresenter1_MouseMove(object sender, MouseEventArgs e)
{
if (NewStroke != null)
NewStroke.StylusPoints.Add(e.StylusDevice.GetStylusPoints(inkPresenter1));
}
二.Path:路径控件通过Markup Syntax来绘制一系列的线条或通过Geometries来绘制形状,这个控件是图形控件中最复杂的。
Geometries:
<Path Grid.Row="1" Height="428" HorizontalAlignment="Left" Margin="12,127,0,0" Name="path1" Stroke="Red" StrokeThickness="10" VerticalAlignment="Top" Width="456" Fill="Green">
<Path.Data>
<EllipseGeometry Center="200,200" RadiusX="100" RadiusY="30"/>
</Path.Data>
</Path>
<Path Grid.Row="1" Height="428" HorizontalAlignment="Left" Margin="12,127,0,0" Name="path1" Stroke="Red" StrokeThickness="10" VerticalAlignment="Top" Width="456" Fill="Green">
<Path.Data>
<GeometryGroup FillRule="EvenOdd">
<EllipseGeometry Center="200,200" RadiusX="100" RadiusY="150"/>
<RectangleGeometry Rect="100,200,300,200"/>
</GeometryGroup>
</Path.Data>
</Path>
Mini-Language:
<Path Grid.Row="1" Height="428" HorizontalAlignment="Left" Margin="12,127,0,0" Name="path1" Stroke="Red" StrokeThickness="3" VerticalAlignment="Top" Width="456" Data="M 10,40 L 300,40 V 100 H 240 S 300,240 400,175"/>
移动命令:
M:绝对起始点
m:相对前一点的起始点
如:M 100,200
直线命令:
L/l:直线的结束点
如:L100,200
水平线命令:
H/h: x坐标
如:H20
垂线命令:
V/v: y坐标
如:V100
三次贝赛尔曲线命令:
C/c:控制点坐标、控制点坐标、结束点坐标
如:C 100,200 200,400 300,200
二次贝赛尔曲线命令:
Q/q:控制点坐标、结束点坐标
如:Q100,200 300,200
光滑三次贝赛尔曲线命令:
S/s:控制点坐标、结束点坐标
如:S 100,200 200,300
光滑二次贝赛尔曲线命令:
T/t:控制点、结束点
如:T 100,200 200,300
圆弧命令:
A/a:弧大小(半径值)、弧角、优势弧标记(1大于等于180度,0小于180度)、正负弧标记、结束点
如:A 5,5 0 0 0 10,10
闭合命令:
Z/z:将创建的曲线封闭。
三.Ellipse:用来绘制圆形、椭圆形的绘图控件。
<Ellipse Grid.Row="1" Height="200" HorizontalAlignment="Left" Margin="136,56,0,0" Name="ellipse1" Stroke="Red" StrokeThickness="2" VerticalAlignment="Top" Width="200" />
<Ellipse Grid.Row="1" Height="312" HorizontalAlignment="Left" Margin="136,283,0,0" Name="ellipse2" Stroke="Red" StrokeThickness="2" VerticalAlignment="Top" Width="200" />
四.Rectangle: 绘制矩形或圆角矩形的绘图控件,这个与border控件很相似,但是border是一个容器,可以包含其他控件,而rectangle只用于绘图,不能包含子控件。
<Rectangle Grid.Row="1" Height="154" HorizontalAlignment="Left" Margin="119,80,0,0" Name="rectangle1" Stroke="Red" StrokeThickness="1" VerticalAlignment="Top" Width="213" RadiusX="50" RadiusY="50"/>
<Rectangle Grid.Row="1" Height="184" HorizontalAlignment="Left" Margin="126,370,0,0" Name="rectangle2" Stroke="Red" StrokeThickness="1" VerticalAlignment="Top" Width="214" />
RadiusX/RadiusY:设置圆角大小。
五.Line: 用于绘制两点间的直线。
<Line X1="10" Y1="50" X2="350" Y2="50" Stroke="Red" StrokeThickness="5" Margin="36,144,23,324" Grid.Row="1" />
<Line X1="200" Y1="10" X2="200" Y2="300" Stroke="Blue" StrokeThickness="5" Margin="36,144,23,147" Grid.Row="1" />
六.Polygon: 多边形控件。绘制封闭图形。
<Polygon Grid.Row="1" Height="249" HorizontalAlignment="Left" Margin="104,95,0,0" Name="polygon1" Stroke="Red" StrokeThickness="5" VerticalAlignment="Top" Width="336" Points="10,10 200,25 300,175 200,200" Fill="blue"/>
Points:点数,控制边的数量。
七.Polyline:多段线控件。与多边形控件相似,可以绘制封闭、开放多边形。
<Polyline Grid.Row="1" Height="307" HorizontalAlignment="Left" Margin="36,131,0,0" Name="polyline1" Stroke="Red" StrokeThickness="15" VerticalAlignment="Top" Width="394" Points="50,25 0,100 100,200 150,250 270,150" />
八.Glyphs:符号控件。用于绘制字母、符号、字符等。主要用来显示Unicode字符。因为需要加载字体库或从网上下载字体库,就会引起显示慢的问题。
<Glyphs Grid.Row="1" HorizontalAlignment="Left" Margin="36,34,0,0" Name="glyphs1" VerticalAlignment="Top" Height="474" Width="407"
FontUri="msyhbd.ttf"
FontRenderingEmSize="100"
Fill="Red"
StyleSimulations="BoldItalicSimulation"
OriginX="20"
OriginY="200"
UnicodeString="中国" />
FontUri:指定文字格式路径,也可以是Web URL。
FontRenderingEmSize:指定以绘图图面单位计量的字号(默认为 .96 英寸)。
StyleSimulations:设置字体粗体、斜体字形。