Nokia Browser for Series 40

Faculty Summit 

September 28th, 2012 

Bandung 

rayrizaldy@gits.co.id

Nokia Series 40 Full Touch Faculty Summit 

Session 1: Introduction 

Session 2: UI & Screen Elements 

Session 3: Web App 

Session 4: Interaction & Input 

Session 5: Graphics & Multimedia 

Session 6: Network & Location 

Session 7: Common Problems & Tips

Series 40 

Platform 

Introduction

Devices, New Features 

Java Runtime 2.0 

Tools, LWUIT, Tool Tips

› SDK 2.0 

› SDK 1.1 

› Touch-‐and-‐type 

Device Family 

› Non-‐touch 

› S40 6th Edition FP1 

› S40 6th Edition 

› S40 5th Edition Fp1 

› ...

› Full Screen Menus 

› Keyboard check 


Platform: New 

and Enhanced 

Features 

› Back button 

› Category bar 

› Status bar 

› Header bar 

› Forms and text input

› Full screen and commands 

menu 



and Enhanced 

Features 

› Badge API 

› Theming 

› Pinch gesture 

› Multi-‐touch 

› Fixed and dynamic 

orientation

› Font STYLE_LIGHT 



and Enhanced 

Features 

› VideoDecode control 

› Maps new features 

› Locale listener 

› Using new sensors 

› Additional system properties

Asha 305, 2.5G, Dual SIM, Resistive Touch

Asha 306, 2.5G, WLAN, Resistive Touch

Asha 311, WLAN, 3G, Capacitive Touch

(Device View Video) 

Asha 305, Asha 311

Series 40 Phones 

developer.nokia.com/Devices 

Filter by Series 40 Edition or 

Java Runtime version (new phones)

Series 40 & Java Runtime 

Java Runtime Series 40 Version Phones 

2.0.0 Series 40 ... 

1.1.0 Series 40 Asha 200, 201, 302, 303 

1.0.0 Series 40 Asha 202, 203, C2-00, C2-02, C2-03, C2-05, C2-06, 

X2-02, X2-05 

N/A Series 40 6th Edition, FP 1 Asha 300, C3-01, X3-02 

N/A Series 40 6th Edition C2-01, C3-00, X2-00, X2-01, 6303i, 7230, 6350, 6750, 

3720, ... 

N/A Series 40 6th Edition Lite C1-01, C1-02 

N/A Series 40 5th Edition, FP1 2690, 3208, 6600i, 2730, 2700, 6208, 6600, 8800, ... 

N/A Series 40 5th Edition, FP1 Lite 2220, 2720, 2320, 2330, 5000... 

N/A Series 40 5th Edition 3610, 6263, 6555, 7500, 6267

CLDC MIDP 248 

MSA 

185 

JTWI 

75 

File 

82 

BT 

135 

Media 

172 

Web 

RPC 

172 

Web 

XML 

177 

SATS 

AAPD 

U 

177 

SATS 

ACRY 

PT 

2.0.0 1.1 2.1 1.1 - 1.0 1.1 1.2 1.0 1.0 1.0 1.0 1.0 1.1 2.0 1.0 1.1 1.1 1.1 1.1 1.0 1.6 2.0 

179 

Locati 

on 

184 

3D 

205 

Mess 

aging 

211 

Conte 

nt 

226 

SVG 

234 

Audio 

3D 

234 

Came 

ra 

234 

Music 

256 

Senso 

r 

Nokia 

UI 

IAP 

1.1.0 - - 1.1 1.0 

1.0.0 - - 1.1b - 

S40 

6th, 

FP1 


6th 


6th 

Lite 


5th 

FP1 


5th 

FP1 L 


5th 

- - 1.1b - 

√ - √ - 1.1 - 

- √ - - - - - - - 

√ - 1.1 - √ 1.0 - 1.0 - - 

- √ - - - - - - - - - - - - 

√ - 1.1 1.0 1.0 - 1.1 - √ 1.0 - 1.0 - -

(HelloWorld Video)

Screen 

Elements

Full Touch Elements for a Better UI 

Virtual Keypad 

Category Bar 

Icon Command

Virtual 

Keyboard 

› Multi-‐tap or QWERTY 

› Portrait mode 

› System property tells virtual or 

physical keyboard type 

› Control screen resize events 

› Custom keyboards 

› KeyboardVisibilityListener 

› Great UX: You can open and 

close the keyboard for the user

› Check not null on 

System.getProperty( 

"com.nokia.mid.ui.multipoin 

ttouch.version") 

Multi-‐Touch 

› Implement 

MultipointTouchListener to 

receive an array of pointer 

IDs 

› Minimum is 2 point touch 

support

› Receive callbacks as the 

phone rotates on 2 axes 

-‐90 pitch 

Accelerometers 

-‐180 

roll 

-‐180 

90

› Nokia-‐MIDlet-‐App-‐Orientation: 

portrait 

› Default behaviour 

Screen 

Orientation 


landscape 


manual 

› You must listen for change 

events. You can then choose if 

and how to respond. 

› This affects virtual keyboard, etc

› TAP, LONG_PRESS, 

LONG_PRESS_REPEATED, 

DRAG, DROP, FLICK 

Gestures 

› New mulit-‐point gesture: 

PINCH 

› Custom: Notification on 

Gesture 

RECOGNITION_START and 

RECOGNITION_STOP 

› Start position, distance, speed 

and direction as needed

Frame 

Animation 

› Receive callbacks to scroll 

naturally 

› Low, medium, and high 

friction 

› Links directly to Gestures for 

easy use

› Translucent drawing 

Procedural 

Graphics 

› Any size text fonts 

› New font: Light

Location 

› S40 is all Network-‐based 

› Very fast 

› Low power 

› GPS can be a power hog 

› Approximate 

› Error radius is displayed 

› Smaller error in 3G networks 

› No turn-‐by-‐turn navigation 

› Uses a little bit of net data

› One method lets you choose 

› Offline CellID 

› Online CellID and/or WLAN 

Nokia 

LocationUtil 

› Network-‐assisted GPS (S60) 

› Standalone GPS (S60) 

› Replaces the odd and painful 

LocationProvider.getInstance() 

in the JSR-‐179

› Map Application in the 

phone 

› Offline maps if loaded 

› Own Map Application 

› Network-‐based maps only 

› Location-‐based lookup of 

street address 

› Find route 

› Overlay pointer on the map

Tools for Series 40 

Web Apps 

» Nokia Web Tools 1.5 

» Eclipse Based (Aptana Studio) web 

development environment customized by 

Nokia for Series 40 Web apps 

» Includes templates, libraries, code snippets, 

simulator, debugger, deployment options 

unique to Series 40 Web Apps development 

» Bluetooth Launcher 1.5 for on-device 

deployment

Nokia Browser for Series 40 

» Unique proxy browser with server side JavaScript / Compression engine for Series 40 

» Engine that made Series 40 Web Apps possible, because most Series 40 devices do not have 

enough CPU/RAM to run a full WebKit based web browser 

» Nokia Browser Proxy hosts the Web App client, and acts as a proxy between the Nokia Browser 

Client and the Web App server, so can be described as ”Cloud-Assisted Web Runtime” 

» Takes web app development for lower-end devices to a whole new level!

Nokia Browser for Series 40 

» Nokia Browser main features: 

– JavaScript runs on Nokia Browser Proxy server side 

– Application content compressed before sending to the client 

– CSS minimized, images compressed, partial HTML updates whenever possible 

» Current Nokia Browser main constraints: 

– HTML 4.01 with CSS 2.0 mobile profile (selected parts of CSS 3 also available) 

– No device API access, no home screen widgets

Tools

Java Tool Setup: Advanced User Notes 

» Emulator 

– Latest JDK 7, 32 bit only (No matter if you have 64 bit Windows) 

» NetBeans 7.1 

– Install “All” package else Oracle’s J2ME does not integrate properly 

» Run NetBeans one time as “Administrator” after Nokia Java SDK install 

– This integrates SDK docs so you can press ALT F1

SDKs 

www.developer.nokia.com/Develop/Java/Tools/Series_40_platform_SDKs/

It is important to get the “All” 

edition of Netbeans 

Otherwise, the Oracle J2ME 

Profiler will not work correctly

LWUIT for Nokia Series 40 

http://projects.developer.nokia.com/LWUIT_for_Series_40

LWUIT 

Transitions 

Video 

» Lets see the original LWUIT 1.5 next to the 

Nokia-‐optimized version 

» Device used: Nokia X3 

» Application used for the comparison: 

LWUITDemo 

› Comes with the LWUIT package 

» Nokia LWUIT on the left, original LWUIT 

on the right

Tool Tips

Tool Tips 

» Reference problems when importing examples 

– Project Properties → Platform → 

Nokia SDK 2.0 for Java 

– Select (at least) all required optional packages 

» Emulator 

– Keep emulator running all the time 

– App doesn’t launch on first deployment after emulator boot 

→ click “Run” (F6) again 

– Error “Supportive File – Nothing to display” 

→ click “Run” (F6) again 

– Proxy

Tool Tips 

» Phone 

– Run Nokia Suite and connect phone 

– Project Properties → Deploying → Method: Nokia Terminal 

connected ... 

– On phone: app either at end of the menu or in Files → My 

Apps 

– Best to un-install app from phone before deploying again 

– On-Device-Debugger doesn’t support new Touch APIs yet

Tool Tips 

» App not deployed? 

– Make sure Nokia Suite has connection to phone 

– Check if deployment method set in project properties! 

No deployment done 

(not selected in project properties) 

Deployment successful

Tool Tips 

» App not deployed? 

– Make sure Nokia Suite has connection to phone 

– Check if deployment method set in project properties! 

No deployment done 

(not selected in project properties) 

Deployment successful

Code Examples 

» Online 

– http://bit.ly/JavaCodeExamples 

» Included in Help 

– Emulator → Help → MIDlet Samples 

» Maps & Analytics 

– C:\Nokia\devices\Nokia_SDK_2_0_Java 

\plugins

Remote Device Access 

Enabling Testing on Real Devices 

Free for Nokia Developer Users 

Go to RDA: 

http://www.developer.nokia.com/Devices/Remote_device_access/ 

Watch introductory video: 

http://www.developer.nokia.com/Develop/Java/Videos/ 

http://www.youtube.com/watch?v=F1odix8k_fg

New Features: 

Key Points 

1) Full touch is a logical 

extension-‐ apps still run 

2) Many new features, so take 

advantage of them-‐optimize 

and improve 

1. New UI elements 

2. Virtual keyboard control 

3. Accelerometers 

4. Multi-‐touch 

3) Install the right tools in the 

right order to save time

Nokia Browser for Series 40

You also want an ePaper? Increase the reach of your titles

Delete template?

Save as template?