Webview in Cocos2d-x v3.3rc0

In this tutorial I am going to discuss about how to create WebView in Cocos2d-x v3.3rc0. In our previous post I talked about how to create a cocos2d-x application. We will use the application we created in our previous post. If you want to have a look at our previous post then go to the link below,

How to create an application in cocos2d-x

The application we created in our previous post was named as “ProjectName”. We are going to use the same application here.

Proceed to the “ProjectName/proj.ios_mac” folder and double click on “ProjectName.xcodeproj” to open your application in Xcode.

Open “HelloWorldScene.cpp” from “classes” folder. Include “ui/UIWebView.h” file.

Add the following code at the end of “bool HelloWorld::init()” method before “return true;”.

Size  winSize = Director::getInstance()->getVisibleSize();
    
auto webView = cocos2d::experimental::ui::WebView::create();
webView->setPosition(winSize/2);
webView->setContentSize(winSize * 0.9);
webView->loadURL("http://www.findsourcecode.com");
webView->setScalesPageToFit(true);
    
this->addChild(webView);

Now run the application & you will see WebView in your application. This will load a URL in your WebView. If you want to load a local file then follow the instructions written below.

Create a file called “index.html” and put it inside “ProjectName/Resources” folder. Do not forget to add the “index.html” file into “ProjectName/Resources” directory from Xcode.

After this, change line 6 of the above code with the following line of code.

webView->loadFile("index.html");

Now, run your application again and you can see your WebView shows content from your local file.

This is how you can create WebView in Cocos2d-x v3.3rc0. If you have any questions feel free to ask me in the comment section.

Post Tagged with , ,

One Response so far.

  1. Yogesh Dubey says:

    How can I get callback from webView in cocos2dx?

Leave a Reply

Your email address will not be published. Required fields are marked *

16 + seven =

This site uses Akismet to reduce spam. Learn how your comment data is processed.