Scratching the Surface with JavaFX


Published on

One of the very interesting and useful platforms for JavaFX is touch enabled devices such as Windows 8 tablets. This session will demonstrate a variety of JavaFX applications running on a Surface Windows 8 Pro, pointing out capabilities in JavaFX designed to leverage touch capabilities.

Published in: Technology, Education
  • Be the first to comment

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

Scratching the Surface with JavaFX

  1. 1. Scratching the Surfacewith JavaFXJim WeaverJava Technology AmbassadorOracle
  2. 2. Multi-touchconsiderationsfor JavaFX Touch Gestures– Swipe, Scroll, Rotate, Zoom Touch Event and Touch Points The Pagination Control Accommodating Fingers Introduction to JavaFX 3D Example app: ZenGuitar3D
  3. 3. 3Please noteThe following is intended to outline our general productdirection. It is intended for information purposes only, andmay not be incorporated into any contract. It is not acommitment to deliver any material, code, or functionality,and should not be relied upon in making purchasingdecisions. The development, release, and timing of anyfeatures or functionality described for Oracle’s productsremains at the sole discretion of Oracle.
  4. 4. Touch Gestures
  5. 5. The Swipe Gesture Commonly a finger drag in one direction A single event is produced for the gesture May be left, right, up, or down
  6. 6. Handling the Swipe Gesture (SwipeEvent)Note: Lambda expressionsfrom JDK 8 are used here tosimplify event handling
  7. 7. Handling the Swipe Gesture (SwipeEvent)
  8. 8. The Scroll Gesture User turns mouse wheel, drags finger ontouch screen, etc. Scroll events are continuously generated,containing x/y position-related info Events are pixel-based or character/line-based If inertia is supported, scroll events maybe generated after user quits scrolling
  9. 9. Handling the Scroll Gesture (ScrollEvent)
  10. 10. The Rotate Gesture User typically drags two fingers aroundeach other Rotate events are continuously generated,containing angle-related info
  11. 11. Handling the Rotate Gesture (RotateEvent)
  12. 12. The Zoom Gesture User typically drags two fingers apart orcloser together Zoom events are continuously generated,containing zoom factor-related info
  13. 13. Handling the Zoom Gesture (ZoomEvent)
  14. 14. Touch Event and Touch PointsThomas Laenner -
  15. 15. Handling Touch (TouchEvent/TouchPoint) A TouchEvent contains information abouta touch, including:– Event type: Pressed, released, moved, orstationary– Touch points: The TouchPoint instancesthat represent each of the points that weretouched Each TouchEvent has a unique ID to identify theevents and touch points in a multi-touch action
  16. 16. Responding to Touch Events
  17. 17. A Touch Demo from the JavaFX CommunityTouchyfxy app by Danno Ferrin Touchfxy is an open source JavaFXapplication developed by Danno Ferrin todemonstrate gestures and touch events To obtain Touchfxy, see Danno’s blog at
  18. 18. The Pagination Control
  19. 19. Using the Pagination Control The Pagination control is used fornavigation between pages Each page is a Node subclass Numeric page indicators, or bullet-styleindicators, may be set with the style classSTYLE_CLASS_BULLET
  20. 20. Using the Pagination Control
  21. 21. Accommodating Fingers
  22. 22. Making UI Controls Larger for Touching The default sizes forJavaFX UI controls areconducive to using amouse as a pointing device An easy way to modify thedefault sizes is to use CSS
  23. 23. Making UI Controls Larger for TouchingSpecify an -fx-font-sizeproperty in the #root selector
  24. 24. Introduction to JavaFX 3D
  25. 25. “JavaFX 3D gives you the ability to use 3D geometry,cameras, and lights in JavaFX.”
  26. 26. Mesh Geometry (3D Shapes)■ Predefined shapes■ Box■ Cylinder■ Sphere■ User-defined shapes■ Using TriangleMesh / MeshView26
  27. 27. 27Creating Primitive Shapes and Materials
  28. 28. 3D Materials and Textures■ PhongMaterial has these properties■ Ambient color■ Diffuse color, diffuse map■ Specular color, specular map■ Specular power■ Bump map■ Self-illumination map28
  29. 29. Duke’s nose has a Diffuse Map texture29
  30. 30. This planet has a Bump Map texture30
  31. 31. UV Mapping Textures to Shapes31Tip: A texture is a 2D image tobe mapped on a 3D surfaceSource:
  32. 32. Placing a Texture on a Sphere32
  33. 33. Placing a Texture on a Sphere33
  34. 34. 3D Lights■ Lights are nodes in the scene graph■ PointLight■ AmbientLight■ Default light provided if no active lights34
  35. 35. 35Lights, Camera, Action!
  36. 36. Example multi-touch app:ZenGuitar3D
  37. 37. 37Showing the Picker (TouchEvent)
  38. 38. 38Rotating Instrument Picker with Scroll Gesture
  39. 39. 39Playing Strings (TouchEvent / TouchPoint)
  40. 40. 40Switching Modes (TouchPoint#belongsTo)
  41. 41. 41Setting up to Rotate on Three Axes
  42. 42. 42Using Scroll Gesture for X/Y Rotate
  43. 43. 43Using Rotate Gesture for Z Rotate
  44. 44. 44Using Zoom Gesture for Scaling
  45. 45. 45Using Timeline to Transform to Home Position
  46. 46. 46ZenGuitar3D Uses the JFugue5 Library■ An open-source Java API forprogramming music without thecomplexities of MIDI■ Developed by David Koelle■ Available at
  47. 47. 47Start Here:
  48. 48. 48Download JDK 8 Early Access Release
  49. 49. 49Visit Here: http://fxexperience.comTip: This site isauthored byOracle JavaFXEngineers
  50. 50. Questions?
  51. 51. Scratching the Surfacewith JavaFXJim WeaverJava Technology AmbassadorOracle