15-《ARKit by Tutorials》讀書筆記2：時空門

蘋果API搬運工發表於2018-11-21
筆記

說明

ARKit系列文章目錄

本文是Ray Wenderlich上《ARKit by Tutorials》的讀書筆記,主要講內容概要和讀後感  

該書推出了三個免費章節,主講如何製作一個時空門app:第7,8,9章,我對其進行了完整翻譯,而本文是對以下三章內容的總結和感想:

第一篇:準備開始

主要講了初始的準備工作,ARSession的啟動,平面檢測,debug選項

15-《ARKit by Tutorials》讀書筆記2：時空門
session被打斷後的處理,平面更新處理等

第二篇:新增物體

主要講了命中測試Hit testing來給螢幕中央處新增錨點

var viewCenter: CGPoint {
  let viewBounds = view.bounds
  return CGPoint(x: viewBounds.width / 2.0, y: viewBounds.height / 2.0)
}


// 1
override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) {
  // 2
  if let hit = sceneView?.hitTest(viewCenter, types: [.existingPlaneUsingExtent]).first {
    // 3
    sceneView?.session.add(anchor: ARAnchor.init(transform: hit.worldTransform))      
  }
}
複製程式碼

利用命中測試,可以知道螢幕中心是否對準了一個平面

15-《ARKit by Tutorials》讀書筆記2：時空門

這樣當對準平面時就可以點選螢幕新增3D物體了

第三篇:材質和光照

主要講了大量材質紋理的實際使用,包括wrapping mode等wrapT,wrapS

還有燈光的使用

本章節中最有趣的部分就是:如何讓時空門從外面無法看到(從外面只能看到門框),而進入門內,所有東西都能看到.就是這種效果:

15-《ARKit by Tutorials》讀書筆記2：時空門
15-《ARKit by Tutorials》讀書筆記2：時空門

做法非常神奇:在牆壁的外側再包一層幾乎透明的幾何體(SCNBox的transparency = 0.000001),並控制外層的渲染順序(renderingOrder),讓它比內部的物體更早渲染出來

func makeOuterSurfaceNode(width: CGFloat,
                          height: CGFloat,
                          length: CGFloat) -> SCNNode {
  // 1
  let outerSurface = SCNBox(width: width,
                            height: height,
                            length: length,
                            chamferRadius: 0)

  // 2
  outerSurface.firstMaterial?.diffuse.contents = UIColor.white
  outerSurface.firstMaterial?.transparency = 0.000001

  // 3
  let outerSurfaceNode = SCNNode(geometry: outerSurface)
  outerSurfaceNode.renderingOrder = 10
  return outerSurfaceNode
}
複製程式碼

程式碼解釋:

  1. 建立一個outerSurface場景立方體幾何體物件,尺寸和地板與天花板相同.
  2. 新增可見內容到立方體物件的漫反射屬性,使其渲染出來.設定transparency(透明度) 為非常低的數值,這樣這個物體就從檢視中隱藏起來.
  3. 從outerSurface幾何體建立一個SCNNode物件.設定節點的renderingOrder(渲染順序) 為10.節點的渲染順序值越大就渲染得越晚.為了讓地板和天花板從時空門外面不可見,你將需要使內部的天花板和地板節點的渲染順序遠大於10.

由於時空門app的製作過程已經由官方作為免費章節釋出,我也全部翻譯了出來.本文只列出了重點內容,如有需要請精讀原文或譯文.

自從ARKit釋出後,網上類似時空門這類Demo就火了起來,但很多人只公開了視訊效果,並沒有公開程式碼.相信大多數人和我一樣,雖然整體上感覺不難,但始終不明白這種外面看不到牆壁的效果是如何實現的,這本書終於幫我們解開了疑惑.

第二部分讀書筆記結束!

相關文章