QML & JavaScript on MeeGo: Flourish Conference 2nd Apr 2011, at UIC Chicago

by Raj Lal on Apr 02, 2011

1,617 views

Build cutting edge mobile applications using QML and JavaScript on MeeGo devices. Know how to apply some advanced graphics and animations with simple QML and see how JavaScript allows you to create a feature rich application. A tutorial with live demos targeted to beginner to intermediate Mobile developers interested in developing mobile applications on Linux based Mobile Devices. No C++ required.

Less

7 Embeds 169

http://irajeshlal.blogspot.com	151
http://irajeshlal.blogspot.co.uk	7
http://irajeshlal.blogspot.in	5
http://aakanshaindia.blogspot.com	3
http://irajeshlal.blogspot.com.br	1
http://translate.googleusercontent.com	1
http://irajeshlal.blogspot.de	1

More...

Statistics

Favorites: 1
Downloads: 28
Comments: 1
Embed Views: 169
Views on SlideShare: 1,448
Total Views: 1,617

QML & JavaScript on MeeGo: Flourish Conference 2nd Apr 2011, at UIC Chicago — Presentation Transcript

QML & JavaScript on MeeGo Rajesh Lal MeeGo Team, Nokia Silicon Valley FUN with

Tools Available Advanced Graphics & Animation Rich Mobile Apps 3 Steps for MeeGo Development ( with demo )

Mobile Apps Revenue ($ Million) http://www.gartner.com/it/page.jsp?id=1282413 4,250 6,770 29,500 (estimated) Worldwide Total Revenue

What is MeeGo is a Linux-based open source mobile operating system Targeted to mobile devices & consumer electronics

What makes MeeGo Exciting ? Fully Open Source Linux Foundation Target Multiple devices

Smart phones, Tablets, Net books,

In-Vehicle Infotainment (IVI)

SmartTV, IPTV-boxes

MeeGo V1.1 Available Today

3 Steps to FAST MeeGo Development Tools Available Advanced Graphics & Animation Rich Mobile Apps TODAY Qt Quick & QML JavaScript

Step1: Development Environment

Qt Application Framework

IDE – Qt Creator

Qt UI/GUI Designer

Qemu Emulator

Smartphone Simulator

… and we have real device

Available Today

Qt Application Framework

Integrated Development Environment Qt Creator

Qt Designer

UI Designer

GUI Designer

Simulator Simulator Storage Network Location Contacts Sensors Gallery Camera {

… and the Device N900 MeeGo

Step 2. Advanced Graphics & Animations Declarative Runtime Qt Meta Object Language(QML) Quick Designer Qt Quick

QML = Powerful Declarative Language

Creating a Game in Qt Quick Angry Developer

Cutting Edge UI

JavaScript binding

Putting it Together

Creating a Game in Qt Quick Three Parts

Demo: Angry Developer Playing Moving

Angry Developer: Missed Angry Missed

Angry Developer: Hit “Hurrah!” Happy Destroyed

QML Elements

State Change Playing Angry Happy Pig Moving Pig Destroyed

State Changes

Ball Animation Bouncing Ball Animation Throw Transition

Bouncing Ball animation

Throw Transition

QML Logic (2 Timers) Timers for Pig’s Movement Timers for Hit or Miss

Timer Pig’s Movement

Timer Hit or Miss

Step 3. Rich Mobile Apps JavaScript Expressions Import JavaScript Files RSS, XML, JSON, REST Multi Threaded JavaScript

JavaScript to build Mobile Apps QML JavaScript C++ is not Required Qt Container

JavaScript file: Clock.js

QML Binding

JavaScript to build Mobile Apps Putting it ALL Together In 5 Steps

Step1/5: Create New Application Create new Mobile Qt Application 1 Select Qt for PR1.3

Remove files

mainwindow.ui

mainwindow.h

mainwindow.cpp

2/5 Add Qt Declarative QT += declarative In Project.pro file add 2 In our case add this to NativeQMLJS.pro

3/5 Add Qt Declarative 3 In main.cpp, include QtDeclarative and add code

4/5 Add Files Add QML file , Images and JavaScript File as resources * Make sure your JavaScript file name is lowercase

5/5 Add the Binding Add the binding in QML file and call JavaScript import "clock.js" as MyClock … Text { id:txttime text: MyClock.gettime() }

Demo Angry Developer

Steps to Develop FAST on

Get Qt SDK with Qt Quick http://get.qt.nokia.com Download MeeGo http://meego.com/downloads Deploy using MADDE http://wiki.maemo.org/MADDE/QtCreator_integration_for_windows Questions Rajesh.Lal@nokia.com @rajeshlalnokia THANK YOU

QML & JavaScript on MeeGo: Flourish Conference 2nd Apr 2011, at UIC Chicago

by Raj Lal on Apr 02, 2011

Accessibility

Categories

Tags

Upload Details

Usage Rights

7 Embeds 169

Statistics

QML & JavaScript on MeeGo: Flourish Conference 2nd Apr 2011, at UIC Chicago — Presentation Transcript