Cordova InAppBrowser - 如何禁用URL和导航栏？

Question

我目前正在构建一个新闻聚合器应用程序，我正在使用InAppBrowser让人们阅读这些文章。现在，我的问题是：我可以删除URL和导航栏吗？另外，我可以更改“完成”按钮文本吗？

请告诉我......

由于

Answer 1

要删除网址，只需将“位置”选项设置为“否”。

var ref = cordova.InAppBrowser.open('http://apache.org', '_blank', 'location=no');

在Android上，这会删除“后退/前进”按钮，网址和“完成”按钮，而不仅仅是网址，但幸运的是，这里有一个特殊的Android“ hideurlbar ”选项仅删除网址。

var ref = cordova.InAppBrowser.open('http://apache.org', '_blank', ‘hideurlbar=yes’);

可以通过添加“ closebuttoncaption ”选项来更改“完成”按钮文字。
（如果使用InAppBrowser插件v2.0.2或更高版本，现在适用于Android。）

var ref = cordova.InAppBrowser.open('http://apache.org', '_blank', 'closebuttoncaption=My Button Name');

在iOS上，可以通过将“工具栏”选项设置为“否”来删除工具栏。

var ref = cordova.InAppBrowser.open('http://apache.org', '_blank', 'toolbar=no');

但是，删除工具栏意味着“后退/前进”按钮和“完成”按钮都将不再显示。这使得很难退出InAppBrowser。

（退出InAppBrowser在Android上不是一个问题，因为如果没有显示“完成”按钮，系统后退按钮提供了另一种退出方法。）

如果您想保留“完成”按钮，但摆脱“后退/前进”按钮，请将“ hidenavigationbuttons ”选项设置为“是'（需要InAppBrowser插件v3.0.0或更高版本）。

var ref = cordova.InAppBrowser.open('http://apache.org', '_blank', 'hidenavigationbuttons=yes');

对于较旧的插件版本，您可以通过修改InAppBrowser插件的源代码来手动删除所有InAppBrowser中的“后退/前进”按钮，如下所示。

---

对于iOS，请打开以下文件

YOURAPPNAME/platforms/ios/YOURAPPNAME/Plugins/cordova-plugin-inappbrowser/CDVInAppBrowser.m

并更改以下代码行：

[self.toolbar setItems:@[self.closeButton, flexibleSpaceButton, self.backButton, fixedSpaceButton, self.forwardButton]];

为：

[self.toolbar setItems:@[self.closeButton, flexibleSpaceButton]];

然后使用命令行再次构建项目。

---

对于Android，请打开以下文件

YOURAPPNAME/platforms/android/src/org/apache/cordova/inappbrowser/InAppBrowser.java

并删除以下代码行：

toolbar.addView(actionButtonContainer);

要删除该网址，请删除以下代码行：

toolbar.addView(edittext);

然后使用命令行再次构建项目。

---

感谢danw和Vishwani提供了有用的答案。 2018年4月使用Cordova 8.0.0，Cordova iOS 4.5.4，Cordova Android 7.1.0和cordova-plugin-inappbrowser 3.0.0进行了测试

Answer 2

在3.1.0（？）中，您可以使用“工具栏”选项隐藏工具栏。

例如：

ref = window.open('http://some.page/foo/', '_blank', 'location=no,toolbar=no');

请参阅：phonegap docs

Answer 3

window.open('http://url/', '_blank', 'location=no,toolbar=no');

位置：设置为是或否可以打开或关闭InAppBrowser的位置栏。

工具栏：设置为yes或no以打开或关闭InAppBrowser的工具栏（默认为yes）。这种接缝只有 ios

查找所有选项here

Answer 4

如果你想保留完成/关闭按钮并删除其他所有内容，请保持location = yes：

var ref = window.open('http://apache.org', '_blank', 'location=yes');

并在inappbrowser.java文件中进行更改：

toolbar.addView(close);
close.setText("Done");

if (getShowLocationBar()) {
main.addView(toolbar);}

删除editText和actionButtonContainer。希望它有所帮助。

Answer 5

const options: InAppBrowserOptions= {
      zoom: 'no',
      hideurlbar: 'yes', // hide the url toolbar
      hidenavigationbuttons: 'yes', // hide navigation buttons back/forward

    }
const browser = this.iab.create(url,'_self',options);

Answer 6

如果要完全删除工具栏，可以暂时将工具栏HEIGHT变量设置为0.0。您将在与上面答案相同的文件中找到它。它不是最好的解决方案，但它会消失。

Answer 7

使用：

var options = {
  "location": "no", 
  "toolbar": "no"
};
$cordovaInAppBrowser.open(url, target, options);