KEMBAR78
JavaFX and WidgetFX at SVCodeCamp | PPTX
Getting Started with JavaFX and WidgetFXStephen ChinInovis, Inc.Keith CombsInovis, Inc.
JavaFX Crash Course
3Start Here: JavaFX.com
4Hello Earthrise
5JavaFX API Docs
JavaFX Mobile Development
JavaFX Mobile AdvantagesWrite Once, Run AnywhereDesktop, Mobile, Set-top Boxes (future)Large Embedded BaseBuilt on top of Java ME platformWide Range of DevicesRuns on Feature Phones, Smart PhonesCurrently available for Windows Mobile devices
JavaFX Mobile ConstraintsScreen SizeYour application has to be capable of running within a resolution of 320 by 240 or possibly even smaller.Common ProfileMobile applications are limited to the JavaFX APIs that are part of the Common Profile, which is a subset of the Desktop Profile.PerformanceMobile applications run on much less powerful devices, so they have less CPU and memory resources available to work with.
Developing for the Common Profile
Mobile DemosTry out the HTC Touch Diamond
Java User Group Spinner Wheel11Web Service Integration
Calling a REST ServiceREST URL:http://api.meetup.com/rsvps.json/event_id={eventId}&rsvp=yes&key={apiKey}Output:{ "results": [  {"zip":"94044","lon":"-122.48999786376953","photo_url":"http:\/\/photos1.meetupstatic.com\/photos\/member\/1\/4\/b\/a\/member_5333306.jpeg","response":"no","name":"Andres Almiray","comment":"Can't make it :-("}]}12
JUG Spinner - JSONHandler in 3 Stepspublic class Member {    public varplace:Integer;    public varphotoUrl:String;    public varname:String;    public varcomment:String;}varmemberParser:JSONHandler= JSONHandler {  rootClass: "org.jfxtras.jugspinner.data.MemberSearch “  onDone: function(obj, isSequence): Void {    members = (obj as MemberSearch).results;}}req = HttpRequest {  location: rsvpQueryonInput: function(is: java.io.InputStream) {memberParser.parse(is);}}131POJO2JSONHandler3HttpRequest
14rsvpQueryhttp://jfxtras.org/
Silicon Valley JavaFX Users GroupFree membershipRockstar presentersFirst Event:Google Campus (Seville Room)Speaker: Richard BairMember of the JavaFX TeamJavaOne 2009 Rockstar SpeakerDecember 9th (Tuesday)15http://svjugfx.org/
The JavaFX Desktop Widget PlatformWidgetFX
WidgetFX Origins17
18Why another desktop widget framework?Open-SourceBut widgets can be licensed commerciallyWrite Widgets in Java & JavaFXHTML, CSS, and Javascript are great for websites, but not app developmentCross-Platform SupportWindows XP/Vista, Linux, and Mac OS X. One-Click InstallationPlus automatic updates of the dock and widgets. Robust SecuritySecure sandbox + signed widgets
Built-in WidgetsClockSkinnable via CSSSlide ShowConfigurable Directory, Speed, & FilterWeb FeedSupports Atom and all RSS flavors19
Dock FeaturesDrag to desktopResize widgets (option for fixed aspect ratio)Per widget transparencyWidget settings saved on restartToggle dock always-on-topLaunch on start-upMulti-monitor supportDock and widgets can be styled via CSS20
Movie Widget Tutorial
Widget Properties22
Widget Definitionvar widget: Widget;widget = Widget {  width: 640  height: 352aspectRatio: bind player.media.width               / player.media.height  content: bind player}23
Load the Mediavar source = "http://projavafx.com/movies/ elephants-dream-640x352.flv";var player = bind SimpleMoviePlayer {    media: Media {        source: source    }    width: bind widget.width    height: bind widget.height}24
Run in Widget Runner25
Widget Configuration Properties26
Widget Configurationwidget = Widget {  ...  configuration: Configuration {    properties: [StringProperty {        name: "source“        value: bind source with inverse      }    ]    scene: Scene {…} // see next page  }}27
Widget Config DialogScene {  content: Grid {    rows: row([      Text {        content: "Source URL:“      },TextBox {        columns: 30,        value: bind source with inverse      }    ])  }}28
Add an On-Replace Triggervar player = bind SimpleMoviePlayer {  media: Media {    source: source  }  width: bind widget.width  height: bind widget.height} on replace =oldPlayer {oldPlayer.player.stop();}29
Widget Configuration (demo)30
Widget Development Contest31
Widget Contest Results3rd PlaceInfix WeatherWidgetLarry Dickson2nd PlaceRadioFXYannick Van Godtsenhoven32
Widget Contest Results1st PlaceScreenshotFXPär Dahlberg33
Pro JavaFX Book Giveaway!34
35Thank YouStephen Chinhttp://steveonjava.com/Tweet: steveonjavaKeith Combs

JavaFX and WidgetFX at SVCodeCamp

  • 1.
    Getting Started withJavaFX and WidgetFXStephen ChinInovis, Inc.Keith CombsInovis, Inc.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
    JavaFX Mobile AdvantagesWriteOnce, Run AnywhereDesktop, Mobile, Set-top Boxes (future)Large Embedded BaseBuilt on top of Java ME platformWide Range of DevicesRuns on Feature Phones, Smart PhonesCurrently available for Windows Mobile devices
  • 8.
    JavaFX Mobile ConstraintsScreenSizeYour application has to be capable of running within a resolution of 320 by 240 or possibly even smaller.Common ProfileMobile applications are limited to the JavaFX APIs that are part of the Common Profile, which is a subset of the Desktop Profile.PerformanceMobile applications run on much less powerful devices, so they have less CPU and memory resources available to work with.
  • 9.
    Developing for theCommon Profile
  • 10.
    Mobile DemosTry outthe HTC Touch Diamond
  • 11.
    Java User GroupSpinner Wheel11Web Service Integration
  • 12.
    Calling a RESTServiceREST URL:http://api.meetup.com/rsvps.json/event_id={eventId}&rsvp=yes&key={apiKey}Output:{ "results": [ {"zip":"94044","lon":"-122.48999786376953","photo_url":"http:\/\/photos1.meetupstatic.com\/photos\/member\/1\/4\/b\/a\/member_5333306.jpeg","response":"no","name":"Andres Almiray","comment":"Can't make it :-("}]}12
  • 13.
    JUG Spinner -JSONHandler in 3 Stepspublic class Member { public varplace:Integer; public varphotoUrl:String; public varname:String; public varcomment:String;}varmemberParser:JSONHandler= JSONHandler {  rootClass: "org.jfxtras.jugspinner.data.MemberSearch “  onDone: function(obj, isSequence): Void {    members = (obj as MemberSearch).results;}}req = HttpRequest { location: rsvpQueryonInput: function(is: java.io.InputStream) {memberParser.parse(is);}}131POJO2JSONHandler3HttpRequest
  • 14.
  • 15.
    Silicon Valley JavaFXUsers GroupFree membershipRockstar presentersFirst Event:Google Campus (Seville Room)Speaker: Richard BairMember of the JavaFX TeamJavaOne 2009 Rockstar SpeakerDecember 9th (Tuesday)15http://svjugfx.org/
  • 16.
    The JavaFX DesktopWidget PlatformWidgetFX
  • 17.
  • 18.
    18Why another desktopwidget framework?Open-SourceBut widgets can be licensed commerciallyWrite Widgets in Java & JavaFXHTML, CSS, and Javascript are great for websites, but not app developmentCross-Platform SupportWindows XP/Vista, Linux, and Mac OS X. One-Click InstallationPlus automatic updates of the dock and widgets. Robust SecuritySecure sandbox + signed widgets
  • 19.
    Built-in WidgetsClockSkinnable viaCSSSlide ShowConfigurable Directory, Speed, & FilterWeb FeedSupports Atom and all RSS flavors19
  • 20.
    Dock FeaturesDrag todesktopResize widgets (option for fixed aspect ratio)Per widget transparencyWidget settings saved on restartToggle dock always-on-topLaunch on start-upMulti-monitor supportDock and widgets can be styled via CSS20
  • 21.
  • 22.
  • 23.
    Widget Definitionvar widget:Widget;widget = Widget { width: 640 height: 352aspectRatio: bind player.media.width / player.media.height content: bind player}23
  • 24.
    Load the Mediavarsource = "http://projavafx.com/movies/ elephants-dream-640x352.flv";var player = bind SimpleMoviePlayer { media: Media { source: source } width: bind widget.width height: bind widget.height}24
  • 25.
  • 26.
  • 27.
    Widget Configurationwidget =Widget { ... configuration: Configuration { properties: [StringProperty { name: "source“ value: bind source with inverse } ] scene: Scene {…} // see next page }}27
  • 28.
    Widget Config DialogScene{ content: Grid { rows: row([ Text { content: "Source URL:“ },TextBox { columns: 30, value: bind source with inverse } ]) }}28
  • 29.
    Add an On-ReplaceTriggervar player = bind SimpleMoviePlayer { media: Media { source: source } width: bind widget.width height: bind widget.height} on replace =oldPlayer {oldPlayer.player.stop();}29
  • 30.
  • 31.
  • 32.
    Widget Contest Results3rdPlaceInfix WeatherWidgetLarry Dickson2nd PlaceRadioFXYannick Van Godtsenhoven32
  • 33.
    Widget Contest Results1stPlaceScreenshotFXPär Dahlberg33
  • 34.
    Pro JavaFX BookGiveaway!34
  • 35.