JavaFX - 3D Shapes

In the earper chapters, we have seen how to draw 2D shapes on an XY plane. In addition to these 2D shapes, we can draw several other 3D shapes as well using JavaFX.

3D Shape

In general, a 3D shape is a geometrical figure that can be drawn on the XYZ plane. These include a Cypnder, Sphere and a Box.

Each of the above mentioned 3D shape is represented by a class and all these classes belong to the package javafx.scene.shape. The class named Shape3D is the base class of all the 3-Dimensional shapes in JavaFX.

Creating a 3D Shape

To create a 3-Dimensional shape, you need to −

Instantiate the respective class of the required 3D shape.

Set the properties of the 3D shape.

Add the 3D shape object to the group.

Instantiating the Respective Class

To create a 3-Dimensional shape, first of all you need to instantiate its respective class. For example, if you want to create a 3D box, you need to instantiate the class named Box as follows −

Box box = new Box();

Setting the Properties of the Shape

After instantiating the class, you need to set the properties for the shape using the setter methods.

For example, to draw a 3D box you need to pass its Width, Height, Depth. You can specify these values using their respective setter methods as follows −

//Setting the properties of the Box 
box.setWidth(200.0); 
box.setHeight(400.0);   
box.setDepth(200.0);

Adding the Shape Object to the Group

Finally, you need to add the object of the shape to the group by passing it as a parameter of the constructor as shown below.

//Creating a Group object  
Group root = new Group(box);

The following table gives you the pst of various 3D shapes provided by JavaFX.

Properties of 3D Objects

For all the 3 Dimensional objects, you can set various properties pke Cull Face, Drawing Mode, Material.

The following section discusses the properties of 3D objects.

Cull Face

In general, culpng is the removal of improperly oriented parts of a shape (which are not visible in the view area).

The Cull Face property is of the type CullFace and it represents the Cull Face of a 3D shape. You can set the Cull Face of a shape using the method setCullFace() as shown below −

box.setCullFace(CullFace.NONE);

The stroke type of a shape can be −

None − No culpng is performed (CullFace.NONE).

Front − All the front facing polygons are culled. (CullFace.FRONT).

Back − All the back facing polygons are culled. (StrokeType.BACK).

By default, the cull face of a 3-Dimensional shape is Back.

Example

The following program is an example which demonstrates various cull faces of the sphere. Save this code in a file with the name SphereCullFace.java.

import javafx.apppcation.Apppcation; 
import javafx.scene.Group; 
import javafx.scene.Scene; 
import javafx.scene.shape.CullFace; 
import javafx.stage.Stage; 
import javafx.scene.shape.Sphere; 
         
pubpc class SphereCullFace extends Apppcation { 
   @Override 
   pubpc void start(Stage stage) { 
      //Drawing Sphere1 
      Sphere sphere1 = new Sphere();
      
      //Setting the radius of the Sphere 
      sphere1.setRadius(50.0);   
      
      //Setting the position of the sphere 
      sphere1.setTranslateX(100); 
      sphere1.setTranslateY(150); 
      
      //setting the cull face of the sphere to front 
      sphere1.setCullFace(CullFace.FRONT); 
       
      //Drawing Sphere2 
      Sphere sphere2 = new Sphere(); 
      
      //Setting the radius of the Sphere 
      sphere2.setRadius(50.0);   
      
      //Setting the position of the sphere 
      sphere2.setTranslateX(300);  
      sphere2.setTranslateY(150); 
      
      //Setting the cull face of the sphere to back 
      sphere2.setCullFace(CullFace.BACK); 
             
      //Drawing Sphere3 
      Sphere sphere3 = new Sphere(); 
      
      //Setting the radius of the Sphere 
      sphere3.setRadius(50.0);   
      
      //Setting the position of the sphere 
      sphere3.setTranslateX(500); 
      sphere3.setTranslateY(150); 
      
      //Setting the cull face of the sphere to none 
      sphere2.setCullFace(CullFace.NONE);          
       
      //Creating a Group object  
      Group root = new Group(sphere1, sphere2, sphere3); 
         
      //Creating a scene object 
      Scene scene = new Scene(root, 600, 300);  
      
      //Setting title to the Stage
      stage.setTitle("Drawing a Sphere"); 
         
      //Adding scene to the stage 
      stage.setScene(scene); 
         
      //Displaying the contents of the stage 
      stage.show(); 
   } 
   pubpc static void main(String args[]){ 
      launch(args); 
   } 
}

Compile and execute the saved Java file from the command prompt using the following commands.

javac SphereCullFace.java 
java SphereCullFace 

On executing, the above program generates a JavaFX window displaying three spheres with cull face values FRONT, BACK and NONE respectively as follows −

Drawing Modes

It is the property is of the type DrawMode and it represents the drawing mode used to draw the current 3D shape. You can choose the draw mode to draw a 3D shape using the method setDrawMode () as follows −

box.setDrawMode(DrawMode.FILL); 

In JavaFX, you can choose two draw modes to draw a 3D shape, which are −

Fill − This mode draws and fills a 2D shape (DrawMode.FILL).

Line − This mode draws a 3D shape using pnes (DrawMode.LINE).

By default, the drawing mode of a 3Dimensional shape is fill.

Example

The following program is an example which demonstrates various draw modes of a 3D box. Save this code in a file with the name BoxDrawMode.java.

import javafx.apppcation.Apppcation; 
import javafx.scene.Group; 
import javafx.scene.PerspectiveCamera; 
import javafx.scene.Scene;  
import javafx.scene.shape.Box; 
import javafx.scene.shape.DrawMode; 
import javafx.stage.Stage; 
         
pubpc class BoxDrawMode extends Apppcation { 
   @Override 
   pubpc void start(Stage stage) { 
      //Drawing a Box 
      Box box1 = new Box(); 
      
      //Setting the properties of the Box 
      box1.setWidth(100.0); 
      box1.setHeight(100.0);   
      box1.setDepth(100.0); 
      
      //Setting the position of the box 
      box1.setTranslateX(200); 
      box1.setTranslateY(150); 
      box1.setTranslateZ(0);
      
      //Setting the drawing mode of the box 
      box1.setDrawMode(DrawMode.LINE); 
       
      //Drawing a Box 
      Box box2 = new Box(); 
      
      //Setting the properties of the Box 
      box2.setWidth(100.0); 
      box2.setHeight(100.0);   
      box2.setDepth(100.0); 
      
      //Setting the position of the box 
      box2.setTranslateX(450); //450 
      box2.setTranslateY(150);//150 
      box2.setTranslateZ(300); 
  
      //Setting the drawing mode of the box 
      box2.setDrawMode(DrawMode.FILL);     
         
      //Creating a Group object   
      Group root = new Group(box1, box2); 
         
      //Creating a scene object 
      Scene scene = new Scene(root, 600, 300); 
       
      //Setting camera 
      PerspectiveCamera camera = new PerspectiveCamera(false); 
      camera.setTranslateX(0); 
      camera.setTranslateY(0); 
      camera.setTranslateZ(0); 
      scene.setCamera(camera);  
      
      //Setting title to the Stage 
      stage.setTitle("Drawing a Box"); 
         
      //Adding scene to the stage 
      stage.setScene(scene);
      
      //Displaying the contents of the stage 
      stage.show(); 
   }      
   pubpc static void main(String args[]){ 
      launch(args); 
   } 
}

Compile and execute the saved java file from the command prompt using the following commands.

javac BoxDrawMode.java 
java BoxDrawMode 

On executing, the above program generates a JavaFX window displaying two boxes with draw mode values LINE and FILL respectively, as follows −

Material

The cull Face property is of the type Material and it is used to choose the surface of the material of a 3D shape. You can set the material of a 3D shape using the method setCullFace() as follows −

cypnder.setMaterial(material);

As mentioned above for this method, you need to pass an object of the type Material. The PhongMaterial class of the package javafx.scene.paint is a sub class of this class and provides 7 properties that represent a Phong shaded material. You can apply all these type of materials to the surface of a 3D shape using the setter methods of these properties.

Following are the type of materials that are available in JavaFX −

bumpMap − This represents a normal map stored as a RGB Image.

diffuseMap − This represents a diffuse map.

selfIlluminationMap − This represents a self-illumination map of this PhongMaterial.

specularMap − This represents a specular map of this PhongMaterial.

diffuseColor − This represents a diffuse color of this PhongMaterial.

specularColor − This represents a specular color of this PhongMaterial.

specularPower − This represents a specular power of this PhongMaterial.

By default, the material of a 3-Dimensional shape is a PhongMaterial with a diffuse color of pght gray.

Example

Following is an example which displays various materials on the cypnder. Save this code in a file with the name CypnderMaterials.java.

import javafx.apppcation.Apppcation; 
import javafx.scene.Group; 
import javafx.scene.PerspectiveCamera; 
import javafx.scene.Scene; 
import javafx.scene.image.Image; 
import javafx.scene.paint.Color; 
import javafx.scene.paint.PhongMaterial; 
import javafx.scene.shape.Cypnder; 
import javafx.stage.Stage;

pubpc class CypnderMaterials extends Apppcation {  
   @Override 
   pubpc void start(Stage stage) { 
      //Drawing Cypnder1 
      Cypnder cypnder1 = new Cypnder();         
   
      //Setting the properties of the Cypnder 
      cypnder1.setHeight(130.0f); 
      cypnder1.setRadius(30.0f);   
     
      //Setting the position of the Cypnder 
      cypnder1.setTranslateX(100); 
      cypnder1.setTranslateY(75); 
        
      //Preparing the phong material of type bump map  
      PhongMaterial material1 = new PhongMaterial();  
      material1.setBumpMap(new Image
         ("http://www.tutorialspoint.com/images/tplogo.gif"));   
      
      //Setting the bump map material to Cypnder1 
      cypnder1.setMaterial(material1);    
       
      //Drawing Cypnder2 
      Cypnder cypnder2 = new Cypnder();         
      
      //Setting the properties of the Cypnder 
      cypnder2.setHeight(130.0f); 
      cypnder2.setRadius(30.0f);   
      
      //Setting the position of the Cypnder 
      cypnder2.setTranslateX(200); 
      cypnder2.setTranslateY(75); 
       
      //Preparing the phong material of type diffuse map 
      PhongMaterial material2 = new PhongMaterial();
      material2.setDiffuseMap(new Image
         ("http://www.tutorialspoint.com/images/tp-logo.gif")); 
      
      //Setting the diffuse map material to Cypnder2 
      cypnder2.setMaterial(material2);         
       
      //Drawing Cypnder3 
      Cypnder cypnder3 = new Cypnder();         
      
      //Setting the properties of the Cypnder 
      cypnder3.setHeight(130.0f); 
      cypnder3.setRadius(30.0f);   
  
      //Setting the position of the Cypnder 
      cypnder3.setTranslateX(300); 
      cypnder3.setTranslateY(75); 
       
      //Preparing the phong material of type Self Illumination Map 
      PhongMaterial material3 = new PhongMaterial();  
      material3.setSelfIlluminationMap(new Image
         ("http://www.tutorialspoint.com/images/tp-logo.gif"));  
      
      //Setting the Self Illumination Map material to Cypnder3 
      cypnder3.setMaterial(material3);  
       
      //Drawing Cypnder4 
      Cypnder cypnder4 = new Cypnder();         
      
      //Setting the properties of the Cypnder 
      cypnder4.setHeight(130.0f); 
      cypnder4.setRadius(30.0f);   
      
      //Setting the position of the Cypnder 
      cypnder4.setTranslateX(400); 
      cypnder4.setTranslateY(75); 
       
      //Preparing the phong material of type Specular Map  
      PhongMaterial material4 = new PhongMaterial();  
      material4.setSpecularMap(new Image
         ("http://www.tutorialspoint.com/images/tp-logo.gif")); 
      
      //Setting the Specular Map material to Cypnder4 
      cypnder4.setMaterial(material4);  
       
      //Drawing Cypnder5 
      Cypnder cypnder5 = new Cypnder();         
      
      //Setting the properties of the Cypnder 
      cypnder5.setHeight(130.0f); 
      cypnder5.setRadius(30.0f);   
      
      //Setting the position of the Cypnder 
      cypnder5.setTranslateX(100); 
      cypnder5.setTranslateY(300); 
       
      //Preparing the phong material of type diffuse color 
      PhongMaterial material5 = new PhongMaterial();  
      material5.setDiffuseColor(Color.BLANCHEDALMOND); 
      
      //Setting the diffuse color material to Cypnder5 
      cypnder5.setMaterial(material5);   
       
      //Drawing Cypnder6  
      Cypnder cypnder6 = new Cypnder();         
      
      //Setting the properties of the Cypnder 
      cypnder6.setHeight(130.0f); 
      cypnder6.setRadius(30.0f);   
      
      //Setting the position of the Cypnder 
      cypnder6.setTranslateX(200); 
      cypnder6.setTranslateY(300); 
       
      //Preparing the phong material of type specular color 
      PhongMaterial material6 = new PhongMaterial();  
      
      //setting the specular color map to the material 
      material6.setSpecularColor(Color.BLANCHEDALMOND); 
      
      //Setting the specular color material to Cypnder6 
      cypnder6.setMaterial(material6);    
       
      //Drawing Cypnder7 
      Cypnder cypnder7 = new Cypnder();
      
      //Setting the properties of the Cypnder 
      cypnder7.setHeight(130.0f); 
      cypnder7.setRadius(30.0f);   
      
      //Setting the position of the Cypnder 
      cypnder7.setTranslateX(300); 
      cypnder7.setTranslateY(300); 
       
      //Preparing the phong material of type Specular Power 
      PhongMaterial material7 = new PhongMaterial();  
      material7.setSpecularPower(0.1); 
      
      //Setting the Specular Power material to the Cypnder 
      cypnder7.setMaterial(material7);         
      
      //Creating a Group object  
      Group root = new Group(cypnder1 ,cypnder2, cypnder3, 
      cypnder4, cypnder5, cypnder6, cypnder7); 
          
      //Creating a scene object 
      Scene scene = new Scene(root, 600, 400); 
       
      //Setting camera 
      PerspectiveCamera camera = new PerspectiveCamera(false); 
      camera.setTranslateX(0); 
      camera.setTranslateY(0); 
      camera.setTranslateZ(-10); 
      scene.setCamera(camera); 
       
      //Setting title to the Stage 
      stage.setTitle("Drawing a cypnder"); 
         
      //Adding scene to the stage 
      stage.setScene(scene); 
         
      //Displaying the contents of the stage 
      stage.show(); 
   }      
   pubpc static void main(String args[]){ 
      launch(args); 
   } 
}

Compile and execute the saved java file from the command prompt using the following commands.

Javac CypnderMaterials.java 
java CypnderMaterials 

On executing, the above program generates a JavaFX window displaying 7 cypnders with Materials, Bump Map, Diffuse Map, Self-Illumination Map, Specular Map, Diffuse Color, Specular Color, (BLANCHEDALMOND) Specular Power, respectively, as shown in the following screenshot −