Windows Phone 7: 使用FrameReported做一個簡單的繪圖程式

一個簡單的WP7繪圖程式，支援多點觸控，也就是不同觸控線路和同一次觸控的多個觸控點都會有不同的顏色。

 

準備工作很簡單，介面上就一個叫”inkPresenter”的InkPresenter控制項：

<InkPresenter Name="inkPresenter" />

 

後台代碼另外需要一個隨機產生顏色的方法，如下：

static Random random = new Random();

Color GetRandomColor()

{

    return Color.FromArgb(255, (byte)random.Next(256), (byte)random.Next(256), (byte)random.Next(256));

}

 

 

接下來就是使用Touch.FrameReported事件來完成程式邏輯。

 

Touch類型在System.Windows.Input命名空間下。使用這種方法，觸控點接觸的任何控制項會分散被接受，一切以原始觸控為中心，而不是像Manipulation事件那樣被分配到控制項內，不過幸好我們的樣本全是圍繞著InkPresenter的，不會發生上述問題。我們需要用一個字典儲存當前所有進行觸控的Stroke，字典的鍵是TouchDevice.Id屬性，這樣當觸控進行時，通過TouchDevice.Id識別當前Stroke然後再加入相應的StylusPoint到Stoke中，等一個觸控點完成後，把Stroke從字典中移除出去。

 

完整代碼：

//+ using System.Windows.Ink;

 

//建構函式

public MainPage()

{

    InitializeComponent();

    Touch.FrameReported += new TouchFrameEventHandler(Touch_FrameReported);

}

 

//儲存當前所有進行觸控的Stroke，鍵是TouchDevice.Id屬性

Dictionary<int, Stroke> strokes = new Dictionary<int, Stroke>();

 

void Touch_FrameReported(object sender, TouchFrameEventArgs e)

{

    //擷取所有TouchPoint

    var points = e.GetTouchPoints(inkPresenter);

    foreach (var point in points)

    {

        switch (point.Action)

        {

            case TouchAction.Up:

                //完成一次觸控，刪除相應Stroke

                strokes.Remove(point.TouchDevice.Id);

                break;

            case TouchAction.Move:

                //移動，把StylusPoint加入到Stroke中

                var stroke = strokes[point.TouchDevice.Id];

                stroke.StylusPoints.Add(new StylusPoint(point.Position.X, point.Position.Y));

                break;

            case TouchAction.Down:

                //新觸控點，把Stroke加入到內部字典中，同時也加入到InkPresenter中

                var drawingAttr = new DrawingAttributes();

                drawingAttr.Height = drawingAttr.Width = 10;

                drawingAttr.Color = GetRandomColor();

 

                var newStroke = new Stroke();

                newStroke.DrawingAttributes = drawingAttr;

                newStroke.StylusPoints.Add(new StylusPoint(point.Position.X, point.Position.Y));

 

                strokes[point.TouchDevice.Id] = newStroke;

                inkPresenter.Strokes.Add(newStroke);

                break;

        }

    }

}