在Silverlight2Beta2中实现手写功能

想象一下我们在纸上写字的过程&＃xff0c;我们需要一张纸和一只笔&＃xff0c;然后我们下笔开始写第一字的头一个笔画&＃xff0c;运笔的过程中我们可以根据力度来控制笔画线条的轻重&＃xff0c;最后收笔。然后写下一个笔画......。

在Silverlight2中这张纸就是InkPresenter控件&＃xff0c;InkPresenter控件作为一组笔画(Stroke)的容器用来现实墨迹&＃xff0c;Ink 引用的是笔、触摸屏和鼠标输入的笔迹或者画的内容。Silverlight 中的 Ink 由StrokeCollection对象构成&＃xff0c;StrokeCollection对象由不同的Stroke对象组成。每个Stroke对应一个笔的按下、移动和抬起序列。Stroke可以是一个点、一条直线甚至一条曲线。每个Stroke 由一个 StylusPointCollection对象组成&＃xff0c;它又有不同的StylusPoint组成。当笔与数字转换器接触并移动的时候&＃xff0c;StylusPoint 对象是一个集合。我们可以通过该对象的DrawingAttributes属性来设置颜色&＃xff0c;宽度&＃xff0c;轮廓颜色等。

下图说明InkPresenter的结构&＃xff1a;

SLMan1

InkPresenter不支持在该控件内来使用Stroke&＃xff0c;StrokeCollection标记。你只能通过编程的方式来控制。下面就来简单实现一个例子来说明。InkPresenter控件中比较关键的事件为MouseLeftButtonDown&＃xff0c;MouseMove&＃xff0c;MouseLeftButtonUp&＃xff0c;当InkPresenter接收到MouseLeftButtonDown事件&＃xff0c;你需要创建一个新的Stroke在内存中&＃xff0c;并且将其加入到StrokeCollection中&＃xff0c;当MouseMove的时候我们将StylusPoints到Stroke中。MouseLeftButtonUp事件中结束Stroke。我们创建一个Silverlight项目&＃xff0c;在page.xaml中添加如下代码&＃xff1a;

<UserControl x:Class&＃61;"SilverlightApplication2.Page"
    xmlns&＃61;"http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x&＃61;"http://schemas.microsoft.com/winfx/2006/xaml"
    Width&＃61;"400" Height&＃61;"300">
    <Grid x:Name&＃61;"LayoutRoot" Background&＃61;"White">
        <Rectangle x:Name&＃61;"inkBorder" Width&＃61;"346" Height&＃61;"234" Stroke&＃61;"#FF000000"
         Canvas.Top&＃61;"25" Canvas.Left&＃61;"25" RadiusX&＃61;"25" RadiusY&＃61;"25"/>
        <InkPresenter x:Name&＃61;"inkP" Width&＃61;"344" Height&＃61;"232" Canvas.Left&＃61;"25" Canvas.Top&＃61;"34"
         MouseLeftButtonDown&＃61;"inkP_MouseLeftButtonDown" MouseLeftButtonUp&＃61;"inkP_MouseLeftButtonUp"
         MouseMove&＃61;"inkP_MouseMove" Background&＃61;"LightBlue">
        InkPresenter>
    Grid>
UserControl>

在page.xaml.cs中添加鼠标MouseLeftButtonDown&＃xff0c;MouseMove&＃xff0c;MouseLeftButtonUp的事件处理程序来实现手写功能代码如下&＃xff1a;

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 System.IO;

namespace SilverlightApplication2
{
    public partial class Page : UserControl { public Page()
        {
            InitializeComponent();
        }

        System.Windows.Ink.Stroke newStroke;

        void inkP_MouseLeftButtonDown(object sender, MouseEventArgs e)
        {
            inkP.CaptureMouse();
            newStroke &＃61; new System.Windows.Ink.Stroke();
            newStroke.DrawingAttributes.Color &＃61; Colors.Red;
            newStroke.DrawingAttributes.OutlineColor &＃61; Colors.Yellow;

            newStroke.StylusPoints.Add(e.StylusDevice.GetStylusPoints(inkP));
            inkP.Strokes.Add(newStroke);
        }
        void inkP_MouseMove(object sender, MouseEventArgs e)
        {
            if (newStroke !&＃61; null)
            {
                newStroke.StylusPoints.Add(e.StylusDevice.GetStylusPoints(inkP));
            }
        }
        void inkP_MouseLeftButtonUp(object sender, MouseEventArgs e)
        {
            newStroke &＃61; null;
            inkP.ReleaseMouseCapture();
        }
    }
}

1.下面代码用来设置笔画颜色和轮廓颜色&＃xff1a;