App development and implementation of XPLATFORM Hybrid

UX-Studio does not provide the actual development methods for creating apps. Therefore, apps need to be made using the development environment provided by Android and iOS, and you can follow the general app development procedures.

App development environment configuration

Android

Apps for Android are created using Eclipse and Android SDK, and the method is identical with the method for creating general apps. The Google Android webpage with the information on how to install and download Eclipse and Android SDK is http://developer.android.com/sdk/installing.html. Since the renewal cycle of the newest Eclipse and Android SDK is very fast, you need to install the latest development environment from the website. The detailed contents are altered whenever the latest version of Eclipse/ADT/ Android SDK is updated, so please refer to the related web page that deals with the relevant information.

The basic implementation of Android development environment is as the following.

  1. Eclipse installation

  2. ADT Plugin installation

  3. Android SDK installation

iOS

iOS apps are developed using XCode and iOS SDK, and the method is the same as that of making general apps. XCode, iOS SDK can only run on a Mac, so a Mac that can load the latest version of OS X is needed. To run on terminals, an Apple developer account is required.

iOS development environment basically is formed of the following procedures and the detailed information may change every time XCode/ iOS SDK version is updated, so please refer to the relevant part in the information webpage.
(reference : http://developer.apple.com/devcenter/ios/index.action )

  1. Creating Apple Developers account

For iOS, testing is only possible on the terminals that are registered with a developer’s account. Therefore unlike Android, a developer’s account is required not only for distributing but also for developing. The Apple developer’s account for developing iOS App can be created in the website below.
http://developer.apple.com/devcenter/ios/index.action
After creating an account, you need to create an authentication certificate (for developing/distributing), register the testing terminal, create APP ID and create provisioning (for developing/distributing).
After logging into the account created in the website above, you can go into the iOS Provisioning portal menu in iOS Developer Program on the right side, to check the necessary categories for setting and create them.

  1. Install XCode for development environment

XCode can be downloaded/installed through the Apple developer webpage or mac AppStore. In the OS X Snow Leopard of mac App store is loaded from default. You can download and install XCode from here.

If you do not have the Mac App Store as the picture shown above, you must update OS X as the latest version. Updating OD X software can be done by clickking on the Apple logo button on the upper left side of the screen.

App project development

Develop app project in the app development tool appropriate for each OS.

Android

In Eclipse, develop App project for Androids according to the following procedures

  1. Generate the app project.

  1. Add to the project so that it refers to XPLATFORM.jar to reference.

  1. Add the Resource.

    Add the necessary resources for supporting XPLATFORM Hybrid to the project as the following. hybrid_typedef.xml created in UX-Studio must be added as well.

  1. Modify too enable the inheritance of the generated activity, and insert configuration image and the code designating hybrid_typedef.xml.

package com.tobesoft.TestTobe;

// [XPLATFORM] XPLATFORM Main Activity import
import com.tobesoft.xplatform.loader.Main;
import android.app.Activity;
import android.os.Bundle;

// [XPLATFORM] XPLATFORM Main Activity Inheritance
public class TestTobeActivity extends Main/*Activity*/ {
	/** Called when the activity is first created. */
	@Override
	public void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
	}
}

  1. Organize Android Manifest

    To configure the activity occurring in XPLATFORM Hybrid and receiver, put in the information below in the tag of Android Manifest Application.

<application android:icon="@drawable/ic_launcher" 
	android:label="@string/app_name" 
	android:hardwareAccelerated="true">
	<activity android:label="@string/app_name" 
		android:name=".TestTobeActivity" 
		android:configChanges="keyboardHidden|orientation" 
		android:screenOrientation="sensor">
	<activity android:name="com.tobesoft.xplatform.deviceAPI.CameraListener" 	
		android:screenOrientation="landscape">
		<intent-filter>
			<category android:name="android.intent.category.LAUNCHER" />
		</intent-filter>
	</activity>

	<activity android:name="com.tobesoft.xplatform.deviceAPI.SmsSend" >
		<intent-filter>
			<category android:name="android.intent.category.LAUNCHER" />
		</intent-filter>
	</activity>

	<activity android:name="com.tobesoft.xplatform.deviceAPI.FileDialogActivity" 
		android:screenOrientation="sensor">
		<intent-filter>
			<category android:name="android.intent.category.LAUNCHER" />
		</intent-filter>
	</activity>

	<receiver android:name="com.tobesoft.xplatform.deviceAPI.SmsRecv"> 
		<intent-filter> 
			<action android:name="android.provider.Telephony.SMS_RECEIVED" /> 
		</intent-filter> 
	</receiver>

	<receiver android:name="com.tobesoft.xplatform.deviceAPI.SmsRecv"> 
		<intent-filter> 
			<action android:name="android.provider.Telephony.WAP_PUSH_RECEIVED" /> 
			<data android:mimeType="application/vnd.wap.mms-message" />
		</intent-filter> 
	</receiver>

  1. To use the MobileAPI offered by XPLATFORM Hybrid, add the permission below to Android Manifest.

<uses-permission android:name="android.permission.CAMERA" /> 
<uses-permission android:name="android.permission.VIBRATE" /> 
<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" /> 
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" /> <uses-permission android:name="android.permission.ACCESS_LOCATION_EXTRA_COMMANDS" /> 
<uses-permission android:name="android.permission.READ_PHONE_STATE" /> 
<uses-permission android:name="android.permission.INTERNET" /> 
<uses-permission android:name="android.permission.SEND_SMS" /> 
<uses-permission android:name="android.permission.RECEIVE_SMS" /> 
<uses-permission android:name="android.permission.RECORD_AUDIO" /> 
<uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" /> 
<uses-permission android:name="android.permission.READ_CONTACTS" /> 
<uses-permission android:name="android.permission.WRITE_CONTACTS" /> 
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" /> 
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" /> 
<uses-permission android:name="android.permission.CALL_PHONE" /> 
<uses-permission android:name="android.permission.READ_SMS" /> 
<uses-permission android:name="android.permission.WRITE_SMS" /> 
<uses-permission android:name="android.permission.BROADCAST_WAP_PUSH" /> 
<uses-feature android:name="android.hardware.camera" />
<uses-feature android:name="android.hardware.camera.autofocus" />
<uses-permission android:name="android.permission.ACCESS_WIFI_STATE" /> 
<uses-permission android:name="android.permission.RESTART_PACKAGES" />
<uses-permission android:name="android.permission.UPDATE_DEVICE_STATS" /> 
<uses-permission android:name="android.permission.CHANGE_WIFI_STATE" /> 
<uses-permission android:name="android.permission.CHANGE_NETWORK_STATE" /> 
<uses-permission android:name="android.permission.GET_TASKS" />

iOS

Follow the procedures below to develop app projects for iOS in XCode.

  1. Generate app project.

  1. Add on to project so that XPLATFORM.framework will be referred to. (Also add IOS framework)

If all the frameworks are added then it will appear as below.

  1. To specify the installation image, add an image resource.

The following are the detailed information of installation image. .

When you select the project from the project navigator, a summary tab will appear and find the Launch Images category to designate the configuration image as the image below. After designation, the image that will start by default is automatically created and since it is automatically created and managed in XCode, do not change its name.

The following are the detailed information of the default images that are applied automatically.

  1. Add the hybrid_typedex.xml file, which was generated in UX-Studio, to the data folder, right under the project folder. The hybrid_typedex.xml file consists of the below codes. (Added in October 15)

<?xml version="1.0" encoding="utf-8"?>
<TypeDefinition>
<Update>
<Item systemtype="XP-HybridApp" url="http://127.0.0.1:8080/hybridtest">
<Os type="default" url="./HBDeviceTest">
	<Device type="all" url="./">
		<Resource type="Theme" file="default.zip" targetpath="/_theme_"/>
		<Resource type="Engine" file="Component.zip" targetpath="/" />
		<Resource type="Engine" file="Run.zip" targetpath="/" />
		<Resource type="File" file="Arcive00.xzip" targetpath="/" />
	</Device>
</Os>
<!--
<Os type="Android" url="./Android">
	<Device type="default" url="./">
		<Resource type="Theme" file="default.zip" targetpath="/" />
	</Device>
</Os>
<Os type="IPhone" url="./IPhone">
	<Device type="default" url="./">
		<Resource type="Theme" file="default.zip" targetpath="/" />
	</Device>
</Os>
-->
</Item>
</Update>
</TypeDefinition>

Choose the project, select [Add files to (project)] from the context menu, and make the project refer to the data folder.

  1. Go through the following process to set error messages. (Added in October 15)

Add error messages to the Localizable.strings files of each language. Those files will be provided in the form of UTF-8-encoded text files while being located in the path [Engine > errordefile > iOS], in the XPLATFORM module.

  1. Modify so that the generated AppDelegate will inherit the AppDelegate of XPLATFORM.

    Modify AppDelegate.h / m files as the following so that XPLATFORM.framework can operate.

#import <UIKit/UIKit.h>
#import <XPlatform/XPlatformAppDelegate.h> // [XPLATFORM]

@interface AppDelegate : XPlatformAppDelegate <UIApplicationDelegate>
// Delete all the code inside the class.
@end
#import "AppDelegate.h"

@implementation AppDelegate
// Delete all the code inside the class.
@end
#import <UIKit/UIKit.h>
#import "AppDelegate.h"

int main(int argc, char *argv[])
{
	NSAutoreleasePool *pool = [[NSAutoreleasePool alloc] init];
	int retVal = UIApplicationMain(argc, argv, nil, NSStringFromClass([AppDelegate class]));
	[pool release];
	return retVal;
}

  1. Organize the setting of the project.

    Due to the iOS framework of XPLATFORM, you need to add the following settings to Build Settings.

Creating and running the apps

Android

  1. Connect the Android terminal to PC with a USB.

  2. Execute Run in Eclipse. The Run of Eclipse is a function that enables APK generation and execution.

You can also execution by using a pop-up menu as shown below.

iOS

  1. Connect the iOS device to a Mac using a USB.

  2. Execute Run in XCode. Run o Xcode is a function which allows the creation and installation to terminal of APP and even execution.