Game embedded Webview web page

Source: Internet
Author: User

 

At the beginning of the mobile game "My name is MT", a game announcement will pop up, and some games are certainly familiar with it. This is webview, a web page. Since webview is related to the platform, here we will introduce how the cocos2d-x embeds the andorid webview control to display web pages in the cocos2d-x.

 

 

1. I will not talk more about JniJni here. For more information, see wikipedia or the transplantation of the aircraft war. Through Jni, you can call the Android API in the cocos2d-x, of course, you can also pass the value.

2. Android uses webview to directly upload code. It mainly handles layout and webview usage issues. The Code layout is used here. The following operations are processed in the main class of android (cocos2dxActivity ):

. The structure of the entire layout of adding member variables is the underlying FrameLayout, And the ImageView control is placed on FrameLayout. Next, a LinearLayout is used to place the close button, while the LinearLayout is down to the Webview control.

 

 

Static Test test = null; // Test instance WebView m_webView; // WebView control ImageView m_imageView; // ImageView control FrameLayout m_webLayout; // FrameLayout layout LinearLayout m_topLayout; // LinearLayout layout Button m_backButton; // close the Button

2.2.OnCreate add FrameLayout Layout

 

 

Protected void onCreate (Bundle savedInstanceState) {super. onCreate (savedInstanceState); test = this; // Initialize an empty layout m_webLayout = new FrameLayout (this); FrameLayout. layoutParams lytp = new FrameLayout. layouparams (800,640); lytp. gravity = Gravity. CENTER; addContentView (m_webLayout, lytp );}

 

 

2. 3. Return instance

 

    public static Test getInstance() {        Log.v(TestJacky,getInstance);    return test;    }

2. 4. Display webview

 

 

Public void openWebview () {Log. v (TestJacky, openWebView); this. runOnUiThread (new Runnable () {// Add another control in the main thread public void run () {// initialize webView m_webView = new WebView (test ); // set webView to execute javascript script m_webView.getSettings (). setJavaScriptEnabled (true); // You can scale m_webView.getSettings (). setsuppzoom zoom (true); // you can specify the Zoom tool m_webView.getSettings (). setBuiltInZoomControls (true); // load URL m_webView.loadUrl ( http://m.blog.csdn.net/blog/jackyvincefu/ ); // Get the page focus m_webView.requestFocus (); // If the page is linked, if you want to click the link to continue responding to m_webView.setWebViewClient (new WebViewClient () in the current browser () {public boolean shouldOverrideUrlLoading (WebView view, String url) {if (url. indexOf (tel :) <0) {view. loadUrl (url) ;}return true ;}}); // background image m_imageView = new ImageView (test); m_imageView.setImageResource (R. drawable. bkgnd); m_imageView.setScaleType (ImageView. scaleType. FIT_XY); // initialize the linear layout with buttons and webView m_topLayout = new LinearLayout (test); m_topLayout.setOrientation (LinearLayout. VERTICAL); // initialize the return Button m_backButton = new Button (test); m_backButton.setBackgroundResource (R. drawable. btn); LinearLayout. layoutParams lypt = new LinearLayout. layoutParams (LinearLayout. layoutParams. WRAP_CONTENT, LinearLayout. layoutParams. WRAP_CONTENT); lypt. gravity = Gravity. RIGHT; m_backButton.setLayoutParams (lypt); m_backButton.setOnClickListener (new OnClickListener () {public void onClick (View v) {removeWebView ();}}); // Add the image to the main layout m_webLayout.addView (m_imageView); // Add the webView to the linear layout m_topLayout.addView (m_backButton); m_topLayout.addView (m_webView ); // Add the linear layout to the main layout m_webLayout.addView (m_topLayout );}});}

2. 5. Remove webview

 

 

    public void removeWebView() {                  m_webLayout.removeView(m_imageView);        m_imageView.destroyDrawingCache();                m_webLayout.removeView(m_topLayout);        m_topLayout.destroyDrawingCache();                        m_topLayout.removeView(m_webView);        m_webView.destroy();                        m_topLayout.removeView(m_backButton);        m_backButton.destroyDrawingCache();    }

2. 6. Rewrite the return key

 

 

Public boolean onKeyDown (int keyCoder, KeyEvent event) {// if the webpage can be rolled back, it will be rolled back. if not, remove WebView if (m_webView.canGoBack () & keyCoder = KeyEvent. KEYCODE_BACK) {m_webView.goBack ();} else {removeWebView ();} return false ;}

3. The cocos2d-x uses Jni here to directly use the HelloWorld example, modifying the callback function of the close button.

 

 

3.1.jni header file

 

#if (CC_TARGET_PLATFORM == CC_PLATFORM_ANDROID)#include 
 
  #include platform/android/jni/JniHelper.h#endif
 

3.2.Jni call open webview

 

 

Void HelloWorld: menuCloseCallback (CCObject * pSender) {# if (CC_TARGET_PLATFORM = CC_PLATFORM_ANDROID) JniMethodInfo minfo; // getStaticMethodInfo determines whether Java static functions exist, save the information to minfo. // parameter 1: JniMethodInfo // parameter 2: Java class package name + class name // parameter 3: Java function name // parameter 4: function parameter type and return value type bool isHave = JniHelper: getStaticMethodInfo (minfo, com/jacky/test/Test, getInstance, () Lcom/jacky/test/Test ;); jobject jobj; // Save the object if (isHave) {// call getInstance here and return Te The object of the st class. Jobj = minfo. env-> CallStaticObjectMethod (minfo. classID, minfo. methodID); isHave = JniHelper: getMethodInfo (minfo, com/jacky/test/Test, openWebview, () V); if (isHave) {// call openWebview, parameter 1: parameter 2 of the Test object: Method IDminfo. env-> CallVoidMethod (jobj, minfo. methodID) ;}# else CCDirector: shareddire()-> end (); # if (CC_TARGET_PLATFORM = CC_PLATFORM_IOS) exit (0); # endif}

 

4. screenshot capture from the claw machine.

 

 

 

Ps: The webview is not opened multiple times. You can use the Jni method to notify the cocos2d-x, or you can directly set a member variable flag in the main class, set to true when calling openWebview, removeWebView is set to false, when openWebview is called, check the flag to determine whether to enable the flag.

5. Download the source code contains win32 and android code, remove the obj generated by android cross compilation, and retain the so and apk files.
: Http://download.csdn.net/detail/jackyvincefu/6770315

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.