轉帖|其它|編輯:郝浩|2011-07-08 18:07:34.000|閱讀 801 次
概述:過了捕捉觸控點、以及透過觸控屏幕來手寫繪圖之后,當然,我們也希望能夠像Surface或是Mobile Phone那樣,能夠用手指直接放大縮小圖形,這一個部分就牽扯到所謂的筆勢(gesture)了。
# 界面/圖表報表/文檔/IDE等千款熱門軟控件火熱銷售中 >>
過了捕捉觸控點、以及透過觸控屏幕來手寫繪圖之后,當然,我們也希望能夠像Surface或是Mobile Phone那樣,能夠用手指直接放大縮小圖形,這一個部分就牽扯到所謂的筆勢(gesture)了。
盡管Silverlight Touch API中并沒有直接支持筆勢,但我們還是可以透過先前介紹過的API來實現相關的行為。
從概念上來看,當我們要實現用兩個觸控點來縮放圖形時,整個概念如下:
假設場景中有多個觸控點,其中有兩個觸控點同時點選在某一個對象上,并且開始拖曳(Move),而拖曳的過程中兩個觸控點的距離D愈來愈遠,我們就視為用戶要將圖形放大,反之,若兩點的距離愈來愈近,我們則視為圖形縮小。
在這個概念下,我們需要判斷并處理幾個狀況:
是否有兩個觸控點同時點在一個對象上。
這兩個觸控點移動時,取得觸控點之間的距離D。
在觸控點移動時,透過兩點距離D,來調整被觸控對象的大小。
請參考先前pdf的程序一,在先前實作的功能中,我們僅實現了拖曳的功能,現在我們看一下『Case TouchAction.Move』部分:
view plaincopy to clipboardprint?
Case TouchAction.Move '當動作為移動
If p.Action = TouchAction.Move Then
'是否還有其他點在同一個對象身上?
If isMultiPoints(p.TouchDevice.DirectlyOver, e) Then
'縮放
'如果第一點是空值
If ElementLastDistance(i) = 0 Then
ElementLastDistance(i) = getFirst2PointsDistance(p.TouchDevice.DirectlyOver, e)
Else
Dim offset As Integer = getFirst2PointsDistance(p.TouchDevice.DirectlyOver, e) - ElementLastDistance(i)
ElementLastDistance(i) = getFirst2PointsDistance(p.TouchDevice.DirectlyOver, e)
'rectangle
If element.GetType() Is GetType(Image) Then
CType(element, Rectangle).Height = CType(element, Rectangle).Height * (1 + offset / SenseValue)
CType(element, Rectangle).Width = CType(element, Rectangle).Width * (1 + offset / SenseValue)
End If
End If
Else
'移動
'取得新坐標
Dim x, y As Integer
x = p.Position.X - originalPointPosistions(i).X
y = p.Position.Y - originalPointPosistions(i).Y
If element IsNot Nothing Then
element.SetValue(Canvas.LeftProperty, originalElementPosistions(i).X + x)
element.SetValue(Canvas.TopProperty, originalElementPosistions(i).Y + y)
End If
End If
End If
Case TouchAction.Move '當動作為移動
If p.Action = TouchAction.Move Then
'是否還有其他點在同一個對象身上?
If isMultiPoints(p.TouchDevice.DirectlyOver, e) Then
'縮放
'如果第一點是空值
If ElementLastDistance(i) = 0 Then
ElementLastDistance(i) = getFirst2PointsDistance(p.TouchDevice.DirectlyOver, e)
Else
Dim offset As Integer = getFirst2PointsDistance(p.TouchDevice.DirectlyOver, e) - ElementLastDistance(i)
ElementLastDistance(i) = getFirst2PointsDistance(p.TouchDevice.DirectlyOver, e)
'rectangle
If element.GetType() Is GetType(Image) Then
CType(element, Rectangle).Height = CType(element, Rectangle).Height * (1 + offset / SenseValue)
CType(element, Rectangle).Width = CType(element, Rectangle).Width * (1 + offset / SenseValue)
End If
End If
Else
'移動
'取得新坐標
Dim x, y As Integer
x = p.Position.X - originalPointPosistions(i).X
y = p.Position.Y - originalPointPosistions(i).Y
If element IsNot Nothing Then
element.SetValue(Canvas.LeftProperty, originalElementPosistions(i).X + x)
element.SetValue(Canvas.TopProperty, originalElementPosistions(i).Y + y)
End If
End If
End If
我們在程序代碼當中加入了幾個動作,分別是判斷同一個對象是否被兩個以上的觸控點所點選,IC交易網以及這兩個觸控點之間的距離,接著,再透過這兩個觸控點之間的距離來動態調整Image對象的大小,就形成我們需要的效果了。
總的來說,Silverlightpdf中的Multi-Touch技術相較而言并不困難,雖然沒有龐大的.NET Framework作為后盾,但簡單好用的Touch API也足以讓我們建構出不錯的Web/RIA應用程序,而具體的實現方式就有賴開發人員的設計了。
總的來說,Silverlight作為第一個支持Multi-Touch功能的RIA/Web應用程序開發技術,一舉將因特網應用程序的應用層面,擴展到另一個領域,讓應用程序的價值大增,也讓開發人員能夠發揮更多的創意。
本站文章除注明轉載外,均為本站原創或翻譯。歡迎任何形式的轉載,但請務必注明出處、不得修改原文相關鏈接,如果存在內容上的異議請郵件反饋至chenjj@fc6vip.cn
文章轉載自:網絡轉載