ta_ka_tsu
September 02, 2018
2k

# 作ってわかるレンダリングパイプライン〜CPUで3D描画〜

iOSDC 2018 発表資料

## ta_ka_tsu

September 02, 2018

## Transcript

ɾҐஔ ɾଐੑ&

31. ### ௖఺ॲཧɿΫϦοϐϯά ΫϦοϐϯάۭؒ .FUBMͰ͸ −1 ≦ x ≦ 1 −1 ≦

y ≦ 1 0 ≦ z ≦ 1

ϓϦϛςΟϒΞηϯϒϦ

44. ### 1PJOUT ϓϦϛςΟϒΞηϯϒϦ V[1] V[2] V[3] V[4] Point[0] Point[1] Point[2] Point[3]

Point[4] V[0]

Line[3]

49. ### 5SJBOHMF'BO ϓϦϛςΟϒΞηϯϒϦ -JOF-PPQ Triangle[0] Triangle[1] Triangle[2] Line[0] Line[1] Line[2] Line[3]

Line[4] V[0] V[1] V[2] V[3] V[4] V[4] V[0] V[1] V[2] V[3]

൓࣌ܭճΓ \$\$8 PS

62. ### ϥελϥΠζɿϑϥάϝϯτͷ஋ P0 P1 P s t P = t s

+ t P0 + s s + t P1 = w0 P0 + w1 P1 (w0 + w1 = 1) AP = w0 AP0 + w1 AP1 AX ɿ఺ X ͷଐੑ஋

65. ### ϥελϥΠζɿϑϥάϝϯτͷ஋ P0 P1 Q s1 t1 Q = t1 s1

+ t1 P0 + s1 s1 + t1 P1 = w0 P0 + w1 P1 + w2 P2 (w0 + w1 + w2 = 1) P P2 s2 t2 P = t2 s2 + t2 Q + s2 s2 + t2 P2 AP = w0 AP0 + w1 AP1 + w2 AP2

ϑϥάϝϯτ γΣʔμʔ
69. ### ϑϥάϝϯτॲཧ ϑϥά ϝϯτ ɾϐΫηϧ࠲ඪ ɾଐੑ" ɾଐੑ# ɾ;஋ ɾϐΫηϧ࠲ඪ ɾ৭ ɾ;஋

ɾ ڞ௨σʔλ ৭ ϑϥά ϝϯτ ϑϥάϝϯτ γΣʔμʔ

74. ### ϐΫηϧૢ࡞ɿσϓεςετ Φϓγϣϯ ௨աͨ͠;஋Λ ্ॻ͖ 0.6 0.4 0.2 σϓεόοϑΝ 0.6 0.4

0.2 0.6 0.4 0.2 0.6 0.4 0.2 0.5 0.5 0.5 0.5 0.5 0.5 0.6 0.5 0.5 0.6 0.5 0.5 0.6 0.4 0.5 0.6 0.4 0.2 0.5 0.5 0.5 0.5 0.5 σϓεόοϑΝ ϑϥά ϝϯτ ϑϥά ϝϯτ

78. ### ࠞͥ߹ΘͤՄೳͳܕ protocol Addable { static func +(lhs:Self, rhs:Self) -> Self

} protocol Scalable { static func *(scale:Float, value:Self) -> Self } protocol Blendable : Addable, Scalable { }
79. ### ৭ͷ४උ struct Color4f : Blendable { let r: Float let

g: Float let b: Float let a: Float }
80. ### ৭ͷ४උ struct Color4ui { let r: UInt8 let g: UInt8

let b: UInt8 let a: UInt8 }
81. ### ௖఺ͷ४උ class Vertex3<T:Blendable> { var position : float3 var attribute

: T . . . } class Vertex4<T:Blendable> { var position : float4 var attribute : T . . . }
82. ### ϑϥάϝϯτͷ४උ class Fragment<T:Blendable> { let x: Int let y: Int

let z: Float let attribute: T . . . }
83. ### ϑϨʔϜόοϑΝͷ४උ protocol BufferPlane { associatedtype CellType var width: Int {

get } var height: Int { get } subscript(x: Int, y: Int) -> CellType { get set } }
84. ### class ColorBuffer : BufferPlane { let width: Int let height:

Int subscript (x: Int, y: Int) -> Color4ui { . . . } } ϑϨʔϜόοϑΝͷ४උ
85. ### class DepthBuffer : BufferPlane { let width: Int let height:

Int subscript (x: Int, y: Int) -> Float { . . . } } ϑϨʔϜόοϑΝͷ४උ

87. ### Ϗϡʔϙʔτͷ४උ class Viewport { let x: Int let y: Int

let width: Int let height: Int . . . }
88. ### ύΠϓϥΠϯͷ४උ class RenderPipeline<T:Blendable, U:Blendable> { var vertexBuffer : [Vertex4<T>]! var

viewport: Viewport? var vertexShader : ((Vertex4<T>) -> Vertex4<U>)! var fragmentShader : ((Fragment<U>) -> Color4f?)! var colorBuffer : ColorBuffer! var depthBuffer : DepthBuffer? . . . }

90. ### ௖఺ॲཧ let convertedVertices = vertexBuffer.map { (vertex:Vertex4<T>) -> Vertex3<U> in

let v = vertexShader(vertex) // divide by w let pos = v.position.project() // Viewport Transformation let screenPosition = transform(position: pos, toViewport: vp) return Vertex3<U>(position: screenPosition, attribute: v.attribute) }
91. ### ϓϦ ϛ ςΟϒ ΞηϯϒϦ ϥελϥΠζ ϑϥάϝϯτॲཧ ϐΫηϧૢ࡞ ϑϨʔϜόοϑΝ ௖఺ྻ ௖఺ॲཧ

ϓϦϛςΟϒΞηϯϒϦ ͷ ࠶ߏங
92. ### ϓϦϛςΟϒΞηϯϒϦ enum Primitive<T:Blendable> { case point(Vertex3<T>) case line(Vertex3<T>, Vertex3<T>) case

triangle(Vertex3<T>, Vertex3<T>, Vertex3<T>) }
93. ### ϓϦϛςΟϒΞηϯϒϦ var primitives: [Primitive<U>] . . . let numOfTriangles =

convertedVertices.count / 3 primitives = (0..<numOfTriangles).map { Primitive<U>.triangle(convertedVertices[\$0*3], convertedVertices[\$0*3 + 1], convertedVertices[\$0*3 + 2]) }.filter{ (primitive) -> Bool in if cullFace { return primitive.isCCW() } else { return true } }

95. ### ϥελϥΠζ var result = [Fragment<U>]() . . .// minX, maxX,

minY, maxYΛٻΊ͓ͯ͘ for py in minY..<maxY { for px in minX..<maxX { let p = float2(Float(px) + 0.5, Float(py) + 0.5) let (w1, w2, w3) = weight(v1: v1, v2: v2, v3: v3, of: p) ?? (-1, -1, -1) if w1 < 0 || w2 < 0 || w3 < 0 { continue } let eachZ = w1 * v1.position.z + w2 * v2.position.z + w3 * v3.position.z let eachAttr = w1 * v1.attribute + w2 * v2.attribute + w3 * v3.attribute result.append(Fragment(x: px, y: py, z: eachZ, attribute: eachAttr)) } }
96. ### ͷ ࠶ߏங ϑϥά ϝϯτ ॲཧ ϓϦϛςΟϒΞηϯϒϦ ϐΫηϧૢ࡞ ϑϨʔϜόοϑΝ ௖఺ྻ ௖఺ॲཧ

ϥελϥΠζ ϑϥάϝϯτॲཧ
97. ### ϑϥά ϝϯτॲཧ // Fragment Processing let fragmentResults = fragments.map{ (fragment)

-> Fragment<Color4f>? in if let color = fragmentShader(fragment) { return Fragment<Color4f>( x: fragment.x, y: fragment.y, z: fragment.z, attribute: color) } else { return nil } }.compactMap { \$0 }

ϐΫηϧૢ࡞
99. ### ϐΫηϧૢ࡞ // Per Sampling Operation fragmentResults.forEach { (fragment) in if

let depthBuffer = depthBuffer { if depthBuffer[fragment.x, fragment.y] > fragment.z { return } depthBuffer[fragment.x, fragment.y] = fragment.z } colorBuffer[fragment.x, fragment.y] = fragment.attribute.toColor4ui() }