SlideShare una empresa de Scribd logo
1 de 20
Descargar para leer sin conexión
PORTING WEB MMO GAMES
TO NATIVE PLATFORMS.
WORKING WITH WEBVIEW



                     Vitaliy Zasadnyy
             Android TechTalk, Feb 9
PREHISTORY




             7 games
OUR GAMES
TASK

● 2 platforms


● provide custom layout
● show loading screen
● replace some features with native analogs
WebView API
Loading Content

void loadUrl(String url)

void loadData(String data, String mimeType,
   String mimeType)

void postUrl(String url, byte[] postData)

void reload()
WebView API
Setting the Delegate

void setWebViewClient(WebViewClient client)

void setWebChromeClient(WebChromeClient client)
WebViewClient API
Loading Content Callbacks

void onPageStarted(WebView view, String url, Bitmap
   favicon)

void onPageFinished(WebView view, String url)

void onReceivedError(WebView view, int errorCode,
   String description, String failingUrl)

boolean shouldOverrideUrlLoading(WebView view,
   String url)
WebChromeClient API
Event Callbacks

boolean onJs...()

void onProgressChanged(WebView view, int
   newProgress)
T1: CUSTOM LAYOUT




       web          android
T1: CUSTOM LAYOUT




        first idea: custom user-agent
T1: CUSTOM LAYOUT
     better idea: custom headers

@Override
public boolean shouldOverrideUrlLoading(WebView view, String url) {

     Map<String, String> extraHeaders =
            new HashMap<String, String>();
     extraHeaders.put(
            EXTRA_HEADER_CLIENT_TYPE, EXTRA_HEADER_VALUE));

     view.loadUrl(url, extraHeaders);
                                               load with extra header
                            cancel request
     return true;
}
T1: CUSTOM LAYOUT
problem 1:    yourWebWiew.loadUrl("some url");



solution 1:
              public class YourWebView extends WebView {
                      ...
                  @Override
                  public void loadUrl(String url) {
                      // load url with extra headers
                  }
                      ...
              }
T1: CUSTOM LAYOUT
problem 2:    yourWebWiew.reload();



solution 2:
              public class YourWebView extends WebView {
                      ...
                  @Override                 get current url
                  public void reload() {
                      String url = getUrl();
                      // load url with extra headers
                  }
                      ...


                                                he b est
              }


                                       not    t
T1: CUSTOM LAYOUT
problem 3:    post methods (e.g. forms)


solution 3:   there is no solution



                     AOSP: Issue 9122
T2: LOADING SCREEN

                     ●   starts at game launch

                     ●   disappears only when
                         first page is loaded
T2: LOADING SCREEN

public class YourWebViewClient extends WebViewClient {
    ...
    @Override
    public void onPageStarted(WebView view, String url,
Bitmap
       favicon) {
         // show loading dialog
    }

     @Override
     public void onPageFinished(WebView view, String url) {
         // hide loading dialog
     }


                                                  lem
     ...


                                               rob
}

                                             p
T2: LOADING SCREEN

public class YourWebViewClient extends WebViewClient {
    private String mStartUrl;
    ...
    @Override
    public void onPageStarted(WebView view, String url, Bitmap
      favicon) {
        mStartUrl = url;
        // show fullscreen loading dialog
    }

     @Override
     public void onPageFinished(WebView view, String url) {
         if (mStartUrl.equals(url))
              // hide loading dialog
         else
              // redirect!
     }


                                                          ixed
     ...

                                                        f
}
T3: REPLACE SOME FEATURES
public class NravoWebViewClient extends WebViewClient {
    @Override
    public boolean shouldOverrideUrlLoading(WebView view,
       String url) {
        // override behavior here
    }

    @Override
    public void onPageStarted(WebView view, String url,
Bitmap
        favicon) {}

       @Override
       public void onPageFinished(WebView view, String url) {
           if (!mIsRedirect) {
               view.loadUrl("javascript: { alert("Horray!");
}");
          }
     }
}
IF YOU'VE GOT INTERESTED

             NRavo games on:
THANKS FOR YOUR ATTENTION!
        QUESTIONS?




            presentation will be available on:
                       blog.zasadnyy.org.ua

Más contenido relacionado

Destacado

Kerusakan ozon
Kerusakan ozonKerusakan ozon
Kerusakan ozonfilip19
 
SlideShare ShowCase
SlideShare ShowCaseSlideShare ShowCase
SlideShare ShowCaseRassonRam
 
Mtpl presentation18 slides
Mtpl presentation18 slidesMtpl presentation18 slides
Mtpl presentation18 slidesmandevtubes
 
Interieur finale presentatie marlies_vervloesem
Interieur finale presentatie marlies_vervloesemInterieur finale presentatie marlies_vervloesem
Interieur finale presentatie marlies_vervloesemMarliesVervloesem
 
Rothn mtpl presentation-2012 final
Rothn   mtpl presentation-2012 finalRothn   mtpl presentation-2012 final
Rothn mtpl presentation-2012 finalmandevtubes
 
Company profile workrite-herman miller-posh
Company profile workrite-herman miller-poshCompany profile workrite-herman miller-posh
Company profile workrite-herman miller-poshmandevtubes
 
Interieur draft marliesvervloesem
Interieur draft marliesvervloesemInterieur draft marliesvervloesem
Interieur draft marliesvervloesemMarliesVervloesem
 
Interieur12_MarliesVervloesem
Interieur12_MarliesVervloesemInterieur12_MarliesVervloesem
Interieur12_MarliesVervloesemMarliesVervloesem
 
Research Paper Basics
Research Paper BasicsResearch Paper Basics
Research Paper BasicsJohana Boutet
 
Pemanasan global
Pemanasan globalPemanasan global
Pemanasan globalkatonpmgks
 
Recruitment procedure
Recruitment procedureRecruitment procedure
Recruitment procedureRizwnaullah
 
Global warming
Global warmingGlobal warming
Global warmingfilip19
 
Pemanasan global
Pemanasan globalPemanasan global
Pemanasan globalkatonpmgks
 

Destacado (14)

Kerusakan ozon
Kerusakan ozonKerusakan ozon
Kerusakan ozon
 
SlideShare ShowCase
SlideShare ShowCaseSlideShare ShowCase
SlideShare ShowCase
 
ULP-1 Protease in NeSL-1
ULP-1 Protease in NeSL-1ULP-1 Protease in NeSL-1
ULP-1 Protease in NeSL-1
 
Mtpl presentation18 slides
Mtpl presentation18 slidesMtpl presentation18 slides
Mtpl presentation18 slides
 
Interieur finale presentatie marlies_vervloesem
Interieur finale presentatie marlies_vervloesemInterieur finale presentatie marlies_vervloesem
Interieur finale presentatie marlies_vervloesem
 
Rothn mtpl presentation-2012 final
Rothn   mtpl presentation-2012 finalRothn   mtpl presentation-2012 final
Rothn mtpl presentation-2012 final
 
Company profile workrite-herman miller-posh
Company profile workrite-herman miller-poshCompany profile workrite-herman miller-posh
Company profile workrite-herman miller-posh
 
Interieur draft marliesvervloesem
Interieur draft marliesvervloesemInterieur draft marliesvervloesem
Interieur draft marliesvervloesem
 
Interieur12_MarliesVervloesem
Interieur12_MarliesVervloesemInterieur12_MarliesVervloesem
Interieur12_MarliesVervloesem
 
Research Paper Basics
Research Paper BasicsResearch Paper Basics
Research Paper Basics
 
Pemanasan global
Pemanasan globalPemanasan global
Pemanasan global
 
Recruitment procedure
Recruitment procedureRecruitment procedure
Recruitment procedure
 
Global warming
Global warmingGlobal warming
Global warming
 
Pemanasan global
Pemanasan globalPemanasan global
Pemanasan global
 

Similar a Porting web mmo games to native platforms

Designing a JavaFX Mobile application
Designing a JavaFX Mobile applicationDesigning a JavaFX Mobile application
Designing a JavaFX Mobile applicationFabrizio Giudici
 
Qt & Webkit
Qt & WebkitQt & Webkit
Qt & WebkitQT-day
 
droidcon Transylvania - Kotlin Coroutines
droidcon Transylvania - Kotlin Coroutinesdroidcon Transylvania - Kotlin Coroutines
droidcon Transylvania - Kotlin CoroutinesArthur Nagy
 
Infinum Android Talks #17 - A quest for WebSockets by Zeljko Plesac
Infinum Android Talks #17 - A quest for WebSockets by Zeljko PlesacInfinum Android Talks #17 - A quest for WebSockets by Zeljko Plesac
Infinum Android Talks #17 - A quest for WebSockets by Zeljko PlesacInfinum
 
Hybrid App using WordPress
Hybrid App using WordPressHybrid App using WordPress
Hybrid App using WordPressHaim Michael
 
【Unite 2017 Tokyo】もっと気軽に、動的なコンテンツ配信を ~アセットバンドルの未来と開発ロードマップ
【Unite 2017 Tokyo】もっと気軽に、動的なコンテンツ配信を ~アセットバンドルの未来と開発ロードマップ【Unite 2017 Tokyo】もっと気軽に、動的なコンテンツ配信を ~アセットバンドルの未来と開発ロードマップ
【Unite 2017 Tokyo】もっと気軽に、動的なコンテンツ配信を ~アセットバンドルの未来と開発ロードマップUnity Technologies Japan K.K.
 
【Unite 2017 Tokyo】もっと気軽に、動的なコンテンツ配信を ~アセットバンドルの未来と開発ロードマップ
【Unite 2017 Tokyo】もっと気軽に、動的なコンテンツ配信を ~アセットバンドルの未来と開発ロードマップ【Unite 2017 Tokyo】もっと気軽に、動的なコンテンツ配信を ~アセットバンドルの未来と開発ロードマップ
【Unite 2017 Tokyo】もっと気軽に、動的なコンテンツ配信を ~アセットバンドルの未来と開発ロードマップUnite2017Tokyo
 
Async task, threads, pools, and executors oh my!
Async task, threads, pools, and executors oh my!Async task, threads, pools, and executors oh my!
Async task, threads, pools, and executors oh my!Stacy Devino
 
T2 reading 20101126
T2 reading 20101126T2 reading 20101126
T2 reading 20101126Go Tanaka
 
Websockets - DevFestX May 19, 2012
Websockets - DevFestX May 19, 2012Websockets - DevFestX May 19, 2012
Websockets - DevFestX May 19, 2012Sameer Segal
 
The 2016 Android Developer Toolbox [NANTES]
The 2016 Android Developer Toolbox [NANTES]The 2016 Android Developer Toolbox [NANTES]
The 2016 Android Developer Toolbox [NANTES]Nilhcem
 
Hybrid Apps (Native + Web) using WebKit
Hybrid Apps (Native + Web) using WebKitHybrid Apps (Native + Web) using WebKit
Hybrid Apps (Native + Web) using WebKitAriya Hidayat
 
Hybrid Apps (Native + Web) using WebKit
Hybrid Apps (Native + Web) using WebKitHybrid Apps (Native + Web) using WebKit
Hybrid Apps (Native + Web) using WebKitAriya Hidayat
 
Google Developer Fest 2010
Google Developer Fest 2010Google Developer Fest 2010
Google Developer Fest 2010Chris Ramsdale
 
Huahin Framework for Hadoop, Hadoop Conference Japan 2013 Winter
Huahin Framework for Hadoop, Hadoop Conference Japan 2013 WinterHuahin Framework for Hadoop, Hadoop Conference Japan 2013 Winter
Huahin Framework for Hadoop, Hadoop Conference Japan 2013 WinterRyu Kobayashi
 
Building Web Apps Sanely - EclipseCon 2010
Building Web Apps Sanely - EclipseCon 2010Building Web Apps Sanely - EclipseCon 2010
Building Web Apps Sanely - EclipseCon 2010Chris Ramsdale
 
Migration from vaadin 6 to vaadin 7 devoxx france 2013
Migration from vaadin 6 to vaadin 7   devoxx france 2013Migration from vaadin 6 to vaadin 7   devoxx france 2013
Migration from vaadin 6 to vaadin 7 devoxx france 2013Joonas Lehtinen
 
L2 Web App Development Guest Lecture At University of Surrey 20/11/09
L2 Web App Development Guest Lecture At University of Surrey 20/11/09L2 Web App Development Guest Lecture At University of Surrey 20/11/09
L2 Web App Development Guest Lecture At University of Surrey 20/11/09Daniel Bryant
 

Similar a Porting web mmo games to native platforms (20)

Designing a JavaFX Mobile application
Designing a JavaFX Mobile applicationDesigning a JavaFX Mobile application
Designing a JavaFX Mobile application
 
Qt & Webkit
Qt & WebkitQt & Webkit
Qt & Webkit
 
droidcon Transylvania - Kotlin Coroutines
droidcon Transylvania - Kotlin Coroutinesdroidcon Transylvania - Kotlin Coroutines
droidcon Transylvania - Kotlin Coroutines
 
Infinum Android Talks #17 - A quest for WebSockets by Zeljko Plesac
Infinum Android Talks #17 - A quest for WebSockets by Zeljko PlesacInfinum Android Talks #17 - A quest for WebSockets by Zeljko Plesac
Infinum Android Talks #17 - A quest for WebSockets by Zeljko Plesac
 
Hybrid App using WordPress
Hybrid App using WordPressHybrid App using WordPress
Hybrid App using WordPress
 
【Unite 2017 Tokyo】もっと気軽に、動的なコンテンツ配信を ~アセットバンドルの未来と開発ロードマップ
【Unite 2017 Tokyo】もっと気軽に、動的なコンテンツ配信を ~アセットバンドルの未来と開発ロードマップ【Unite 2017 Tokyo】もっと気軽に、動的なコンテンツ配信を ~アセットバンドルの未来と開発ロードマップ
【Unite 2017 Tokyo】もっと気軽に、動的なコンテンツ配信を ~アセットバンドルの未来と開発ロードマップ
 
【Unite 2017 Tokyo】もっと気軽に、動的なコンテンツ配信を ~アセットバンドルの未来と開発ロードマップ
【Unite 2017 Tokyo】もっと気軽に、動的なコンテンツ配信を ~アセットバンドルの未来と開発ロードマップ【Unite 2017 Tokyo】もっと気軽に、動的なコンテンツ配信を ~アセットバンドルの未来と開発ロードマップ
【Unite 2017 Tokyo】もっと気軽に、動的なコンテンツ配信を ~アセットバンドルの未来と開発ロードマップ
 
Async task, threads, pools, and executors oh my!
Async task, threads, pools, and executors oh my!Async task, threads, pools, and executors oh my!
Async task, threads, pools, and executors oh my!
 
T2 reading 20101126
T2 reading 20101126T2 reading 20101126
T2 reading 20101126
 
Websockets - DevFestX May 19, 2012
Websockets - DevFestX May 19, 2012Websockets - DevFestX May 19, 2012
Websockets - DevFestX May 19, 2012
 
The 2016 Android Developer Toolbox [NANTES]
The 2016 Android Developer Toolbox [NANTES]The 2016 Android Developer Toolbox [NANTES]
The 2016 Android Developer Toolbox [NANTES]
 
Hybrid Apps (Native + Web) using WebKit
Hybrid Apps (Native + Web) using WebKitHybrid Apps (Native + Web) using WebKit
Hybrid Apps (Native + Web) using WebKit
 
Hybrid Apps (Native + Web) using WebKit
Hybrid Apps (Native + Web) using WebKitHybrid Apps (Native + Web) using WebKit
Hybrid Apps (Native + Web) using WebKit
 
Google Developer Fest 2010
Google Developer Fest 2010Google Developer Fest 2010
Google Developer Fest 2010
 
To-Do App With Flutter: Step By Step Guide
To-Do App With Flutter: Step By Step GuideTo-Do App With Flutter: Step By Step Guide
To-Do App With Flutter: Step By Step Guide
 
Huahin Framework for Hadoop, Hadoop Conference Japan 2013 Winter
Huahin Framework for Hadoop, Hadoop Conference Japan 2013 WinterHuahin Framework for Hadoop, Hadoop Conference Japan 2013 Winter
Huahin Framework for Hadoop, Hadoop Conference Japan 2013 Winter
 
Spring Boot
Spring BootSpring Boot
Spring Boot
 
Building Web Apps Sanely - EclipseCon 2010
Building Web Apps Sanely - EclipseCon 2010Building Web Apps Sanely - EclipseCon 2010
Building Web Apps Sanely - EclipseCon 2010
 
Migration from vaadin 6 to vaadin 7 devoxx france 2013
Migration from vaadin 6 to vaadin 7   devoxx france 2013Migration from vaadin 6 to vaadin 7   devoxx france 2013
Migration from vaadin 6 to vaadin 7 devoxx france 2013
 
L2 Web App Development Guest Lecture At University of Surrey 20/11/09
L2 Web App Development Guest Lecture At University of Surrey 20/11/09L2 Web App Development Guest Lecture At University of Surrey 20/11/09
L2 Web App Development Guest Lecture At University of Surrey 20/11/09
 

Porting web mmo games to native platforms

  • 1. PORTING WEB MMO GAMES TO NATIVE PLATFORMS. WORKING WITH WEBVIEW Vitaliy Zasadnyy Android TechTalk, Feb 9
  • 2. PREHISTORY 7 games
  • 4. TASK ● 2 platforms ● provide custom layout ● show loading screen ● replace some features with native analogs
  • 5. WebView API Loading Content void loadUrl(String url) void loadData(String data, String mimeType, String mimeType) void postUrl(String url, byte[] postData) void reload()
  • 6. WebView API Setting the Delegate void setWebViewClient(WebViewClient client) void setWebChromeClient(WebChromeClient client)
  • 7. WebViewClient API Loading Content Callbacks void onPageStarted(WebView view, String url, Bitmap favicon) void onPageFinished(WebView view, String url) void onReceivedError(WebView view, int errorCode, String description, String failingUrl) boolean shouldOverrideUrlLoading(WebView view, String url)
  • 8. WebChromeClient API Event Callbacks boolean onJs...() void onProgressChanged(WebView view, int newProgress)
  • 9. T1: CUSTOM LAYOUT web android
  • 10. T1: CUSTOM LAYOUT first idea: custom user-agent
  • 11. T1: CUSTOM LAYOUT better idea: custom headers @Override public boolean shouldOverrideUrlLoading(WebView view, String url) { Map<String, String> extraHeaders = new HashMap<String, String>(); extraHeaders.put( EXTRA_HEADER_CLIENT_TYPE, EXTRA_HEADER_VALUE)); view.loadUrl(url, extraHeaders); load with extra header cancel request return true; }
  • 12. T1: CUSTOM LAYOUT problem 1: yourWebWiew.loadUrl("some url"); solution 1: public class YourWebView extends WebView { ... @Override public void loadUrl(String url) { // load url with extra headers } ... }
  • 13. T1: CUSTOM LAYOUT problem 2: yourWebWiew.reload(); solution 2: public class YourWebView extends WebView { ... @Override get current url public void reload() { String url = getUrl(); // load url with extra headers } ... he b est } not t
  • 14. T1: CUSTOM LAYOUT problem 3: post methods (e.g. forms) solution 3: there is no solution AOSP: Issue 9122
  • 15. T2: LOADING SCREEN ● starts at game launch ● disappears only when first page is loaded
  • 16. T2: LOADING SCREEN public class YourWebViewClient extends WebViewClient { ... @Override public void onPageStarted(WebView view, String url, Bitmap favicon) { // show loading dialog } @Override public void onPageFinished(WebView view, String url) { // hide loading dialog } lem ... rob } p
  • 17. T2: LOADING SCREEN public class YourWebViewClient extends WebViewClient { private String mStartUrl; ... @Override public void onPageStarted(WebView view, String url, Bitmap favicon) { mStartUrl = url; // show fullscreen loading dialog } @Override public void onPageFinished(WebView view, String url) { if (mStartUrl.equals(url)) // hide loading dialog else // redirect! } ixed ... f }
  • 18. T3: REPLACE SOME FEATURES public class NravoWebViewClient extends WebViewClient { @Override public boolean shouldOverrideUrlLoading(WebView view, String url) { // override behavior here } @Override public void onPageStarted(WebView view, String url, Bitmap favicon) {} @Override public void onPageFinished(WebView view, String url) { if (!mIsRedirect) { view.loadUrl("javascript: { alert("Horray!"); }"); } } }
  • 19. IF YOU'VE GOT INTERESTED NRavo games on:
  • 20. THANKS FOR YOUR ATTENTION! QUESTIONS? presentation will be available on: blog.zasadnyy.org.ua