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提供的绘图类,相对简单,容易掌握。

posted @ 2010-10-21 12:30  base  阅读(830)  评论(0编辑  收藏  举报