Windows Phone开发（21）：做一个简单的绘图板 .

其实我们今天要说的就是一个控件——InkPresenter，这个控件并不是十分强大，没办法和WPF中的InkCanvas相比，估计在实际开发中也很少可能会用到它，不过，我们还是来了解一下吧，毕竟用起来也不难。

 

使用该控件没有什么技术含量，注意一下以下几点就是了：

1、必须明确指定InkPresenter的宽度和高度，也就是不能使用自动值和Margin，不然不能收集墨迹，除非里面有子元素；

2、要收集墨迹，要设置Clip属性；

3、可以使用DrawingAttributes类设置墨迹的大小和颜色。

 

该控件不能像WPF那样自动实现收集墨迹的功能，也就是说只能是我们自己写代码了。

 

[html] view plain copy print ?

1. <Grid>  
2.     <InkPresenter x:Name="MyPresenter"   
3.                   HorizontalAlignment="Left"  
4.                   VerticalAlignment="Top"   
5.                   MouseLeftButtonDown="MyPresenter_MouseLeftButtonDown"  
6.                   LostMouseCapture="MyPresenter_LostMouseCapture"  
7.                   MouseMove="MyPresenter_MouseMove"  
8.                   Background="Transparent"  
9.                   Opacity="1" Width="480" Height="750" />  
10. </Grid>  

    <Grid>
        <InkPresenter x:Name="MyPresenter" 
                      HorizontalAlignment="Left"
                      VerticalAlignment="Top" 
                      MouseLeftButtonDown="MyPresenter_MouseLeftButtonDown"
                      LostMouseCapture="MyPresenter_LostMouseCapture"
                      MouseMove="MyPresenter_MouseMove"
                      Background="Transparent"
                      Opacity="1" Width="480" Height="750" />
    </Grid>

 

[csharp] view plain copy print ?

1. using System;  
2. using System.Collections.Generic;  
3. using System.Linq;  
4. using System.Net;  
5. using System.Windows;  
6. using System.Windows.Controls;  
7. using System.Windows.Documents;  
8. using System.Windows.Input;  
9. using System.Windows.Media;  
10. using System.Windows.Media.Animation;  
11. using System.Windows.Shapes;  
12. using Microsoft.Phone.Controls;  
13. // 引入以下命名空间。   
14. using System.Windows.Ink;  
15.   
16. namespace InkPresentSample  
17. {  
18.     public partial class MainPage : PhoneApplicationPage  
19.     {  
20.         Stroke CurrentStroke = null;  
21.         // 构造函数   
22.         public MainPage()  
23.         {  
24.             InitializeComponent();  
25.   
26.             // 设置剪辑，以便收集墨迹   
27.             RectangleGeometry rg = new RectangleGeometry();  
28.             // 为了使范围准确，应使用控件的最终呈现高度。   
29.             rg.Rect = new Rect(0, 0, MyPresenter.ActualWidth, MyPresenter.ActualHeight);  
30.             MyPresenter.Clip = rg;  
31.         }  
32.   
33.         private void MyPresenter_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)  
34.         {  
35.             // 当我们点击时获捉鼠标光标   
36.             MyPresenter.CaptureMouse();  
37.             // 收集当前的光标所在的位置的点   
38.             StylusPointCollection sc = new StylusPointCollection();  
39.             sc.Add(e.StylusDevice.GetStylusPoints(MyPresenter));  
40.             CurrentStroke = new Stroke(sc);  
41.             // 设置笔触的颜色，大小   
42.             CurrentStroke.DrawingAttributes.Color = Colors.Yellow;  
43.             CurrentStroke.DrawingAttributes.Width = 8;  
44.             CurrentStroke.DrawingAttributes.Height = 8;  
45.             // 把新的笔触添加到集合中   
46.             MyPresenter.Strokes.Add(CurrentStroke);  
47.         }  
48.   
49.         private void MyPresenter_LostMouseCapture(object sender, MouseEventArgs e)  
50.         {  
51.             // 当释放鼠标时，也同时释放笔触变量的引用   
52.             CurrentStroke = null;  
53.         }  
54.   
55.         private void MyPresenter_MouseMove(object sender, MouseEventArgs e)  
56.         {  
57.             if (CurrentStroke != null)  
58.             {  
59.                 // 每移动一次鼠标，都收集对应的点。   
60.                 CurrentStroke.StylusPoints.Add(e.StylusDevice.GetStylusPoints(MyPresenter));  
61.             }  
62.         }  
63.     }  
64. }  

using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
using Microsoft.Phone.Controls;
// 引入以下命名空间。
using System.Windows.Ink;

namespace InkPresentSample
{
    public partial class MainPage : PhoneApplicationPage
    {
        Stroke CurrentStroke = null;
        // 构造函数
        public MainPage()
        {
            InitializeComponent();

            // 设置剪辑，以便收集墨迹
            RectangleGeometry rg = new RectangleGeometry();
            // 为了使范围准确，应使用控件的最终呈现高度。
            rg.Rect = new Rect(0, 0, MyPresenter.ActualWidth, MyPresenter.ActualHeight);
            MyPresenter.Clip = rg;
        }

        private void MyPresenter_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
        {
            // 当我们点击时获捉鼠标光标
            MyPresenter.CaptureMouse();
            // 收集当前的光标所在的位置的点
            StylusPointCollection sc = new StylusPointCollection();
            sc.Add(e.StylusDevice.GetStylusPoints(MyPresenter));
            CurrentStroke = new Stroke(sc);
            // 设置笔触的颜色，大小
            CurrentStroke.DrawingAttributes.Color = Colors.Yellow;
            CurrentStroke.DrawingAttributes.Width = 8;
            CurrentStroke.DrawingAttributes.Height = 8;
            // 把新的笔触添加到集合中
            MyPresenter.Strokes.Add(CurrentStroke);
        }

        private void MyPresenter_LostMouseCapture(object sender, MouseEventArgs e)
        {
            // 当释放鼠标时，也同时释放笔触变量的引用
            CurrentStroke = null;
        }

        private void MyPresenter_MouseMove(object sender, MouseEventArgs e)
        {
            if (CurrentStroke != null)
            {
                // 每移动一次鼠标，都收集对应的点。
                CurrentStroke.StylusPoints.Add(e.StylusDevice.GetStylusPoints(MyPresenter));
            }
        }
    }
}