欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  移动技术

Windows Phone 7(WP7)开发 AutoCompletedBox制作中文城市名称输入框

程序员文章站 2022-07-08 14:21:58
  Toolkit里的AutoCompletedBox默认的功能已经很强大了,做一个英文城市或者英文单词的提示,可以直接指定FilterMode为AutoC...

 

Toolkit里的AutoCompletedBox默认的功能已经很强大了,做一个英文城市或者英文单词的提示,可以直接指定FilterMode为AutoCompleteFilterMode.SartsWith(或者其它更合适的过滤器)。

对于自带的FilterMode,请参见MSDN:http://msdn.microsoft.com/zh-cn/library/system.windows.controls.autocompletefiltermode(VS.95).aspx

 

       但是对于中文城市名称过滤来说,恐怕还需要进一步修改。原因如下,由于我们的用户使用的输入可能是中文键盘,举一个很简单的例子来说:用户想找“北京”的时候,他输入[beijing,bei,b,北]都是需要提示的,注意,最后那个是中文,这个时候,就需要亲手来写一些代码啦。

先上个效果图:

Windows Phone 7(WP7)开发 AutoCompletedBox制作中文城市名称输入框

 

首先是Model类vcD4NCjxwPg0KCSZuYnNwOzwvcD4NCjxwPg0KCXB1YmxpYyBjbGFzcyBDaXR5TW9kZWw6QmFzZU1vZGVsPC9wPg0KPHA+DQoJezwvcD4NCjxwPg0KCXByaXZhdGUgc3RyaW5nIF9jaXR5TmFtZSA9ICZxdW90OyZxdW90Ozs8L3A+DQo8cD4NCglwcml2YXRlIHN0cmluZyBfcGlueWluID0gJnF1b3Q7JnF1b3Q7OzwvcD4NCjxwPg0KCXB1YmxpYyBzdHJpbmcgQ2l0eU5hbWU8L3A+DQo8cD4NCgl7PC9wPg0KPHA+DQoJZ2V0IHsgcmV0dXJuIF9jaXR5TmFtZTsgfTwvcD4NCjxwPg0KCXNldDwvcD4NCjxwPg0KCXs8L3A+DQo8cD4NCglfY2l0eU5hbWUgPSB2YWx1ZTs8L3A+DQo8cD4NCglPbk5vdGlmeVByb3BlcnR5Q2hhbmdlZCgmcXVvdDtDaXR5TmFtZSZxdW90Oyk7PC9wPg0KPHA+DQoJfTwvcD4NCjxwPg0KCX08L3A+DQo8cD4NCglwdWJsaWMgc3RyaW5nIFBpbnlpbjwvcD4NCjxwPg0KCXs8L3A+DQo8cD4NCglnZXQgeyByZXR1cm4gX3BpbnlpbjsgfTwvcD4NCjxwPg0KCXNldCB7IF9waW55aW4gPSB2YWx1ZTsgfTwvcD4NCjxwPg0KCX08L3A+DQo8cD4NCgl9PC9wPg0KPHA+DQoJTW9kZWzA4LrcvPK1paOsvs0yuPbK9NDUo6xDaXR5TmFtZc6q1tDOxMP7s8ajrFBpbnlpbqOo4MWjrMi3yrXKx8a00vQmaGVsbGlwOyZoZWxsaXA7o6nOqrPHytC1xMa00vTD+6GjPC9wPg0KPHA+DQoJJm5ic3A7PC9wPg0KPHA+DQoJJm5ic3A7PC9wPg0KPHA+DQoJzqrBy8q1z9bJz8281tBJdGVtc7XEz9TKvtCnufujrM7Sw8fQ6NKqttTG5MSjsOa9+NDQ0N64xKOsvt/M5VhBTUzI58/Co7o8L3A+DQo8cD4NCgkmbHQ7cGhvbmU6UGhvbmVBcHBsaWNhdGlvblBhZ2UuUmVzb3VyY2VzJmd0OzwvcD4NCjxwPg0KCSZsdDtEYXRhVGVtcGxhdGUgeDpLZXk9JnF1b3Q7QXV0b0l0ZW1UZW1wbGF0ZSZxdW90OyZndDs8L3A+DQo8cD4NCgkmbHQ7R3JpZCBXaWR0aD0mcXVvdDs0MDAmcXVvdDsgSGVpZ2h0PSZxdW90OzUwJnF1b3Q7Jmd0OzwvcD4NCjxwPg0KCSZsdDtUZXh0QmxvY2sgSG9yaXpvbnRhbEFsaWdubWVudD0mcXVvdDtMZWZ0JnF1b3Q7IFRleHRXcmFwcGluZz0mcXVvdDtXcmFwJnF1b3Q7IFRleHQ9JnF1b3Q7e0JpbmRpbmcgQ2l0eU5hbWV9JnF1b3Q7IGQ6TGF5b3V0T3ZlcnJpZGVzPSZxdW90O0hlaWdodCZxdW90Oy8mZ3Q7PC9wPg0KPHA+DQoJJmx0O1RleHRCbG9jayBIb3Jpem9udGFsQWxpZ25tZW50PSZxdW90O0xlZnQmcXVvdDsgTWFyZ2luPSZxdW90OzIwMCwwLDU3LDgmcXVvdDsgVGV4dFdyYXBwaW5nPSZxdW90O1dyYXAmcXVvdDsgVGV4dD0mcXVvdDt7QmluZGluZyBQaW55aW59JnF1b3Q7IGQ6TGF5b3V0T3ZlcnJpZGVzPSZxdW90O0hlaWdodCZxdW90Oy8mZ3Q7PC9wPg0KPHA+DQoJJmx0Oy9HcmlkJmd0OzwvcD4NCjxwPg0KCSZsdDsvRGF0YVRlbXBsYXRlJmd0OzwvcD4NCjxwPg0KCSZsdDsvcGhvbmU6UGhvbmVBcHBsaWNhdGlvblBhZ2UuUmVzb3VyY2VzJmd0OzwvcD4NCjxwPg0KCSZsdDt0b29sa2l0OkF1dG9Db21wbGV0ZUJveCB4Ok5hbWU9JnF1b3Q7VHh0VXNlcklucHV0JnF1b3Q7IE1hcmdpbj0mcXVvdDswLDgsMCwwJnF1b3Q7IEl0ZW1UZW1wbGF0ZT0mcXVvdDt7U3RhdGljUmVzb3VyY2UgQXV0b0l0ZW1UZW1wbGF0ZX0mcXVvdDsgVmFsdWVNZW1iZXJQYXRoPSZxdW90O0NpdHlOYW1lJnF1b3Q7IEhlaWdodD0mcXVvdDs3MyZxdW90OyBWZXJ0aWNhbEFsaWdubWVudD0mcXVvdDtUb3AmcXVvdDsgLyZndDs8L3A+DQo8cD4NCgkmbmJzcDsmbmJzcDsmbmJzcDsmbmJzcDsmbmJzcDsmbmJzcDsgyc/D5rXEWEFNTLT6wuvW0M6o0rvQ6NKqy7XD97XEvs3Kx0F1dG9Db21wbGV0ZUJveLXEVmFsdWVNZW1iZXJQYXRoyvTQ1KOs08nT2kl0ZW21xMr9vt3UtMrHQ2l0eU1vZGVswODQzbXEo6zI58nPzbyjrNXiyrHI57n708O7p7Xju/cmbGRxdW87sbG+qSZuYnNwOyZuYnNwOyZuYnNwOyBiZWlqaW5nJnJkcXVvO9XiuPbP7sS/yrGjrNTazsSxvr/y1tDKx8/Uyr4mcXVvdDuxsb6pJnF1b3Q7u/LV3yZxdW90O2JlaWppbmcmcXVvdDu+zcihvvbT2lZhbHVlTWVtYmVyUGF0aLXEyejWw8HLoaM8L3A+DQo8cD4NCgkmbmJzcDs8L3A+DQo8cD4NCgkmbmJzcDs8L3A+DQo8cD4NCgnU2lhBTUy1xENT0rPD5sDvo6zQ6NKqvfjSu7K91ri2qEF1dG9Db21wbGV0ZUJveLXEyv2+3dS0o6ixp8e4w7vT0NHPuPHKudPDTVZWTbDztqijrNXisrvKx9bYteOho6Gjo6k8L3A+DQo8cD4NCglwcml2YXRlIHZvaWQgUGhvbmVBcHBsaWNhdGlvblBhZ2VfTG9hZGVkKG9iamVjdCBzZW5kZXIsIFJvdXRlZEV2ZW50QXJncyBlKTwvcD4NCjxwPg0KCXs8L3A+DQo8cD4NCgl2aWV3TW9kZWwgPSBuZXcgSW5wdXRDaXR5TmFtZVZpZXdNb2RlbCgpOzwvcD4NCjxwPg0KCXRoaXMuRGF0YUNvbnRleHQgPSB2aWV3TW9kZWw7PC9wPg0KPHA+DQoJVHh0VXNlcklucHV0Lkl0ZW1zU291cmNlID0gdmlld01vZGVsLkxpc3RDaXRpZXM7PC9wPg0KPHA+DQoJVHh0VXNlcklucHV0LkZpbHRlck1vZGUgPSBBdXRvQ29tcGxldGVGaWx0ZXJNb2RlLkN1c3RvbTs8L3A+DQo8cD4NCglUeHRVc2VySW5wdXQuSXRlbUZpbHRlciA9IHZpZXdNb2RlbC5GaWx0ZXI7PC9wPg0KPHA+DQoJVHh0VXNlcklucHV0LkZvY3VzKCk7PC9wPg0KPHA+DQoJfTwvcD4NCjxwPg0KCVZpZXdNb2RlbMDvtcTSu9CpxNrI3aO6PC9wPg0KPHA+DQoJcHVibGljIGNsYXNzIElucHV0Q2l0eU5hbWVWaWV3TW9kZWwgOiBCYXNlVmlld01vZGVsPC9wPg0KPHA+DQoJezwvcD4NCjxwPg0KCXB1YmxpYyBJTGlzdCZsdDtDaXR5TW9kZWwmZ3Q7IExpc3RDaXRpZXMgPSBuZXcgTGlzdCZsdDtDaXR5TW9kZWwmZ3Q7KCk7PC9wPg0KPHA+DQoJcHVibGljIElucHV0Q2l0eU5hbWVWaWV3TW9kZWwoKTwvcD4NCjxwPg0KCXs8L3A+DQo8cD4NCglMb2FkQ2l0aWVzKCk7PC9wPg0KPHA+DQoJfTwvcD4NCjxwPg0KCXByaXZhdGUgdm9pZCBMb2FkQ2l0aWVzKCk8L3A+DQo8cD4NCgl7PC9wPg0KPHA+DQoJLy+2wcihs8fK0NDFz6I8L3A+DQo8cD4NCgl9PC9wPg0KPHA+DQoJcHVibGljIGJvb2wgRmlsdGVyKHN0cmluZyBzdHJJbnB1dCwgb2JqZWN0IHRvRmlsdGVyKTwvcD4NCjxwPg0KCXs8L3A+DQo8cD4NCglDaXR5TW9kZWwgbW9kZWwgPSAoQ2l0eU1vZGVsKXRvRmlsdGVyOzwvcD4NCjxwPg0KCWlmIChtb2RlbC5QaW55aW4uU3RhcnRzV2l0aChzdHJJbnB1dCkg"| model.CityName.StartsWith(strInput))

return true;

else

{

return false;

}

}

}

这里的关键就是Filter了,代码很简单,很容易看懂。

 

       顺便再谈一个Bug的问题,AutoCompleteBox在Pivot里面的提示显示是不正常的,而且显示和触控是错位的,网上有大牛给出了变相的解决办法,但我一直认为那太复杂,个人比较懒。。前两天Bing了一下,突然眼前一亮,截图纪念一下:

Windows Phone 7(WP7)开发 AutoCompletedBox制作中文城市名称输入框

 

       粗略看了摘要之后(确实是粗略,因为中间有”…”我也没太注意),我当时以为随着Toolkit的新版的发布,这个问题已经解决了,但是点击进去一看,发现“Toolkit新版发布”和“AutoCompleteBox在Pivot的Bug的解决”这完全是两篇不同的文章…… 彻底崩溃。。

       但是必须要在Pivot里面让用户输入城市名字的,这个怎么办。后来直接用了个笨点的办法,我把Pivot里面的AutoCompleteBox换成了TextBox,然后当Text获得焦点之后,跳转到一个新页面,空白页面上只有AutoCompleteBox,当用户输入完成之后再把值传递回去,算是个障眼法么。。不过我记得有很多时候在手机上都是这么做的——当用户点击输入框之后屏幕上只显示输入框和键盘及候选字,输入完之后再返回去。这样用户体验也不会太差,总比在Pivot上面硬生生的让用户直面Bug来得好,这也算是一个临时的解决办法吧,期待Toolkit的升级~

 

作者 锦燕云