silverlight3 学习 3.1,绘图--举一反三(圆形,矩形) 简单实现

Home.xaml
<Grid x:Name="LayoutRoot" Background="AliceBlue" >
<Grid.RowDefinitions>
<RowDefinition Height="40"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<ScrollViewer x:Name="PageScrollViewer" Style="{StaticResource PageScrollViewerStyle}" Grid.Row="0">
<StackPanel x:Name="ContentStackPanel" Orientation="Horizontal" Height="20">
<TextBox x:Name="txtPoint" Width="120"></TextBox>
<Button Height="20" Width="50" Content="圆形" x:Name="btnEllipse" Click="btnEllipse_Click"></Button>
<Button Height="20" Width="50" Content="矩形" x:Name="btnRect" Click="btnRect_Click"></Button>
</StackPanel>
</ScrollViewer>
<InkPresenter x:Name="inkP" MouseLeave="inkP_MouseLeave" MouseLeftButtonUp="inkP_MouseLeftButtonUp" Grid.Row="1" Background="Black" MouseLeftButtonDown="inkP_MouseLeftButtonDown" MouseMove="inkP_MouseMove" >
</InkPresenter>
</Grid>
Home.xaml.cs
public partial class Home : Page
{
private Stroke MyStroke;
private Point p;
private bool _isStart = false;
private bool _isDrawEllipse = false;
private bool _isDrawRect = false;
public Home()
{
InitializeComponent();
}
// Executes when the user navigates to this page.
protected override void OnNavigatedTo(NavigationEventArgs e)
{
}
private void inkP_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
p.X = e.StylusDevice.GetStylusPoints(inkP)[0].X ;
p.Y = e.StylusDevice.GetStylusPoints(inkP)[0].Y ;
_isStart = !_isStart;
}
private void inkP_MouseMove(object sender, MouseEventArgs e)
{
if ( _isStart && _isDrawEllipse)
{
inkP.Children.Clear();
Ellipse ell = new Ellipse();
double width = e.StylusDevice.GetStylusPoints(inkP)[0].X - p.X;
if (width <= 0)
width = p.X - e.StylusDevice.GetStylusPoints(inkP)[0].X;
double height = e.StylusDevice.GetStylusPoints(inkP)[0].Y - p.Y;
if (height <= 0)
height = p.Y - e.StylusDevice.GetStylusPoints(inkP)[0].Y;
ell.Width = width;
ell.Height = height;
ell.Stroke = new SolidColorBrush(Colors.White);
InkPresenter.SetLeft(ell, p.X);
InkPresenter.SetTop(ell, p.Y);
inkP.Children.Add(ell);
txtPoint.Text = "" + e.StylusDevice.GetStylusPoints(inkP)[0].X + "," + e.StylusDevice.GetStylusPoints(inkP)[0].Y;
txtPoint.Text += "和" + ell.Width + "," + ell.Height;
}
if (_isStart && _isDrawRect)
{
inkP.Children.Clear();
Rectangle rect = new Rectangle();
rect.Stroke = new SolidColorBrush(Colors.White);
rect.Width = e.StylusDevice.GetStylusPoints(inkP)[0].X - p.X;
rect.Height = e.StylusDevice.GetStylusPoints(inkP)[0].Y - p.Y;
InkPresenter.SetLeft(rect, p.X);
InkPresenter.SetTop(rect, p.Y);
inkP.Children.Add(rect);
}
}
private void inkP_MouseLeftButtonUp(object sender, MouseButtonEventArgs e)
{
_isStart = !_isStart;
}
private void btnEllipse_Click(object sender, RoutedEventArgs e)
{
_isDrawEllipse = true;
_isDrawRect = false;
}
private void inkP_MouseLeave(object sender, MouseEventArgs e)
{
_isStart = false;
}
private void btnRect_Click(object sender, RoutedEventArgs e)
{
_isDrawRect = true;
_isDrawEllipse = false;
}
}
以下内容摘自MSDN:
Silverlight可用于绘制基本形状类:
Ellipse 绘制一个椭圆。
Line 在两个点之间绘制一条直线。
Path 绘制一系列相互连接的直线和曲线。直线和曲线维度通过 Data 属性声明,并且可以使用 Path 特定的 mini-language 或使用对象模型来指定。
Polygon 绘制一个多边形,它是形成闭合形状的一系列相互连接的直接。
Polyline 绘制一系列相互连接的直线。
Rectangle 绘制一个矩形形状,该形状可以具有笔画和填充。
Shape 为 Ellipse、Polygon 和 Rectangle 之类的形状元素提供基类。
Silverlight提供的绘图类,相对简单,容易掌握。

浙公网安备 33010602011771号