在WebChromeClient接口中有个方法:
public void onReceivedTouchIconUrl (WebView view, String url, boolean precomposed)
在android API文档中有关于该方法的说明: "Notify the host application of the url for an apple-touch-icon"。在做webkit移植时,就很疑惑这个方法的作用,因为我们到最后都没有实现这个方法,也没有发现哪个地方需要这个接口。在做browser2.0的时候,做到这个地方时,又有人提出了这个疑问,这个和FavIcon到底有什么区别。还是决定寻找一下相关的资料,彻底弄明白这个touch icon的用途。
什么是Apple Touch Icon?
Apple在IOS上使用Apple Touch Icon来表示网站(类似favicon)。safari mobile中有一个功能,将当前页面添加到主屏幕,betway官网首页 主屏幕上的图标就是该Touch Icon。如果网站没有提供Touch Icon,添加到主屏幕上的图标就会是网页的缩略图,看起来就比较奇怪了。
随着iphone、ipad席卷全世界,越来越多的网站还是加入了touch icon的支持。google也开始按耐不住了,也在android browser中加入了这一支持。
如何为站点设置Touch Icon
1. 设计Apple Touch Icon
对于IOS视网膜屏而言,最佳尺寸为144×144。格式要求为PNG。命名为apple-touch-icon.png,在主屏上显示圆角并带特效,betway官网首页 命名为apple-touch-icon-precomposed.png,在主屏上显示圆角不带特效。
2. 将Icon放在互联网能够访问的地方
最好将icon放到站点的跟目录,这样站点中每个页面就自动有一个touch icon。
3. (可选)如果想为个别网页设置不同于主站的touch icon,betway官网首页 可以在link标签中加入。
<link href="/custom_icon.png"/>
参考资料
1. Android SDK: WebChromeClient
2. How To Setup An Apple Touch Icon For Your Website And Individual Webpages
3. Adding a bookmark to an Android Home screen