IBM Worklight Versions 6.0.0 and 5.0.6 Support Apple iOS 7

Product documentation


Abstract

IBM Worklight has made updates to versions 6.0 and 5.0.6 to support Apple iOS 7. This article explains some unique behavior in iOS 7 and provides information about how to address the behavior to create optimal applications.

Content

Option to Limit Fixes to Worklight Studio Only

The fixes listed in the next section apply to both Worklight Server and Worklight Studio. If there are challenges with rolling out the latest fixes for Worklight Server in a production deployment, there are still opportunities to get iOS 7 support. Worklight Studio is required and has the ability to build iOS 7-compatible applications. The fixes are only required on Worklight Server if the applications are being built by using the ANT Java™ archive (JAR) files that are provided as part of Worklight Server. The IBM Worklight user documentation has more information about deploying IBM Worklight applications to test and product environments.

Ensure the Proper Fixes are Installed

Updates are needed to enable iOS 7 support. The required fixes can be found on IBM Fix Central and should be applied to Worklight Studio to ensure the proper level of support.

Note: IBM Worklight and IBM Mobile Foundation supports iOS 7 beginning with Version 5.0.6 Fix Pack 1 and its latest interim fixes and Version 6.0.0 Fix Pack 1 and its latest interim fixes. It is not supported by any versions prior to these product updates.

Product Version Required Fixes
IBM Worklight Consumer Edition 5.0.6
  1. Install Version 5.0.6 Fix Pack 1
  2. Install the latest interim fix
IBM Worklight Enterprise Edition 5.0.6
  1. Install Version 5.0.6 Fix Pack 1
  2. Install the latest interim fix
IBM Mobile Foundation Consumer Edition 5.0.6
  1. Install Version 5.0.6 Fix Pack 1
  2. Install the latest interim fix
IBM Mobile Foundation Enterprise Edition 5.0.6
  1. Install Version 5.0.6 Fix Pack 1
  2. Install the latest interim fix
IBM Worklight Developer Edition
5.0.6
  1. Install the latest version (archive file download only)
IBM Worklight Consumer Edition 6.0.0
  1. Install Version 6.0.0 Fix Pack 1
  2. Install the latest interim fix
IBM Worklight Enterprise Edition 6.0.0
  1. Install Version 6.0.0 Fix Pack 1
  2. Install the latest interim fix
IBM Mobile Foundation Consumer Edition 6.0.0
  1. Install Version 6.0.0 Fix Pack 1
  2. Install the latest interim fix
IBM Mobile Foundation Enterprise Edition 6.0.0
  1. Install Version 6.0.0 Fix Pack 1
  2. Install the latest interim fix
IBM Worklight Developer Edition 6.0.0
  1. Install the latest version (archive file download only)

Develop with Xcode 5

To build and deploy applications for iOS 7, make sure that you are using Xcode 5 on Mac OS X Mountain Lion 10.8 or later. You can find Xcode on the Apple web site at the following location: https://developer.apple.com/xcode/.

Complete the following steps to update your existing iOS projects to work with iOS 7. The instructions reference "iphone", but they apply to "ipad" as well.
  1. Close Xcode.

  2. Open the Worklight project in Worklight Studio.

  3. Navigate to apps/<name>/iphone directory.

  4. Back up the native folder if you have customized content that you might need to retrieve later.

  5. Delete the native folder.

  6. Right-click the application and select Run As > Build All and Deploy. This action re-creates the native directory that you previously deleted.

  7. Right-click the iphone directory and select Run As > Xcode project.

  8. When Xcode opens, select Product > Clean. It is important to complete this action before building the project. Otherwise, errors occur that are related to updated files.

  9. Select Product > Build.

The application should now run successfully on the iOS7 simulator.

Update Icons

Apple made changes to their requirements regarding icons for your application. Follow the guidelines that are provided by Apple at https://ibm.biz/BdDsr9. Note: These guidelines require an Apple Developer Account. Without icon updates, Xcode might present warnings.

Handle Status Bar Design Changes

iOS 7 features a different overall design. For more information, see https://ibm.biz/BdDsjF. If you use the built-in widgets that are provided by IBM Worklight, your project should automatically use the newer design. However, it is your responsibility to adapt the rest of your design.

One example is the way the status bar is shown in iOS 7. Your application is now full screen, by default, with the iOS status bar floating transparently above your application as is shown in the following screen capture.



This change means that you must design your application to provide space for the status bar items. To make the transition easier, IBM Worklight V6.0.0 Fix Pack 1 comes with extra cascading style sheet (CSS) and JavaScript™ to provide a temporary HTML-based status bar that mimics iOS 7. The application detects if it is running on iOS 7 or later. If it is running on iOS 7 or later, it executes a JavaScript when the page is ready and completes the following actions:
  1. Adds a ".wl_ios7" class to the <body> element, which adds some top padding

  2. Inserts a div element with the #wl_ios7bar ID with a fixed position of 0



You can override those changes in your CSS to better match your design. For example, if your design already includes a fixed header title bar, the Worklight status bar might not display or might conflict with your design. Instead, you should adapt your existing header bar to better fit the iOS 7 design by using the wl_ios7 class or by using your own mechanisms.

You can also completely disable this HTML-based status bar. To disable it, set  showIOS7StatusBar to false in your initOptions.js file, which is located in the apps/<name>/common/js directory of your project. Note: IBM Worklight does not detect Apple iOS 7. In addition, IBM Worklight does not add any class or HTML to your code. You can then use Cordova Device API to detect iOS 7 and adapt your design.

Note: If you use a dark background for the HTML status bar, you need to make the font of the status bar white by editing the plist file. For example: UIViewControllerBasedStatusBarAppearance = NO, UIStatusBarStyle = UIStatusBarStyleLightContent. Alternatively, you can use one of the suggestions in How to change Status Bar text color in iOS 7.

Enable the Application Center Client

Complete the following steps to enable your Application Center Client to run on iOS 7:
  1. Import the App Center project into Eclipse as the documentation states.

  2. Use the Worklight Studio wizard to create another Worklight project and add an iPhone environment.

  3. Copy the apps/<name>/iphone/native/WorklightSDK/libWorklightStaticLibProject.a file to the App Center project. Overlay the existing file by using the same name.

  4. Add the following code in the CDVMainViewController Worklight-generated class (CDVMainViewController.m). This code handles the iOS 7 status bar design change.

    - (UIStatusBarStyle)preferredStatusBarStyle
    {
      return UIStatusBarStyleLightContent;
    }

    - (void)viewWillAppear:(BOOL)animated
    {
    CGFloat version = [[UIDevice currentDevice].systemVersion floatValue];
      if (version >= 7) {
         // iOS 7 or above
         CGRect oldBounds = [self.view bounds];
         CGRect newViewBounds = CGRectMake( 0, -10, oldBounds.size.width,
            oldBounds.size.height-20 );
         CGRect newWebViewBounds = CGRectMake( 0, -20, oldBounds.size.width,
            oldBounds.size.height-40 );
         UIColor *headerColor =
            [UIColor colorWithRed:0.0f green:0.0f blue:0.0f alpha:1.0f];
         [self.view setBackgroundColor:headerColor];
         [self.view setBounds:newViewBounds];
         [self.webView setBounds:newWebViewBounds];
      }
      [super viewWillAppear:animated];
    }


  5. (Worklight Application Center V5.0.6 only): Disable the CSS class that is doing the automatic handling of the status bar design change. Edit the /IBMAppCenter/apps/AppCenter/iphone/native/www/default/worklight/worklight.css file and make the following changes:

    Replace the following code:

    #wl_ios7bar{
      background-color: white;
      height: 15pt;
      position: fixed;
      top: 0;
      width:100%;
    }
    body.wl_ios7{
      padding-top: 15pt;
    }


    Use the following code instead:

    #wl_ios7bar{ display:none !important; }

    Note: This step is not necessary for Worklight Application Center V6.0 and later.

Related information

Download V6.0.0 Fix Pack 1

Cross reference information
Segment Product Component Platform Version Edition
Mobile- Speech and Enterprise Access IBM Mobile Foundation Device Runtime Apple iOS 6.0.0.1, 5.0.6.1 Consumer, Enterprise

Rate this page:

(0 users)Average rating

Add comments

Document information


More support for:

IBM Worklight
Device Runtime

Software version:

5.0.6.1, 6.0.0.1

Operating system(s):

Apple iOS

Software edition:

Consumer, Enterprise

Reference #:

7039574

Modified date:

2013-10-02

Translate my page

Machine Translation

Content navigation