Please note that as of October 24, 2014, the Nokia Developer Wiki will no longer be accepting user contributions, including new entries, edits and comments, as we begin transitioning to our new home, in the Windows Phone Development Wiki. We plan to move over the majority of the existing entries. Thanks for all your past and future contributions.

Web Runtime widgets in Nokia Symbian^3 devices

From Wiki
Jump to: navigation, search
Article Metadata
Platform(s): Symbian^3, prior to Anna and Belle
Device(s): Nokia N8-00, Nokia E7-00
Created: isalento (17 May 2010)
Last edited: hamishwillee (13 May 2013)

Featured Article
13 Jun

This article describes the new features, which may effect on how Web Runtime (WRT) widgets are displayed on the Nokia N8 (based on Symbian^3 platform).


Detecting Nokia Symbian^3 devices (Nokia N8)

Browser/Web Runtime 7.2

Nokia N8 will ship with 7.2 version of the S60 Browser and WRT.

Example User Agent

"Mozilla/5.0 (Symbian/3; Series60/5.2 NokiaN8-00/010.017 ; Profile/MIDP-2.1 Configuration/CLDC-1.1 ) AppleWebKit/525 (KHTML, like Gecko) Version/3.0 BrowserNG/ 3gpp-gba"

Emphasized parts are variables denoting device hardware variant, firmware version and web browser version.

Detecting WRT version in a widget

Runtime version can be checked in the widget side by querying “widget.wrt.version “ (returns BrowserNG/7.2.3).

Detecting platform version

Platform version can be detected by using system information API

var so = device.getServiceObject("Service.SysInfo","ISysInfo");
var criteria = {
Entity: "Device",
Key: "PlatformVersion"
var res = so.ISysInfo.GetInfo(criteria);
var platform = res.ReturnValue;
alert(platform.MajorVersion +"."+ platform.MinorVersion);

The code above prompts 5.2 for the Nokia N8 and 5.0 for the Nokia S60 5th Edition devices (like Nokia N97).

Home Screen Widgets

Working with multi page home screen

The Nokia N8 has three home screen pages that can hold up to 18 widgets, six on each page.

N8 Image1.png

Homescreen widget guidelines should be followed when implementing home screen enabled widgets.

Detecting if your widget is shown in the active home screen can be done by listening to two properties:

  • Screen size
  • Widget visibility

Screen size is the main trigger that tells the widget to go to the mini view mode.

//Miniview treshold in px
// Listener for the view mode changes
window.onresize = checkViewMode;
function checkViewMode(){
if (window.innerHeight < MINIVIEW_TRESHOLD) {
}else {

In addition widget visibility can be monitored to detect, if your widget is shown on currently active home screen page.

widget.onshow is called when your widget is visible on active Home Screen page or brought to foreground.

Respectively widget.onhide is called when page is switched or your widget is sent to background.

Home screen dimensions

WRT Widget Mini view dimensions are the same as on the Nokia N97 / N97-mini:

82 x 312px

N8 Image2.png

Loading Indicators

Loading the widget for the first time

When loading a home screen widget, its icon and name are shown together with loading indicator offered by the platform. Developers cannot customize this behavior not does this require any code changes.

N8 Image3.png

  • Widget icon is the same as that is packed with the widget. It is good to pay extra attention to scalability of the graphics when designing the widget icon as the same image will be used in the device menus and start-up graphics. The recommended size of a widget's icon is 80x80 pixel and it should be in PNG format. SVG icons are not supported. (1.)
  • Widget name is the same as shown in content list and it is defined in the info.plist by using the DisplayName key. (2.)
  • Loading indicator is offered by the platform. (2.)

The loading indicator is positioned as follows:

  • Distance from the top: 10 px
  • Distance from the left edge: 275 px

Widget description text in the content list

The description text shown in the content list cannot be edited. It is the same for all of the WRT widgets.

N8 Image5.png

Online / offline functionality

Online / Offline functionality is one of the key features that will affect user experience. Home screen widgets that rely on periodic network updates should implement this feature. If the network is not available, all of the widgets on home screen will be informed and they are expect to react accordingly by gracefully notifying end user that widget is unable to connect to the network.

For more information, see

Layout change in landscape mode

Softkey and menu positioning in landscape mode has been changed. The new landscape layout is described in the image below. Applications designed to scale to 100% width and height of available screen estate should not be affected by this change, whereas applications using native menus or resolution specific custom layouts are most likely affected and need to redesign some parts of the UI.

N8 Image6 fix.png

Nokia Symbian^3 nHD landscape layout

  • With softkeys: 640 x 315 px
  • Full screen: 640 x 360 px

Nokia S60 5th Edition nHD landscape layout

  • With softkeys: 502 x 360 px
  • Full screen: 640 x 360 px

The location of the softkeys can be detected as described in this article:

Detecting Location of softkeys in WRT widget

JavaScript Device APIs

Platform Services 2.0

Nokia Symbian^3 devices will have built in support for Platform Services 2.0, offering JavaScript API access to following services:

  • Contacts
  • Messaging
  • Media
  • Calendar
  • System Information
  • Sensors
  • Landmarks
  • Event
  • Camera
  • GeoLocation

Platform Services 2.0 compatibility with current devices

N97 / N97 Mini support all Platform Services 2.0 features

  • N97: SW 20.0.019 and newer
  • N97 Mini – All versions

Backwards compatibility

Nokia Symbian^3 devices are compatible with widgets using Platform Services 1.0 APIs.

Other new features in Browser/WRT 7.2

Support for DOMContentLoaded event

Useful information

UI in Symbian^3

This page was last modified on 13 May 2013, at 11:04.
97 page views in the last 30 days.