Exploring JavaFX 3D Jim Weaver Java Technology Ambassador Oracle Corporation @JavaFXpert [email protected]
May 24, 2015
2Copyright © 2012, Oracle and/or its affiliates. All rights reserved. Insert Information Protection Policy Classification from Slide 16
ProgramAgenda
Introduction to JavaFX 3D
Nuts and Bolts of JavaFX 3D
More Fun with JavaFX 3D
3 3
Please note
The following is intended to outline our general product direction. It is intended for information purposes only, and may not be incorporated into any contract. It is not a commitment to deliver any material, code, or functionality, and should not be relied upon in making purchasing decisions. The development, release, and timing of any features or functionality described for Oracle’s products remains at the sole discretion of Oracle.
4
Introduction to JavaFX 3D
6 6
Download JDK 8 Early Access Release
7 7
Visit the 3D Features for JavaFX 8 Wikihttps://wikis.oracle.com/display/OpenJDK/3D+Features
8 8
Visit Here: http://fxexperience.com
Tip: This site is authored by Oracle JavaFX Engineers
9
“JavaFX 3D gives you the ability to use 3D geometry, cameras, and lights in JavaFX.”
Jasper PottsJavaFX Engineer, Oracle Corporation
10
JavaFX 3D Application Example
10
http://fxexperience.com/2013/02/javafx-3d-early-access-available/
11
JavaFX 3D Use Cases
■ Inventory and Process Visualization
■ Scientific and Engineering Visualization
■ 3D Charting
■ Mechanical CAD and CAE
■ Medical Imaging
11
12
More JavaFX 3D Use Cases
■ Product Marketing
■ Architectural Design and Walkthroughs
■ Advanced User Experience
■ Mission Planning
■ Training
■ Entertainment
12
13
Nuts and Bolts of JavaFX 3D
(Shapes, Materials, Textures, Lights, Cameras)
14
Mesh Geometry (3D Shapes)
■ Predefined shapes■ Box
■ Cylinder
■ Sphere
■ User-defined shapes■ Using TriangleMesh / MeshView
14
https://wikis.oracle.com/display/OpenJDK/SphereAndBox.java
15 15
Creating Primitive Shapes and Materials
16 16
Rotating the 3D ShapesTip: Use lambda expressions as shown here to simplify event handling
17
3D Materials and Textures
■ PhongMaterial has these properties■ Ambient color
■ Diffuse color, diffuse map
■ Specular color, specular map
■ Specular power
■ Bump map
■ Self-illumination map
17
https://wikis.oracle.com/display/OpenJDK/3D+Features
18
UV Mapping Textures to Shapes
18
Tip: A texture is a 2D image to be mapped on a 3D surface
Source: http://en.wikipedia.org/wiki/File:UVMapping.png
19
Placing a Texture on a Sphere
19
20
Placing a Texture on a Sphere
20
21
Placing a Texture on a Cylinder
21
radius height
Note that the texture is mapped three times to the cylinder
22
Specifying Divisions on a Cylinder
22
radius height divisions
23
Placing an Image on a Box
23
Note that the texture is mapped six times to the box
Tip: A Box doesn’t have to be a cube. It may have different width, height and depth args
24
Using TriangleMesh / MeshView
■ If the same texture on all sides of the cube isn’t desired, a user-defined shape may be created using TriangleMesh and MeshView
24
25
UV Mapping on a Cube
25
26
Understanding TriangleMesh
26
8 points
12 faces
14 texCoords
12 faces
Image
0, 0
0, 1
1, 0
1, 1
Tip: Best practice for texture map dimensions is powers of two
(e.g. 1024x512)
27
Using TriangleMesh Points
27
Tip: The API for points, texCoords, and faces is currently being modified, primarily to hold this data in different structures.
(For example)
28
Using TriangleMesh Texture Coords
28
(For example)
29
Using TriangleMesh Faces
29
0, 2, 1 are points[] indices
10, 5, 9 are texCoords[] indices
30
Using TriangleMesh Smoothing Groups
30
These are faces[] indices
(and putting all the pieces together of our user-defined shape)
31 31
Real-World Example of Mesh Geometry
32
3D Lights
■ Lights are nodes in the scene graph■ PointLight
■ AmbientLight
■ Default light provided if no active lights
32
https://wikis.oracle.com/display/OpenJDK/3D+Features
33 33
Lights, Camera, Action!
Tip: The camera is also a node in the scene graph, so it is moveable
34
More Fun with JavaFX 3D
35
Using a SubScene
35
■ SubScene is a special node for scene separation
■ Renders part of the scene with a different camera
■ Some use cases are:■ Overlay for UI controls
■ Underlay for background
■ "Heads-up" display
36
Creating a SubScene
36
37
Behavior of this SubScene
37
38
3D Node Picking
38
■ Some events (e.g. MouseEvent and TouchEvent) have a getPickResult() method
■ PickResult contains info such as■ Node picked
■ 3D point picked on node
■ Distance of point from camera
■ Face # of node picked
39
3D Node Picking
39
40
Platonic Solids
40
Tip: Sample code for loading a 3D format will be made available. Third-party loaders are available as well.
41
Example 3D / multi-touch app: ZenGuitar3D
42 42
Showing the Picker (TouchEvent)
43 43
Rotating Instrument Picker with Scroll Gesture
44 44
Playing Strings (TouchEvent / TouchPoint)
45 45
Switching Modes (TouchPoint#belongsTo)
GuitarString3D instance
46 46
Setting up to Rotate on Three Axes
47 47
Using Scroll Gesture for X/Y Rotate
48 48
Using Rotate Gesture for Z Rotate
49 49
Using Zoom Gesture for Scaling
50 50
Using Timeline to Transform to Home Position
51 51
ZenGuitar3D Uses the JFugue5 Library
■ An open-source Java API for programming music without the complexities of MIDI
■ Developed by David Koelle
■ Available at http://JFugue.org
52
Questions?
54