前言

上一篇把 Cocos2d 环境搭好了，今天来学习一下 Webview 的使用。

使用

我们往 HelloWorldScene 中的 init 方法加入如下代码

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16

#include "ui/UIWebView/UIWebView.h"

bool HelloWorld::init()
{
    if (!Scene::init())
    {
        return false;
    }

    auto size = Director::getInstance()->getWinSize();
    auto webview = cocos2d::ui::WebView::create();
    webview->setPosition(size/2);
    webview->setContentSize(size);
    webview->loadURL("https://www.cocos.com/");
    addChild(webview);
}

编译后直接运行，就可以看到 cocos2d 的官网了，如下所示（iOS 模拟器）

适配桌面平台

如果你按照上面的代码在桌面平台，也就是 Mac 或者 Windows 上运行，是无法通过编译的，会报如下错误

1
2

Undefined symbol: cocos2d::ui::WebView::create()
Undefined symbol: cocos2d::ui::WebView::loadURL(std::__1::basic_string<char, std::__1::char_traits<char>, std::__1::allocator<char> > const&)

这是因为它在桌面平台就没有引入 WebView ，我们查看 CocosGUI.h 源码，如下

1
2
3
4

#if (CC_TARGET_PLATFORM == CC_PLATFORM_ANDROID || CC_TARGET_PLATFORM == CC_PLATFORM_IOS)
#include "ui/UIVideoPlayer.h"
#include "ui/UIWebView/UIWebView.h"
#endif

可以看到这里只有在 Android 和 iOS 的情况下才会引入 WebView ，既然在桌面平台不能用，那怎么适配呢？

桌面平台没有对对应的控件可以用，那么我们可以跳转到系统的浏览器并打开对应的网页，也能达到一定的效果。使用如下代码实现

1

Application::getInstance()->openURL("https://www.cocos.com/");

运行之后就会打开系统的默认浏览器，例如 Chrome 、 Edge 等。

完整源码

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14

#if (CC_TARGET_PLATFORM == CC_PLATFORM_ANDROID || CC_TARGET_PLATFORM == CC_PLATFORM_IOS)
#include "ui/UIWebView/UIWebView.h"
#endif

#if (CC_TARGET_PLATFORM == CC_PLATFORM_ANDROID || CC_TARGET_PLATFORM == CC_PLATFORM_IOS)
auto size = Director::getInstance()->getWinSize();
auto webview = cocos2d::ui::WebView::create();
webview->setPosition(size/2);
webview->setContentSize(size);
webview->loadURL("https://www.cocos.com/");
addChild(webview);
#elif (CC_TARGET_PLATFORM == CC_PLATFORM_MAC || CC_TARGET_PLATFORM == CC_PLATFORM_WIN32)
Application::getInstance()->openURL("https://www.cocos.com/");
#endif

总结

今天我们学习了在移动平台中使用 WebView ，由于不支持桌面平台所以我们通过跳转到系统浏览器来打开对应的网页。

参考