It is important to point out that the native applications compiled by mobileFX Coconut2D Studio do not use WebView wrapping technologies; instead, apps are 100% pure native C++ compiled applications that run even on low-spec Android devices where other similar solutions wont even load.
The IDE is full of commodity and modern features such as Project Explorer, Assets Explorer, Code Editor with IntelliSence and debug tools, Debug Panels, Breakpoints Editor, Expression Evaluator, GutHub Integration, JSON Viewer, Image Browser, Properties Explorer, Texture and SpriteSheet Editor and Scene Animation Editor with Timeline, Keyframe and TimeLabel Editing.
Scene Animation Editor implements a Cross-Screen-and-Resolution design feature that spawns across design-time, compile-time and run-time in order to optimize graphics usage. At design-time the Art Director sets a fixed viewport in which Animators must place their assets. At compile-time animations are analyzed in order to derive optimal image sizes from keyframe transformations, with respect to the fixed viewport. At runtime the viewport is proportionally scaled to fit the device's screen size, and images for textures are loaded depending on their calculated optimal size. This method avoids loading images by dpi designation (ldpi, mdpi, tvdpi, hdpi, xhdpi) and ensures that optimal sized image variants are always loaded. The Cross-Screen-and-Resolution design feature also eliminates black edges around the game viewport.
A Coconut2D Project is organized at filesystem level and is partitioned in two top-level folders. A Web Folder that contains the game's assets and source code and a Native Folder that contains a set of automatically generated platform-specific projects: an XCode project for iOS, an Eclipse project of Android, and a Qt project for Mac, Windows, Linux and SteamOS ports. Those projects are generated for compatibility and export purposes and they can be compiled by Coconut2D Studio IDE alone.
By installing 3rd party compilers and SDK such as the iOS Built Environment for Windows, Android NDK, Android SDK and Apache Ant, developers can use mobileFX Coconut2D Studio as a turn-key solution for compiling, code signing and deploying IPA and APK files either directly to iOS and Android devices or to AppStores. An important note for iOS devices is that no Jailbreak is required and developers can compile targeting the latest iOS version and sign the IPA file by using their own code signing certificate.
Coconut2D SDK is a set of open source frameworks and libraries for 2D Game and App development. There were three primary objectives set when we first tried to design the SDK:
CocoScript classes are first-class-citizens with Constructor and Destructor (called by 'delete' statement). The language offers real Inheritance, Access Modifiers (public, private, protected), Static Functions, function Overloads and Polymorphism, Virtual and Abstract functions, Optional Arguments, Enums, Constants, Properties (setter and getter), explicit Numeric Types ( Integer, Float, Time), Typed Arrays, Strict Type Checking and Safety, Type Casting and many more.
A revolutionary language feature is Finite State Machine Automata Semantics (FSM) that make Game Engine development and game control loops easier to implement and maintain. With FSM semantics a Class becomes a Game Engine by simply adding a "state" modifier and along with traditional class members such as functions, properties and variables, a class can also have States. A State entity encapsulates game logic and resources that should be allocated and executed only while a Game Engine is at the present state and deallocated automatically when the engine leaves this state.
The raw power of CocoScript comes from its state-of-the-art Parser and Compiler. A unique parser feature is object pointer and reference detection that is used for generating C++ code. Parser exports an Abstract Syntax Tree (AST) structure that is fed to the compiler for code generation. The compiler processes the AST and generates Code and Debug Symbol Tables that are used by the IDE for IntelliSence Coding (code completion) and Debugging. The symbol tables are extremely detailed so that even the most complex DOT statements with array indexes and function returns can be successfully recognized, making coding extremely productive.
CocoPlayer can simulate various iOS and Android screen sizes and screen resolutions so that developers can actually see how their game would look on different devices. From within the IDE a game can also be previewed and on various HTML5 / WebGL Browsers, iOS and Android devices too.
CocoPlayer displays the Frames Per Second (fps) and Tick Interval in milliseconds so that you can identify performance issues with your game. The surface emulates a touch screen with up to five fingers simultaneously touching the screen.
CocoPlayer component is available as stand-alone executable for Windows, Linux, SteamOS and Mac platforms as Qt project, and an ActiveX COM Component for legacy programming languages. The component is also integrated in mobileFX Digital Signage and VLT Platform so that your games can run on retail shops, casinos, airports, etc.
1. First you need to download and install Coconut2D Studio IDE and a set of third party SDK and tools such as Apache Ant, Google Android SDK and NDK, iOS Build Environment for Windows, Java SDK, and C++ compilers. Next you need to define a set of environment path variables and let Coconut2D Studio IDE know where those 3rd party tools and SDK are located by editing from Tools > Options the settings.ini file.
Have a look in the installation instructions below.
2. Next you need to create and load a new CocoProject. You only need to define a project root folder and Coconut2D Studio IDE will copy the necessary project files for you. A CocoProject template along with the latest Coconut2D SDK are maintained on GitHub. You should download the latest version of the template and place it in your Coconut2D Projects Folder. Every project you start creates a Symbolic Link to the template so that your projects are automatically upgraded to the latest version of Coconut2D SDK.
3. Then you need to import game assets such as images, spritesheets, fonts and sounds in the Web Folder. You should use the SpriteSheet Editor to "cut" textures into Animation Sequences and make their images power-of-two for better texture performance. Images are grouped by name so that developers can keep track of different resolutions and sizes of the same image. Sounds should be converted to OGG and this can be done easily by right-clicking on the sounds folder and performing a batch conversion (using 3rd party tool FFMPEG).
4. Refresh Assets Explorer and start creating Animation Scenes! The process of creating an Animation Scene is extremely easy: simply drag-and-drop images and sprites from Asset Explorer to the scene, set KeyFrames, TimeLabels, Actions and define animation motion tweens. You can test your Scenes in Scene Animation Editor and once you are ready you must right-click on the scene to generate its CocoScript; that is automatically converting the entire scene and its animations to a program Class for adding your game logic on the imported graphics. In terms of Object Oriented Programming, your scene is converted into a Class inheriting CocoScene base class of the Coconut2D SDK.
5. Next you need to create your Game Engine. A game engine is a Finite State Machine Automaton that executes the main game loop of your game. Coconut2D SDK has CocoGameEngine class to inherit from. In HTML5 the game loop is implemented using a < canvas > and subsequent calls to requestAnimationFrame. In native apps the game loop is a threaded loop implemented in a Device Wrapper Class.
6. Finally, Compile and Run! The last step is to compile your game and test it in CocoPlayer, Chrome, Firefox, your iPhone / iPad and Android smartphones and tablets. If you have followed the instructions in step 1 you should be able to upload the game to your mobile phone within minutes!
Coconut 2D Studio will create a settings.ini file in your Windows Profile folder. It is important that you edit this file (Tools > Options) and define the paths of the 3rd party tools that are required.
List of 3rd party software required:
|Java JDK||Required for building Android Apps||http://www.oracle.com/technetwork/java/javase/downloads/index.html|
|Android SDK||Required for building Android Apps||http://dl.google.com/android/installer_r22.3-windows.exe|
|Android JNI||Required for building Android Apps||http://dl.google.com/android/ndk/android-ndk-r9c-windows-x86.zip|
|Apache Ant||Required for building Android Apps||http://apache.otenet.gr/dist//ant/binaries/apache-ant-1.9.3-bin.zip|
|iOS Build Environment (Win)||Required for building iOS Apps||http://www.pmbaty.com/iosbuildenv/|
|Coconut 2D Git Project||Required||https://github.com/mobileFX/Coconut2D.git|
|Beyond Compare 3||Optional||http://www.scootersoftware.com/BCompare-126.96.36.19940.exe|
settings.ini variables that you must set:
|Path_JavaSDK||The path for Java JDK root|
|Path_AndroidSDK||The path for Android SDK root|
|Path_AndroidJNI||The path for Android JDK root|
|Path_Ant||The path of Apache Ant bin|
|Path_iOSBuildEnvironment||The path of iOS Build Environment for Windows|
|Path_MyProjects||The path where your Coconut 2D Projects will be saved|
|Path_CocoProjectGit||The path where Coconut 2D Git Project is cloned on your computer|
|Path_BeyondCompareEXE||The path of Beyond Compare 3 Executable|
|Path_JavaSDK||C:\Program Files (x86)\Java\jdk1.7.0_09|
|Path_iOSBuildEnvironment||C:\Program Files (x86)\mobileFX\Coconut2D\Data Files\3rd_party\iOS Build Environment|
|Path_MyProjects||C:\Program Files (x86)\mobileFX\Coconut2D\Projects\|
|Path_CocoProjectGit||C:\Program Files (x86)\mobileFX\Coconut2D\Projects\Coco.project|
|Path_BeyondCompareEXE||C:\Program Files (x86)\Beyond Compare 3\BComp.exe|
First you will need to download and install Git Tools:
|Suggested Installation Path||C:\Program Files (x86)\Git\cmd|
|Append PATH variable||;C:\Program Files (x86)\Git\cmd|
|Windows Credential Store for Git||http://gitcredentialstore.codeplex.com|
Then download Coconut 2D SDK:
|Coconut 2D SDK Repository||https://github.com/mobileFX/Coconut2D|
|Coconut 2D SDK Git||https://github.com/mobileFX/Coconut2D.git|
|Suggested Cone Path||C:\Program Files (x86)\mobileFX\Coconut2D\Projects\Coco.project|
C:\Program Files (x86)\mobileFX\Coconut2D\Data Files\src\Coco.Project
Coconut 2D Studio can build iOS IPA files by integrating with iOS Build Environment for Windows. You can code Objective-C and C++ and compile real native iOS apps deployable on iPhone, iPod or iPad devices, signed with your iOS Developer Program ID. No jailbreak required. You can download iOS Build Environment for Windows from here:
|Suggested Installation Path||C:\Program Files (x86)\mobileFX\Coconut2D\Data Files\3rd_party\iOS Build Environment|
|Coconut 2D INI Variable||Path_iOSBuildEnvironment|
|Append PATH variable||;C:\Program Files (x86)\mobileFX\Coconut2D\Data Files\3rd_party\iOS Build Environment|
Coconut 2D Studio can build Android APK files by integrating with Android NDK and Android SDK. You can code C++ and Java and compile real native Android apps, signed with your Android Certificates. You need the following software:
|Suggested Installation Path||C:\Program Files (x86)\Java\jdk1.7.0_09|
|Coconut 2D INI Variable||Path_JavaSDK|
|Append PATH variable||;C:\Program Files (x86)\Java\jdk1.7.0_09;C:\Program Files (x86)\Java\jdk1.7.0_09\bin|
|Suggested Installation Path||C:\Android\android-sdk|
|Coconut 2D INI Variable||Path_AndroidSDK|
|Append PATH variable||;C:\Android\android-sdk\platform-tools|
|Suggested Installation Path||C:\Android\android-ndk|
|Coconut 2D INI Variable||Path_AndroidJNI|
|Append PATH variable||C:\Android\android-ndk|
|Suggested Installation Path||C:\Android\apache-ant-1.9.3|
|Coconut 2D INI Variable||Path_Ant|
|Append PATH variable||;C:\Android\apache-ant-1.9.3\bin|