2017年11月6日 星期一

JavaFX 3D - PhongMaterial

JavaFX使用Phong Shading著色法，又稱為Phong Interpolation或Normal-Vector Interpolation Shading，是由美國越南裔學者Bui T??ng Phong所發明，1973年發表於博士論文 "Illumination of Computer-Generated Images", Department of Computer Science, University of Utah, UTEC-CSs-73-129, July 1973，因此以其姓氏Phong (裴)命名。 

Phong Reflection Model是由Ambient Light (環境光)、Diffuse Light (漫射光) 與Specular Light (鏡面光) 三者所組成。 

JavaFX以PhongMaterial類別處理Phong Material，並細分為Bump Map, Diffuse Map, Self Illumination Map, Specular Map, Diffuse Color, Specular Color, 與Specular Power，前四者Map用以設定貼圖、接著Color用以設定著色、最後Power用以設定強度，並定義以下屬性：
  • bumpMap: The bump map of this PhongMaterial, which is a normal map stored as a RGB Image.
  • diffuseColor: The diffuse color of this PhongMaterial.
  • diffuseMap: The diffuse map of this PhongMaterial.
  • selfIlluminationMap: The self illumination map of this PhongMaterial.
  • specularColor: The specular color of this PhongMaterial.
  • specularMap: The specular map of this PhongMaterial.
  • specularPower: The specular power of this PhongMateria.
請參考以下範例分別示範以各種不同的組合所產生的效果：
// 建立Sphere物件
Sphere sphere = new Sphere(200); 
sphere.setTranslateX(200); 
sphere.setTranslateY(200); 

// 建立PhongMaterial物件
PhongMaterial material = new PhongMaterial(); 
// 設定Bump Map貼圖
material.setBumpMap(new Image(getClass().getResourceAsStream(  
  "images/earth_normal_map.jpg"), 512, 256, true, true)); 

sphere.setMaterial(material); 
...
【執行結果】

// 建立Sphere物件
Sphere sphere = new Sphere(200); 
sphere.setTranslateX(200); 
sphere.setTranslateY(200); 

// 建立PhongMaterial物件
PhongMaterial material = new PhongMaterial(); 
// 設定Diffuse Map貼圖
material.setDiffuseMap(new Image(getClass().getResourceAsStream(
  "images/earth_diffuse_map.jpg"), 512, 256, true, true)); 

sphere.setMaterial(material); 
...
【執行結果】

// 建立Sphere物件
Sphere sphere = new Sphere(200); 
sphere.setTranslateX(200); 
sphere.setTranslateY(200); 

// 建立PhongMaterial物件
PhongMaterial material = new PhongMaterial(); 
// 設定Specular Map貼圖
material.setSpecularMap(new Image(getClass().getResourceAsStream(
  "images/earth_specular_map.jpg"), 512, 256, true, true));

sphere.setMaterial(material); 
...
【執行結果】
以下為同時設定三種貼圖，產生立體的效果：
// 建立Sphere物件
Sphere sphere = new Sphere(200); 
sphere.setTranslateX(200); 
sphere.setTranslateY(200); 

// 建立PhongMaterial物件
PhongMaterial material = new PhongMaterial(); 
// 設定Bump Map貼圖
material.setBumpMap(new Image(getClass().getResourceAsStream(  
  "images/earth_normal_map.jpg"), 512, 256, true, true)); 
// 設定Diffuse Map貼圖
material.setDiffuseMap(new Image(getClass().getResourceAsStream(
  "images/earth_diffuse_map.jpg"), 512, 256, true, true)); 
// 設定Specular Map貼圖
material.setSpecularMap(new Image(getClass().getResourceAsStream(
  "images/earth_specular_map.jpg"), 512, 256, true, true));

sphere.setMaterial(material); 
...
【執行結果】
以下示範設定著色的效果：
// 建立Sphere物件
Sphere sphere = new Sphere(200); 
// 以填滿方式呈現
sphere.setDrawMode(DrawMode.FILL); 
// 省略背面
sphere.setCullFace(CullFace.BACK); 
sphere.setTranslateX(200); 
sphere.setTranslateY(200); 

// 建立PhongMaterial物件
PhongMaterial material = new PhongMaterial(); 
// 設定Diffuse Color
material.setDiffuseColor(Color.AQUA);

sphere.setMaterial(material); 
...
【執行結果】
// 建立Sphere物件
Sphere sphere = new Sphere(200); 
// 以填滿方式呈現
sphere.setDrawMode(DrawMode.FILL); 
// 省略背面
sphere.setCullFace(CullFace.BACK); 
sphere.setTranslateX(200); 
sphere.setTranslateY(200); 

// 建立PhongMaterial物件
PhongMaterial material = new PhongMaterial(); 
// 設定Specular Color
material.setSpecularColor(Color.AQUA);

sphere.setMaterial(material); 
...
【執行結果】
以下為同時設定兩種著色的效果：
// 建立Sphere物件
Sphere sphere = new Sphere(200); 
// 以填滿方式呈現
sphere.setDrawMode(DrawMode.FILL); 
// 省略背面
sphere.setCullFace(CullFace.BACK); 
sphere.setTranslateX(200); 
sphere.setTranslateY(200); 

// 建立PhongMaterial物件
PhongMaterial material = new PhongMaterial(); 
// 設定Diffuse Color
material.setDiffuseColor(Color.AQUA);
// 設定Specular Color
material.setSpecularColor(Color.AQUA);

sphere.setMaterial(material); 
...
【執行結果】
最後是同時設定以上五種效果：
// 建立Sphere物件
Sphere sphere = new Sphere(200); 
// 以填滿方式呈現
sphere.setDrawMode(DrawMode.FILL); 
// 省略背面
sphere.setCullFace(CullFace.BACK); 
sphere.setTranslateX(200); 
sphere.setTranslateY(200); 

// 建立PhongMaterial物件
PhongMaterial material = new PhongMaterial(); 
// 設定Bump Map貼圖
material.setBumpMap(new Image(getClass().getResourceAsStream(  
  "images/earth_normal_map.jpg"), 512, 256, true, true)); 
// 設定Diffuse Map貼圖
material.setDiffuseMap(new Image(getClass().getResourceAsStream( 
  "images/earth_diffuse_map.jpg"), 512, 256, true, true)); 
// 設定Specular Map貼圖
material.setSpecularMap(new Image(getClass().getResourceAsStream(
  "images/earth_specular_map.jpg"), 512, 256, true, true));
// 設定Diffuse Color
material.setDiffuseColor(Color.AQUA);
// 設定Specular Color
material.setSpecularColor(Color.AQUA);

sphere.setMaterial(material); 
...
【執行結果】
【參考資料】

[1] 黃嘉輝，深入研究JavaFX 2。
[2] 黃嘉輝，JavaFX遊戲程式設計。
[3] Java Official Web Site：http://www.oracle.com/technetwork/java/index.html
[4] JavaFX：http://www.oracle.com/technetwork/java/javafx
[5] JavaFX 8.0 API Specification.
[6] Java Platform, Standard Edition 8 API Specification.
[7] JDK 8 Certified System Configurations

© Chia-Hui Huang
張貼者： 於
標籤： ,

沒有留言:

張貼留言

訂閱： 張貼留言 (Atom)