SlideShare a Scribd company logo
1 of 36
Download to read offline
Client side technologies
JavaFX
Dennis Kirch, Bao Loc Nguyen Ngo, Nicolas Osterloh,
Torsten Sehy, Stephan Wels
Web Technologies – Prof. Dr. Ulrik Schroeder – WS 2010/111
The slides are licensed under a
Creative Commons Attribution 3.0 License
Overview
Web Technologies2
 Introduction
 Orientation
 Concept
 Examples
 Video Puzzle
 Winter Olympics App
 Creating a Project
 Programming basic
 JavaFX in NetBeans
 Browser integration
 Live Coding
 Future Development
 JavaFX 2.0
 Conclusion
Orientation
Web Technologies3
Main Ideas
 Framework for rich internet applications
 Rapid GUI Development
 Platform independence
 Target multiple device types
 Drag-to-install
 Security
Web Technologies4
Platform Architecture
Web Technologies5
Desktop
Elements
Mobile
Elements
TV
Elements
Common Elements
JavaFX Runtime
Program Structure
 Scripting language JavaFX Script.
 Object oriented.
 Multiple inheritance possible.
 GUI-design with JavaFX Script or CSS.
 Event driven interaction.
 Program logic based on state machine
 NetBeans IDE Feature.
 Individual logic-layer for each state.
 Time triggered state change.
 Code induced state change.
Web Technologies6
Technical Details
 Compiler creates Java Byte Code.
 Platform independence
 JavaVM installed on 75% of all Desktop-Computers.
 Proven and tested Runtime Environment.
 Multiple website-embedding techniques
 Java Web Start
 Java Applet
 Interaction with Website
 JavaScript to JavaFX Communication
 DOM access
Web Technologies7
Security Concepts
 Sandboxing
 Limited HDD usage.
 No access to extern servers.
 Signatures
 Unsigned Programs
 Execution always demands agreement.
 Self signed Programs
 Enables trusted parties.
 Signed Programs
Web Technologies8
Examples
Web Technologies9
Video-Puzzle:Official Winter Olympics App:
Programming in JavaFX - Overview
 Objects and Data Types
 Content and media
 Events and Bindings
Web Technologies10
Objects & Data Types
Web Technologies11
Content and Media
Web Technologies12
Content and Media
Web Technologies13
Content and Media
Web Technologies14
Content and Media
Web Technologies15
Content and Media
Web Technologies16
Events and Bindings (1)
Web Technologies17
Events and Bindings (2)
Web Technologies18
Observer Pattern
Events and Bindings (3)
Web Technologies19
Observer Pattern
Events and Bindings (4)
Web Technologies20
Events and Bindings (5)
Web Technologies21
Web Technologies22
NetBeans IDE
Web Technologies23
Palette
NetBeans IDE
Web Technologies24
Palette
Properties
NetBeans IDE
Web Technologies25
Palette
PropertiesNavigator
NetBeans IDE
Web Technologies26
Palette
PropertiesNavigator
Design-
preview
NetBeans IDE
Web Technologies27
Palette
Properties
State window
Navigator
Design-
preview
NetBeans IDE
Design Code Generation
Web Technologies28
Browser Integration
Web Technologies29
• Integration as Java-Applet possible
• JavaScript code generated by JavaFX
SDK
• Problem: Needs enabled JavaScript
Live Coding
Web Technologies30
 Components
 Stage
 Scene
 Nodes
Live Coding
Web Technologies31
 Components
 Stage
 Scene
 Nodes
Code Example
Stage {
title : "DiaShow",
scene : Scene {
content : [
…//some nodes
]
} // end Scene
} //end Stage
Web Technologies32
The Diashow (1)
 Features
 Display one image at a time
 Switch image
 Switching modes
 Simple replacement
 Fade in / Fade out
 Fade in / Fade out (rotating)
Web Technologies33
The Diashow (2)
 IDE : Eclipse
 JavaFX Plugin available
 Step by Step
 Step 1 : Display image and button
 Step 2 : Switch between images
 Step 3 : Fade in / Fade out
 Step 4 : Rotate images
Web Technologies34
Future Development – JavaFX 2.0
 Release in second half of 2011.
 New scripting language.
 Old scripting language discontinued.
 No downward compatibility.
 Complete rewrite projects to use new features.
 Full screen video support
 Multithreading Improvements
 Improved Startup Performance.
Web Technologies35
Conclusions
 Ideal for fast graphical RIAs.
 Late involvement in RIA development by Sun.
 Maybe too late.
 Flash dominates the market.
 Wait for JavaFX 2.0
 New Features
 Only need to write the code once(New scripting language)
 Most features realizable with HTML5
 Better compatibility especially for mobile Devices (e.g iPhone,
iPad, Windows Phone 7)
 HTML5 canvas element slower.
Web Technologies36

More Related Content

What's hot

Mastinder singh visualcv_resume
Mastinder singh visualcv_resumeMastinder singh visualcv_resume
Mastinder singh visualcv_resumeMastinder Singh
 
Azure Mobile Services (+ Universal Apps)
Azure Mobile Services (+ Universal Apps)Azure Mobile Services (+ Universal Apps)
Azure Mobile Services (+ Universal Apps)Shahed Chowdhuri
 
An overview of mobile html + java script frameworks
An overview of mobile html + java script frameworksAn overview of mobile html + java script frameworks
An overview of mobile html + java script frameworksSasha dos Santos
 
Framework dynamic par Simone Sivetta
Framework dynamic par Simone SivettaFramework dynamic par Simone Sivetta
Framework dynamic par Simone SivettaCocoaHeads France
 
O futuro do .NET : O que eu preciso saber
O futuro do .NET : O que eu preciso saberO futuro do .NET : O que eu preciso saber
O futuro do .NET : O que eu preciso saberDanilo Bordini
 
Light-up-your-out-of-the-box LightSwitch Application
Light-up-your-out-of-the-box LightSwitch ApplicationLight-up-your-out-of-the-box LightSwitch Application
Light-up-your-out-of-the-box LightSwitch ApplicationBoulos Dib
 
Docker Switzelrand Meetup #18 DockerCon Recap
Docker Switzelrand Meetup #18 DockerCon RecapDocker Switzelrand Meetup #18 DockerCon Recap
Docker Switzelrand Meetup #18 DockerCon RecapBrian Christner
 
Android Overview
Android OverviewAndroid Overview
Android OverviewRaju Kadam
 
Sencha touchonbb10 bootcamp
Sencha touchonbb10 bootcampSencha touchonbb10 bootcamp
Sencha touchonbb10 bootcampn_adam_stanley
 
Capturing Your Audience with Kinect
Capturing Your Audience with KinectCapturing Your Audience with Kinect
Capturing Your Audience with KinectShahed Chowdhuri
 
Introduction to android basics
Introduction to android basicsIntroduction to android basics
Introduction to android basicsHasam Panezai
 
Nightly build done right
Nightly build done rightNightly build done right
Nightly build done rightLiora Milbaum
 
Sg conference multiplatform_apps_adam_stanley
Sg conference multiplatform_apps_adam_stanleySg conference multiplatform_apps_adam_stanley
Sg conference multiplatform_apps_adam_stanleyn_adam_stanley
 

What's hot (19)

Android Presentation
Android PresentationAndroid Presentation
Android Presentation
 
Mastinder singh visualcv_resume
Mastinder singh visualcv_resumeMastinder singh visualcv_resume
Mastinder singh visualcv_resume
 
Azure Mobile Services (+ Universal Apps)
Azure Mobile Services (+ Universal Apps)Azure Mobile Services (+ Universal Apps)
Azure Mobile Services (+ Universal Apps)
 
Android basics
Android basicsAndroid basics
Android basics
 
An overview of mobile html + java script frameworks
An overview of mobile html + java script frameworksAn overview of mobile html + java script frameworks
An overview of mobile html + java script frameworks
 
Revue des annonces WWDC2015
Revue des annonces WWDC2015Revue des annonces WWDC2015
Revue des annonces WWDC2015
 
Framework dynamic par Simone Sivetta
Framework dynamic par Simone SivettaFramework dynamic par Simone Sivetta
Framework dynamic par Simone Sivetta
 
O futuro do .NET : O que eu preciso saber
O futuro do .NET : O que eu preciso saberO futuro do .NET : O que eu preciso saber
O futuro do .NET : O que eu preciso saber
 
Android Handheld Systems
Android Handheld SystemsAndroid Handheld Systems
Android Handheld Systems
 
Light-up-your-out-of-the-box LightSwitch Application
Light-up-your-out-of-the-box LightSwitch ApplicationLight-up-your-out-of-the-box LightSwitch Application
Light-up-your-out-of-the-box LightSwitch Application
 
Docker Switzelrand Meetup #18 DockerCon Recap
Docker Switzelrand Meetup #18 DockerCon RecapDocker Switzelrand Meetup #18 DockerCon Recap
Docker Switzelrand Meetup #18 DockerCon Recap
 
Introduction to android
Introduction to androidIntroduction to android
Introduction to android
 
Nitin devops
Nitin devopsNitin devops
Nitin devops
 
Android Overview
Android OverviewAndroid Overview
Android Overview
 
Sencha touchonbb10 bootcamp
Sencha touchonbb10 bootcampSencha touchonbb10 bootcamp
Sencha touchonbb10 bootcamp
 
Capturing Your Audience with Kinect
Capturing Your Audience with KinectCapturing Your Audience with Kinect
Capturing Your Audience with Kinect
 
Introduction to android basics
Introduction to android basicsIntroduction to android basics
Introduction to android basics
 
Nightly build done right
Nightly build done rightNightly build done right
Nightly build done right
 
Sg conference multiplatform_apps_adam_stanley
Sg conference multiplatform_apps_adam_stanleySg conference multiplatform_apps_adam_stanley
Sg conference multiplatform_apps_adam_stanley
 

Viewers also liked

Presentation JavaFX
Presentation JavaFXPresentation JavaFX
Presentation JavaFXrecon4
 
Pictures from DCF Workshop within Case Champ. 18 Feb 2011
Pictures from DCF Workshop within Case Champ. 18 Feb 2011Pictures from DCF Workshop within Case Champ. 18 Feb 2011
Pictures from DCF Workshop within Case Champ. 18 Feb 2011Case Champ
 
Case champ - what case is
Case champ - what case isCase champ - what case is
Case champ - what case isCase Champ
 
Фото с мастер-класса от компании ITT
Фото с мастер-класса от компании ITTФото с мастер-класса от компании ITT
Фото с мастер-класса от компании ITTCase Champ
 
Arcanum (online round)
Arcanum (online round)Arcanum (online round)
Arcanum (online round)Case Champ
 
Cv guide from case champ
Cv guide from case champCv guide from case champ
Cv guide from case champCase Champ
 

Viewers also liked (7)

Presentation JavaFX
Presentation JavaFXPresentation JavaFX
Presentation JavaFX
 
Pictures from DCF Workshop within Case Champ. 18 Feb 2011
Pictures from DCF Workshop within Case Champ. 18 Feb 2011Pictures from DCF Workshop within Case Champ. 18 Feb 2011
Pictures from DCF Workshop within Case Champ. 18 Feb 2011
 
Case champ - what case is
Case champ - what case isCase champ - what case is
Case champ - what case is
 
Фото с мастер-класса от компании ITT
Фото с мастер-класса от компании ITTФото с мастер-класса от компании ITT
Фото с мастер-класса от компании ITT
 
Hardware
HardwareHardware
Hardware
 
Arcanum (online round)
Arcanum (online round)Arcanum (online round)
Arcanum (online round)
 
Cv guide from case champ
Cv guide from case champCv guide from case champ
Cv guide from case champ
 

Similar to Presentation JavaFX

Moving to the Client - JavaFX and HTML5
Moving to the Client - JavaFX and HTML5Moving to the Client - JavaFX and HTML5
Moving to the Client - JavaFX and HTML5Stephen Chin
 
"BlackBerry Webworks : Apps for The Smartphone and Tablet"
"BlackBerry Webworks : Apps for The Smartphone and Tablet""BlackBerry Webworks : Apps for The Smartphone and Tablet"
"BlackBerry Webworks : Apps for The Smartphone and Tablet"Software Park Thailand
 
JavaFX Versus HTML5 - JavaOne 2014
JavaFX Versus HTML5 - JavaOne 2014JavaFX Versus HTML5 - JavaOne 2014
JavaFX Versus HTML5 - JavaOne 2014Ryan Cuprak
 
Developing for BlackBerry 10 – Tools and SDKs by Luca Filigheddu
 Developing for BlackBerry 10 – Tools and SDKs by Luca Filigheddu Developing for BlackBerry 10 – Tools and SDKs by Luca Filigheddu
Developing for BlackBerry 10 – Tools and SDKs by Luca FilighedduCodemotion
 
Hybrid Mobile Development with Apache Cordova and Java EE 7 (JavaOne 2014)
Hybrid Mobile Development with Apache Cordova and Java EE 7 (JavaOne 2014)Hybrid Mobile Development with Apache Cordova and Java EE 7 (JavaOne 2014)
Hybrid Mobile Development with Apache Cordova and Java EE 7 (JavaOne 2014)Ryan Cuprak
 
Moving to the Client - JavaFX and HTML5
Moving to the Client - JavaFX and HTML5Moving to the Client - JavaFX and HTML5
Moving to the Client - JavaFX and HTML5Stephen Chin
 
Android : How Do I Code Thee?
Android : How Do I Code Thee?Android : How Do I Code Thee?
Android : How Do I Code Thee?Viswanath J
 
Crosswalk and the Intel XDK
Crosswalk and the Intel XDKCrosswalk and the Intel XDK
Crosswalk and the Intel XDKIntel® Software
 
Web development concepts using microsoft technologies
Web development concepts using microsoft technologiesWeb development concepts using microsoft technologies
Web development concepts using microsoft technologiesHosam Kamel
 
HTML5 Intoduction for Web Developers
HTML5 Intoduction for Web DevelopersHTML5 Intoduction for Web Developers
HTML5 Intoduction for Web DevelopersSascha Corti
 
Moving to the Client - JavaFX and HTML5 (PowerPoint Version)
Moving to the Client - JavaFX and HTML5 (PowerPoint Version)Moving to the Client - JavaFX and HTML5 (PowerPoint Version)
Moving to the Client - JavaFX and HTML5 (PowerPoint Version)Stephen Chin
 
JSF basics
JSF basicsJSF basics
JSF basicsairbo
 
[English version] JavaFX and Web Integration
[English version] JavaFX and Web Integration[English version] JavaFX and Web Integration
[English version] JavaFX and Web IntegrationKazuchika Sekiya
 
OpenJFX on Android and Devices
OpenJFX on Android and DevicesOpenJFX on Android and Devices
OpenJFX on Android and DevicesStephen Chin
 
WebWorks Development for BlackBerry PlayBook and Smartphones
WebWorks Development for BlackBerry PlayBook and SmartphonesWebWorks Development for BlackBerry PlayBook and Smartphones
WebWorks Development for BlackBerry PlayBook and SmartphonesKyle McInnes
 
Busy developer-html5-javaee7
Busy developer-html5-javaee7Busy developer-html5-javaee7
Busy developer-html5-javaee7Geertjan Wielenga
 
A164 enterprise javascript ibm node sdk
A164 enterprise javascript ibm node sdkA164 enterprise javascript ibm node sdk
A164 enterprise javascript ibm node sdkToby Corbin
 

Similar to Presentation JavaFX (20)

Moving to the Client - JavaFX and HTML5
Moving to the Client - JavaFX and HTML5Moving to the Client - JavaFX and HTML5
Moving to the Client - JavaFX and HTML5
 
"BlackBerry Webworks : Apps for The Smartphone and Tablet"
"BlackBerry Webworks : Apps for The Smartphone and Tablet""BlackBerry Webworks : Apps for The Smartphone and Tablet"
"BlackBerry Webworks : Apps for The Smartphone and Tablet"
 
JavaFX Versus HTML5 - JavaOne 2014
JavaFX Versus HTML5 - JavaOne 2014JavaFX Versus HTML5 - JavaOne 2014
JavaFX Versus HTML5 - JavaOne 2014
 
Developing for BlackBerry 10 – Tools and SDKs by Luca Filigheddu
 Developing for BlackBerry 10 – Tools and SDKs by Luca Filigheddu Developing for BlackBerry 10 – Tools and SDKs by Luca Filigheddu
Developing for BlackBerry 10 – Tools and SDKs by Luca Filigheddu
 
Hybrid Mobile Development with Apache Cordova and Java EE 7 (JavaOne 2014)
Hybrid Mobile Development with Apache Cordova and Java EE 7 (JavaOne 2014)Hybrid Mobile Development with Apache Cordova and Java EE 7 (JavaOne 2014)
Hybrid Mobile Development with Apache Cordova and Java EE 7 (JavaOne 2014)
 
Moving to the Client - JavaFX and HTML5
Moving to the Client - JavaFX and HTML5Moving to the Client - JavaFX and HTML5
Moving to the Client - JavaFX and HTML5
 
Android : How Do I Code Thee?
Android : How Do I Code Thee?Android : How Do I Code Thee?
Android : How Do I Code Thee?
 
Crosswalk and the Intel XDK
Crosswalk and the Intel XDKCrosswalk and the Intel XDK
Crosswalk and the Intel XDK
 
Web development concepts using microsoft technologies
Web development concepts using microsoft technologiesWeb development concepts using microsoft technologies
Web development concepts using microsoft technologies
 
The WebKit project
The WebKit projectThe WebKit project
The WebKit project
 
HTML5 Intoduction for Web Developers
HTML5 Intoduction for Web DevelopersHTML5 Intoduction for Web Developers
HTML5 Intoduction for Web Developers
 
Moving to the Client - JavaFX and HTML5 (PowerPoint Version)
Moving to the Client - JavaFX and HTML5 (PowerPoint Version)Moving to the Client - JavaFX and HTML5 (PowerPoint Version)
Moving to the Client - JavaFX and HTML5 (PowerPoint Version)
 
JSF basics
JSF basicsJSF basics
JSF basics
 
[English version] JavaFX and Web Integration
[English version] JavaFX and Web Integration[English version] JavaFX and Web Integration
[English version] JavaFX and Web Integration
 
OpenJFX on Android and Devices
OpenJFX on Android and DevicesOpenJFX on Android and Devices
OpenJFX on Android and Devices
 
WebLogic and GraalVM
WebLogic and GraalVMWebLogic and GraalVM
WebLogic and GraalVM
 
Guides To Analyzing WebKit Performance
Guides To Analyzing WebKit PerformanceGuides To Analyzing WebKit Performance
Guides To Analyzing WebKit Performance
 
WebWorks Development for BlackBerry PlayBook and Smartphones
WebWorks Development for BlackBerry PlayBook and SmartphonesWebWorks Development for BlackBerry PlayBook and Smartphones
WebWorks Development for BlackBerry PlayBook and Smartphones
 
Busy developer-html5-javaee7
Busy developer-html5-javaee7Busy developer-html5-javaee7
Busy developer-html5-javaee7
 
A164 enterprise javascript ibm node sdk
A164 enterprise javascript ibm node sdkA164 enterprise javascript ibm node sdk
A164 enterprise javascript ibm node sdk
 

Presentation JavaFX