如何让一个Web App实现一个全屏的应用

在我们的Ubuntu SDK中，它提供了一个＂Web App＂的模版，它很方便地让我们把一个Web-based网页转换成一个Ubuntu的应用．大家可以参考我的文章＂如何使用在线Webapp生成器生成安装包＂来创建Web App．在今天的文章中，我们来介绍如实现一个全屏的Web App．

下面我们以百度地图为例．当我们利用我们的Ubuntu SDK创建一个应用时：

baidumap.desktop

[Desktop Entry]
Name=百度地图
Comment=webapp for baidumap
Type=Application
Icon=baidumap.png
Exec=webapp-container --enable-back-forward --store-session-cookies --webappUrlPatterns=https?://map.baidu.com/* http://map.baidu.com %u
Terminal=false
X-Ubuntu-Touch=true

细心的开发者可以看到在上面的＂--enable-back-forward＂选项．它让我们的Web App在最上面有一个title/header的地方，就像下面的图展示的那样：

在上面的图中，我们可以看到有一个＂百度地图＂的标题栏．它可以让我们返回以前的页面．

如果我们把上面的＂--enable-back-forward＂选项去掉，也就是：

Exec=webapp-container --store-session-cookies --webappUrlPatterns=https?://map.baidu.com/* http://map.baidu.com %u

那么我们的运行结果将是：

我们可以看出来，我们的header/title区域不见了．这样的好处是我们可以得到更多的显示区域．当然我们还是可以看到我们的indicator区域．

对于一些游戏的页面来说，能有一个全屏的用户界面是一个至高无上的需求，那么，我们可以更进一步来做如下的修改．我们添加一个＂--fullscreen＂的选项．

[Desktop Entry]
Name=百度地图
Comment=webapp for baidumap
Type=Application
Icon=baidumap.png
Exec=webapp-container --fullscreen -cookies --webappUrlPatterns=https?://map.baidu.com/* http://map.baidu.com %u
Terminal=false
X-Ubuntu-Touch=true

重新运行我们的项目：

我们可以看到一个全屏的应用，甚至连indicator的影子都没有．

更多关于Web App开发的信息可以在 网站找到．

整个项目的源码在： https://github.com/liu-xiao-guo/baidumap_fullscreen