多點(diǎn)觸控（Multi-Touch）就是通過與觸屏設(shè)備的接觸達(dá)到人與應(yīng)用程序交互的操作過程。例如，生活中經(jīng)常使用的觸屏手機(jī)、觸屏筆記本、顯示器以及微軟最新的Surface 產(chǎn)品等這些都屬于觸屏操作設(shè)備。本篇將介紹如何開發(fā)能夠支持MT 功能的應(yīng)用程序。

　　在WPF 4 中已經(jīng)具備的多點(diǎn)觸控開發(fā)技術(shù)，當(dāng)多個(gè)手指觸碰到觸屏設(shè)備時(shí)，WPF 會(huì)把每跟手指認(rèn)為是一個(gè)觸控設(shè)備，并為其分配唯一的識(shí)別ID，以便跟蹤不同手指的操作手勢。下面將通過實(shí)例演示W(wǎng)PF 所支持的低級(jí)別觸控操作：觸碰（TouchDown）、分離（TouchUp）、移動(dòng)（TouchMove），它們都是一些最基礎(chǔ)的操作模式。

　　創(chuàng)建項(xiàng)目

　　新建項(xiàng)目在XAML中寫入如下代碼，<Grid>中只添加了<Canvas> 控件，其中包含TouchDown、TouchUp、TouchMove 三個(gè)基礎(chǔ)觸控事件。當(dāng)手指觸碰程序時(shí)便會(huì)在Canvas 中生成彩色圓圈，圓圈的位置隨手指的移動(dòng)而改變，手指離開觸屏的同時(shí)圓圈消失。接下來將逐一講解每個(gè)事件所完成的任務(wù)。

<Window x:Class="WpfRawTouch.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <Canvas x:Name="touchPad" Background="Gray"
                TouchDown="touchPad_TouchDown" TouchUp="touchPad_TouchUp" 
                TouchMove="touchPad_TouchMove">
        </Canvas>
    </Grid>
</Window>

　　TouchDown 事件主要是完成當(dāng)觸碰產(chǎn)生時(shí)在<Canvas> 控件中生成彩色圓圈的任務(wù)（C#代碼如下）。使用Ellipse 創(chuàng)建隨機(jī)顏色的圓圈，通過GetTouchPoint 方法獲取觸碰位置點(diǎn)，并調(diào)整圓圈在<Canvas> 中的位置。為了跟蹤手指移動(dòng)軌跡，需要將觸屏設(shè)備ID 及UI 控件存儲(chǔ)在集合movingEllipses 中。

private Dictionary<int, Ellipse> movingEllipses = new Dictionary<int, Ellipse>();
Random rd = new Random();

private void touchPad_TouchDown(object sender, TouchEventArgs e)
{
    Ellipse ellipse = new Ellipse();
    ellipse.Width = 30;
    ellipse.Height = 30;
    ellipse.Stroke = Brushes.White;
    ellipse.Fill = new SolidColorBrush(
        Color.FromRgb(
            (byte)rd.Next(0, 255),
            (byte)rd.Next(0, 255),
            (byte)rd.Next(0, 255))
            );

    TouchPoint touchPoint = e.GetTouchPoint(touchPad);
    Canvas.SetTop(ellipse, touchPoint.Bounds.Top);
    Canvas.SetLeft(ellipse, touchPoint.Bounds.Left);

    movingEllipses[e.TouchDevice.Id] = ellipse;

    touchPad.Children.Add(ellipse);
}

　　當(dāng)手指離開觸屏?xí)rTouchUp 事件將被觸發(fā)，首先將觸碰設(shè)備從movingEllipses 集合中刪除不再跟蹤手指相關(guān)操作，并從<Canvas> 中將彩色圓圈移除。

private void touchPad_TouchUp(object sender, TouchEventArgs e)
{
    movingEllipses.Remove(e.TouchDevice.Id);
    Ellipse ellipse = movingEllipses[e.TouchDevice.Id];
    touchPad.Children.Remove(ellipse);
}

　　當(dāng)手指在觸屏上持續(xù)移動(dòng)時(shí)TouchMove 事件觸發(fā)，它來跟蹤手指移動(dòng)軌跡，并重新調(diào)整圓圈在<Canvas> 中的位置。

private void touchPad_TouchMove(object sender, TouchEventArgs e)
{
    Ellipse ellipse = movingEllipses[e.TouchDevice.Id];
    TouchPoint touchPoint = e.GetTouchPoint(touchPad);
    Canvas.SetTop(ellipse, touchPoint.Bounds.Top);
    Canvas.SetLeft(ellipse, touchPoint.Bounds.Left);
}

　　程序演示

　　至此，一個(gè)簡單的觸控應(yīng)用程序就完成了編譯并運(yùn)行該程序，用手指觸碰屏幕并持續(xù)移動(dòng)看看是否會(huì)出現(xiàn)下面視頻中的情況（如果沒有多點(diǎn)觸屏設(shè)備請(qǐng)參考這里解決）。

　　源碼下載：WpfRawTouch.zip

NET技術(shù)：WPF Multi-Touch 開發(fā)：基礎(chǔ)觸屏操作（Raw Touch），轉(zhuǎn)載需保留來源！

鄭重聲明：本文版權(quán)歸原作者所有，轉(zhuǎn)載文章僅為傳播更多信息之目的，如作者信息標(biāo)記有誤，請(qǐng)第一時(shí)間聯(lián)系我們修改或刪除，多謝。