在WP7的手機世界裡面,在輸入不同的資料時,可以設定為不同的模式,讓使用者可以更快速方的方式來進行資料的輸入。而有哪些輸入的模式,要如何設定這些模式呢,小喵用這篇做個記錄。
緣起
在WP7的手機世界裡面,在輸入不同的資料時,可以設定為不同的模式,讓使用者可以更快速方的方式來進行資料的輸入。而有哪些輸入的模式,要如何設定這些模式呢,小喵用這篇做個記錄。
指定輸入模式的程式碼
指定輸入模式的方式,一般的認知中,要切換輸入的模式,可能要寫一些Code做一些程式設的撰寫才能夠達到。但是在WP7的世界中,其實只需要設定XAML Code就可以完成指定輸入模式了。讓我們來看看以下這個例子
首先我們在畫面中拉近去一個TextBox,然後要指定這個TextBox用數字鍵盤輸入數字的資料。我們只需要設定以下的XAML就能夠輕鬆達成
<TextBox.InputScope>
<InputScope>
<InputScopeName NameValue="Digits"></InputScopeName>
</InputScope>
</TextBox.InputScope>
</TextBox>
重點就是在InputScopeName的NameValue,裡面是個列舉,依照不同的設定就會有不同的鍵盤顯示方式。有哪些列舉,請參考以下MSDN的這一篇
http://msdn.microsoft.com/zh-tw/library/system.windows.input.inputscopenamevalue(v=VS.95).aspx
透過這樣簡單的設定,就可以指定讓使用者用不同的方式來進行輸入。比如說使用者其實只需要打數字,就直接給使用者數字鍵盤(Digits / Number),這樣使用者輸入時,按鍵比較大也比較少,可以很方便就輸入進去。
特殊輸入的整理
在上面MSDN的列舉中 ,有些還蠻特殊的,有些小喵分不出來與一般文字輸入有什麼不一樣的地方。所以小喵將這裡面,小喵覺得比較特別的,可能應用的地方做一下整理:
一般文字輸入:Default
一般的文字輸入,會用以下畫面的鍵盤,依照設定→鍵盤的設定,切換不同的輸入法
數字 / 貨幣的輸入:Digits / Number
如果是要輸入數字的話,可以使用Digits或者是Number,這種要輸入金額、數字的欄位還蠻直覺與快速的。
網址:url
在這裡面,有關於【網址】的可以用【url】,他長得像這樣
比較不同的是他的左下角會有個【.com】可以協助我們快速輸入網址,而如果我們的網址不是.com,也可以【長按】,他會出現其他的快速選項,可以幫助我們快速輸入如【.org / .edu / .net】之類的網址。
EMail:EMailNameOrAddress
如果是要輸入【EMail】的話,可以選擇用【EmailNameOrAddress】,那麼會有如下畫面的輸入鍵盤
在.com的旁邊,多了一個【@】方便輸入EMail,而一樣的,如果您的EMail不是.com的話,也可以【長按】.com,一樣可以快速選擇【.org / .edu / .net】
比較EMail與網址,其實差別就只在【@】符號。所以這兩個都選EmailNameOrAddress其實都算方便。
貨幣+貨幣符號: CurrencyAmountAndSymbol
如果選擇的是貨幣符號,則是會出現特殊符號與數字的這樣鍵盤,因此如果希望使用者輸入的是數字+特殊符號,可以使用這個。
電話號碼:TelephoneNumber
如果是要輸入電話號碼,也有專用的鍵盤,如下圖,與數字不同的是,方便輸入電話時所需要輸入的【*】、【#】、【-】符號。
日期時間:
說到日期,雖然裡面也有Date的項目,不過我們有更好的選擇可以用,那是Silverlight Toolkit,裡面的控制項,使用很簡單,只要安裝好Silverlight Toolkit之後,就可以直接從工具箱中拖拉出來放。放好就設計好了。
小喵分別拉一個日期、一個時間控制項到畫面上:
<toolkit:TimePicker HorizontalAlignment="Left" Margin="176,106,0,0" Name="TimePicker1" VerticalAlignment="Top" />
這樣就可以使用了。不過這時候會發現,真正在挑選日期或時間的時候,下面的完成與取消的圖示都不見。要處理這個問題,首先可以到您所安裝的SDK中,找到相關的圖示。小喵是從這個位置找到的:【C:\Program Files (x86)\Microsoft SDKs\Windows Phone\v7.0\Icons\dark】。再來,在專案的跟目錄下,建立一個名為【Toolkit.Content】的資料夾。接著將兩個圖分別為【appbar.check.rest】與【appbar.cancel.rest】複製到這個資料夾中,接著要幫他們重新命名為【ApplicationBar.Check.png】與【ApplicationBar.Cancel.png】,最後,還要設定兩個圖形的【屬性】,找到【建置動作】,改為【內容】。
這樣就可以得到下面畫面的效果了。
結語:
在Windows Phone設計時,我們可以多幫使用者操作的時候想一想,用什麼樣的鍵盤方式來進行輸入會比較快速。而輸入日期時間的時候,也可以透過Control Toolkits的幫忙,直接使用DatePicker與TimePicker的控制向來協助。用非常簡單的方式,就能夠幫助使用者快速輸入資料,提升使用者的操作感受。小喵特以此篇筆記一下這些地設定方式,提供自己未來設計時可以參考。
以下是簽名:
- 歡迎轉貼本站的文章,不過請在貼文主旨上加上【轉貼】,並在文章中附上本篇的超連結與站名【topcat姍舞之間的極度凝聚】,感恩大家的配合。
- 小喵大部分的文章會以小喵熟悉的語言VB.NET撰寫,如果您需要C#的Code,也許您可以試著用線上的工具進行轉換,這裡提供幾個參考
Microsoft MVP Visual Studio and Development Technologies (2005~2019/6) | topcat Blog:http://www.dotblogs.com.tw/topcat |