25
Copyright EclipseSource Inc, all rights reserved Tabris Workshop Jordi Böhme López Johannes Eickhold Tabris iOS Tabris Android

EclipseCon Europe 2012 Tabris Workshop

Embed Size (px)

Citation preview

Page 1: EclipseCon Europe 2012 Tabris Workshop

Copyright EclipseSource Inc, all rights reserved

Tabris Workshop

Jordi Böhme López Johannes EickholdTabris iOS Tabris Android

Page 2: EclipseCon Europe 2012 Tabris Workshop

Copyright EclipseSource Inc, all rights reserved

Goals of the Workshop

● Get your HandsOnHandsOn the code!● Learn how to...

● Setup your IDE for Tabris● Write a Tabris app● Launch and test your app

http://developer.eclipsesource.com/tabris/

Page 3: EclipseCon Europe 2012 Tabris Workshop

Copyright EclipseSource Inc, all rights reserved

HandsOnHandsOn Tasks

1. Hello world (Shell & Button)

2. Dialog (JFace)

3. List (JFace TreeViewer)

4. Geolocation

5. Client Canvas

Page 4: EclipseCon Europe 2012 Tabris Workshop

Copyright EclipseSource Inc, all rights reserved

● Who has an …

● iOS device?● Android device?

● Who has an already prepared …

● Mac + Xcode?● Eclipse + Android Development Tools (ADT)?

Prerequisites

Page 5: EclipseCon Europe 2012 Tabris Workshop

Copyright EclipseSource Inc, all rights reserved

Technology

● Open Source● RAP Server● Browser Client (HTML 5 + JavaScript)● Tabris Server Bundles

● Commercial (developer preview free of charge)● Native Clients (iOS, Android)

http://developer.eclipsesource.com/tabris/downloads/

RAP & Tabris (Open Source)+ Tabris Native Clients (Commercial)

Page 6: EclipseCon Europe 2012 Tabris Workshop

Copyright EclipseSource Inc, all rights reserved

Architecture

Page 7: EclipseCon Europe 2012 Tabris Workshop

Copyright EclipseSource Inc, all rights reserved

Content of USB Stick

● EclipseSDK/● Linux, Mac and Windows versions

● Tabris-0.8.0-SDK.zip

● workshop-projects.zip● tabris-0.8_I386_2012-10-19_12-14-19.apk

● slides_tabris-workshop.pdf● android/

● ADT● SDK

Page 8: EclipseCon Europe 2012 Tabris Workshop

Copyright EclipseSource Inc, all rights reserved

HandsOnHandsOn IDE Setup

1. Extract and start Eclipse<USB stick>/EclipseSDK/<your system>

2. Import “Existing Projects into Workspace”<USB stick>/workshop-projects.zip

3. Set “Target Platform”: /tabris.target/tabris.target

Page 9: EclipseCon Europe 2012 Tabris Workshop

Copyright EclipseSource Inc, all rights reserved

HandsOnHandsOn First Project

Open the project:

com.eclipsesource.tabris.workshop

● Dependencies (MANIFEST.MF)● Activator● Configuration● EntryPoint → createUI()

● SWT Event Loop vs. RWT-JEE compatibility

Page 10: EclipseCon Europe 2012 Tabris Workshop

Copyright EclipseSource Inc, all rights reserved

HandsOnHandsOn Task 1

Widget: Shell & Button

Task: Let a button say“Hello World”.

c.e.t.workshop.task1

Entry Point: /helloworld

Page 11: EclipseCon Europe 2012 Tabris Workshop

Copyright EclipseSource Inc, all rights reserved

RAP Protocol and Clients

● RAP browser client: HTML 5 + JavaScript● Tabris native clients:

● Generic “Developer” Client● App-Specific-Client

Page 12: EclipseCon Europe 2012 Tabris Workshop

Copyright EclipseSource Inc, all rights reserved

HandsOnHandsOn Task 1: Launch it

● Launch Configuration:

/tabris.target/server.launch

→ starts the server on port 9090

● EntryPoint for the Tabris application on http://localhost:9090/helloworld● Access it with your browser

(HTML 5 + JavaScript client)

Page 13: EclipseCon Europe 2012 Tabris Workshop

Copyright EclipseSource Inc, all rights reserved

Client Deployment

iOS:● Pre-built generic workshop client on demand● App-specific client template

(part of Tabris SDK)

Android:● Direct .apk download (e.g. web or mail)● Google Play● As part of the Tabris SDK (USB stick, website)

Page 14: EclipseCon Europe 2012 Tabris Workshop

Copyright EclipseSource Inc, all rights reserved

HandsOnHandsOn Task 1: Native client

● EntryPoint for the Tabris application on http://tabrismac.local:9090/helloworld● Access it with native clients

Page 15: EclipseCon Europe 2012 Tabris Workshop

Copyright EclipseSource Inc, all rights reserved

Entrypoint Discovery

● Simplifies developer's life● Lists all available entry points on server

http://tabrismac.local:9090/index.json

● We provide two entry points for each HandsOn task in this workshop:http://tabrismac.local:9090/helloworldhttp://tabrismac.local:9090/helloworld-solution

Page 16: EclipseCon Europe 2012 Tabris Workshop

Copyright EclipseSource Inc, all rights reserved

HandsOnHandsOn Task 2

Widget: JFace Dialog

Task: Click a button toopen a dialog.

c.e.t.workshop.task2

Entry Point: /dialog

Page 17: EclipseCon Europe 2012 Tabris Workshop

Copyright EclipseSource Inc, all rights reserved

HandsOnHandsOn Task 3

Widget: JFace TreeViewer

Task: Connect a Treeto a simple data model.

c.e.t.workshop.task3

Entry Point: /tree

Page 18: EclipseCon Europe 2012 Tabris Workshop

Copyright EclipseSource Inc, all rights reserved

Differences between platforms

● Target platformsiOS vs. Android vs. Browser

● Tablet vs. Phone

Page 19: EclipseCon Europe 2012 Tabris Workshop

Copyright EclipseSource Inc, all rights reserved

Mobile UX: Do's and Dont's

● No Workbench on mobile clients● Fast start-up● Invest time in your design!● Don' try to unify

desktop & mobile● Lazy loading● Do work asynchronously

Page 20: EclipseCon Europe 2012 Tabris Workshop

Copyright EclipseSource Inc, all rights reserved

HandsOnHandsOn Task 4

Widget: Geolocation

Task: Display the currentlocation of your device.

c.e.t.workshop.task4

Entry Point: /geo

Page 21: EclipseCon Europe 2012 Tabris Workshop

Copyright EclipseSource Inc, all rights reserved

HandsOnHandsOn Task 5

Widget: ClientCanvas

Task: Touch and drawin your app.

c.e.t.workshop.task5

Entry Point: /draw

Page 22: EclipseCon Europe 2012 Tabris Workshop

Copyright EclipseSource Inc, all rights reserved

State of Tabris, Roadmap

Q: When will 1.0 be released?

A: Q1 2013

Q: Can I deploy via the App Store / Play Store?

A: Yes, as long you comply with the App Store rules.The decision is up to the Store provider.

Q: What about pricing?

A: Final pricing is not yet available.It will be in the same range as othercommercial offerings in the space.

Page 23: EclipseCon Europe 2012 Tabris Workshop

Copyright EclipseSource Inc, all rights reserved

Example Resources

● Available widgetshttp://developer.eclipsesource.com/tabris/docs/ui-controls/

● Code examples→ GitHub

Page 24: EclipseCon Europe 2012 Tabris Workshop

Copyright EclipseSource Inc, all rights reserved

Community & Support

Demos: https://github.com/eclipsesource/tabris-demos/

Git: https://github.com/eclipsesource/tabris

Issues/Bugs:https://github.com/eclipsesource/tabris/issues

Questions & Answers:http://stackoverflow.com/search?q=tabris

Professional Support:http://developer.eclipsesource.com/tabris/docs/services/

Page 25: EclipseCon Europe 2012 Tabris Workshop

Copyright EclipseSource Inc, all rights reserved

Thank you

For any questions please [email protected]