When I first blogged about bringing your HTML5 games to Android I showed you how to run your HTML5 games into Android Studio in a device simulator , but now it’s time to make them run on an actual device, like my Huawei as you can see in the photo:
Well, it’s not just a matter of plugging your phone with an USB cable and select it from available devices, you will have to enable debug testing on your phone first. You won’t be able to run your own games on your Android devices until:
* Open up your device’s settings
* In settings screen scroll to the bottom and tap “About Phone”.
* At the about screen, scroll to the bottom and tap on “Build number” seven times.
Finally your phone will be enabled for debug and will be able to run the game. But it’s not over yet as we want to custom the splash screen. There are a lot of splash screens and icons available, according to the resolution your phone supports.
Look at these folders (and the path), each one contains an icon or a splash screen.
These are the files I edited and saved with Photoshop, both splash screens and icons now have been customized.
Wonder what to do with the
xml folder? It contains a file called
config.xml which will be very useful to edit some more information:
<?xmlversion='1.0' encoding='utf-8'?> <widgetid="io.cordova.hellocordova" version="0.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0"> <preferencename="loglevel" value="DEBUG" /> <featurename="Whitelist"> <paramname="android-package" value="org.apache.cordova.whitelist.WhitelistPlugin" /> <paramname="onload" value="true" /> </feature> <allow-intenthref="market:*" /> <name>Drawsum</name> <description> MathmatchgamebyEmanueleFeronato </description> <authoremail="email@example.com" href="mailto:firstname.lastname@example.org"> ApacheCordovaTeam </author> <contentsrc="index.html" /> <accessorigin="*" /> <allow-intenthref="http://*/*" /> <allow-intenthref="https://*/*" /> <allow-intenthref="tel:*" /> <allow-intenthref="sms:*" /> <allow-intenthref="mailto:*" /> <allow-intenthref="geo:*" /> </widget>
With our game running on an actual phone, next time I’ll show you how to build it and add it on the store.
From null to full HTML5 cross platform game
If you don't know where to start, then From null to full HTML5 cross platform game is the book for you.