Create a Worklight hybrid application for the portal

We can create a hybrid application to add native device capabilities to the portal with IBM Worklight .

To test an iPhone and iPad hybrid application, use a Mac with Xcode installed. To test an Android hybrid application, create an Android Virtual Device.

1. In the Worklight Eclipse development environment, create the Worklight Hybrid Application...
   New | Worklight Project

2. In the Name field, name the project.

   In this example, name the project WLPortal.

   In the Project Templates field, select Hybrid Application, which is the default.

3. Click Next.

4. In the Application Name field, name your application.

   In this example, name the application WLPortalApp.

   Check the JavaScript libraries that we want the application to use if any

5. Click Finish

   The project and application artifacts are created. In the Project Explorer, we can see the folder...

   project_name\apps\app_name

   Your application descriptor, application-descriptor.xml, is in the Application Descriptor Editor.

6. In application-descriptor.xml, we can change the basic settings of the application, such as the application id, displayName, description, and author details.

7. In application-descriptor.xml, change mainFile to the HCL WebSphere Portal URL with the uri=wl:id parameter appended to the end. For example...
   enter http://localhost:port/wps/portal?uri=wl:id:WLPortalApp

   Replace localhost with the host name and WLPortalApp with our application name.

8. In the common/images folder, replace the icon.png and thumbnail.png files with the custom images that we want for the application. The thumbnailImage shows the icons used for the application are in the common/images folder.

9. Save the changes.

10. Create a Worklight environment to build the native part of the hybrid application. Right-click the folder...
    project_name\apps\app_name

    ...and then select...

    New | Worklight Environment

11. In the New Worklight Environment dialog, select any native environments that we want the application to support, such as iPhone, iPad, and Android phones and tablets.

12. Click Finish.

    Your Project Explorer window is updated with a native application in a folder named...

    project_name\app_name\platform

    In this example, the folder for Android would be...

    WLPortal\WLPortalApp\Android

    For iOS, it would be either...

    WLPortal\WLPortalApp\iphone
    WLPortal\WLPortalApp\ipad

    Worklight manages the lifecycle of these folders. When the web application you initially created in the project is built and deployed, the native applications are overwritten with any application changes.

13. To test the application, right-click...
    project_name\apps\app_name

    ...then select...

    Run As | Build All and Deploy

    To test an Android hybrid application, create an Android Virtual Device, then, right-click on the native Android application folder, and select...

    Run As | Android Application

    The native Android application is a peer to the project. In this example, there is a project named...

    WLPortalWLPortalAppAndroid

    To test an iPhone and iPad hybrid application, use a Mac with Xcode installed. Right-click on either the native iPhone or iPad application folder...

    project_name\apps\app_name\iphone
    project_name\apps\app_name\ipad

    ...and select...

    Run As | Xcode | emulator

Parent Integrate with IBM Worklight