KOTLIN for GRAPHICS @romainguy Android KTX Dealing with legacy - - PowerPoint PPT Presentation

kotlin
SMART_READER_LITE
LIVE PREVIEW

KOTLIN for GRAPHICS @romainguy Android KTX Dealing with legacy - - PowerPoint PPT Presentation

KOTLIN for GRAPHICS @romainguy Android KTX Dealing with legacy // Pack a color int val color = ((a and 0xff) shl 24) or ((r and 0xff) shl 16) or ((g and 0xff) shl 8) or ((b and 0xff) ) // Unpack a color int val a = (color shr


slide-1
SLIDE 1

GRAPHICS

KOTLIN


for

@romainguy

slide-2
SLIDE 2

Android KTX

slide-3
SLIDE 3

Dealing with legacy

slide-4
SLIDE 4

// Pack a color int val color = ((a and 0xff) shl 24) or ((r and 0xff) shl 16) or ((g and 0xff) shl 8) or ((b and 0xff) ) // Unpack a color int val a = (color shr 24) and 0xff val r = (color shr 16) and 0xff val g = (color shr 8) and 0xff val b = (color ) and 0xff

slide-5
SLIDE 5

inline val @receiver:ColorInt Int.alpha get() = (this shr 24) and 0xff inline val @receiver:ColorInt Int.red get() = (this shr 16) and 0xff inline val @receiver:ColorInt Int.green get() = (this shr 8) and 0xff inline val @receiver:ColorInt Int.blue get() = (this ) and 0xff

slide-6
SLIDE 6

val a = color.alpha val r = color.red val g = color.green val b = color.blue

slide-7
SLIDE 7

inline operator fun @receiver:ColorInt Int.component1() = this.alpha inline operator fun @receiver:ColorInt Int.component2() = this.red inline operator fun @receiver:ColorInt Int.component3() = this.green inline operator fun @receiver:ColorInt Int.component4() = this.blue

slide-8
SLIDE 8

val (a, r, g, b) = color

slide-9
SLIDE 9

Destructure everything

slide-10
SLIDE 10

// Points
 val (x, y) = PointF(1.0f, 2.0f) + PointF(3.0f, 4.0f)
 
 // Rectangles
 val (l, t, r, b) = Rect(0, 0, 4, 4) and Rect(2, 2, 6, 6)
 // Matrix
 val (right, up, forward, eye) = viewMatrix val (x, y, z) = eye

slide-11
SLIDE 11

Implement operators

slide-12
SLIDE 12

Kotlin Arithmetic operators Set operators

plus +

∪ (union)

minus – – (difference) times × div / and

∪ (union)

  • r

∩ (intersection)

xor

⊖ (symmetric difference)

not

U \ (complement)

slide-13
SLIDE 13

// Intersection val r = RectF(0.0f, 0.0f, 4.0f, 4.0f) or RectF(2.0f, 2.0f, 6.0f, 6.0f) // Symmetric difference val r = Rect(0, 0, 4, 4) xor Rect(2, 2, 6, 6) // Difference val path = circle - square // Offset val (l, t, r, b) = Rect(0, 0, 2, 2) + 2 val (l, t, r, b) = Rect(0, 0, 2, 2) - Point(1, 2)

slide-14
SLIDE 14

inline operator fun Rect.contains(p: PointF) = contains(p.x, p.y)

slide-15
SLIDE 15

if (PointF(x, y) in path.bounds) { // Hit detected }

slide-16
SLIDE 16

inline operator fun Bitmap.get(x: Int, y: Int) = getPixel(x, y) inline operator fun Bitmap.set(x: Int, y: Int, @ColorInt color: Int) =
 setPixel(x, y, color)

slide-17
SLIDE 17

val b = getBitmap() val a = b[1, 1].alpha if (a < 255) { b[1, 1] = 0xff_00_00_00 }

slide-18
SLIDE 18

inline operator fun Bitmap.get(x: IntRange, y: IntRange): IntArray

slide-19
SLIDE 19

bitmap[16..32, 16..32].forEach { val (_, r, g, b) = it }

slide-20
SLIDE 20

All together

slide-21
SLIDE 21

if (bounds.contains(hit.x, hit.y)) { val pixel = Bitmap.createBitmap(width, height, ARGB_8888).let { with(Canvas(it)) {
 save()
 scale(2.0f, 2.0f)
 val path = Path().apply { op(path1, path2, DIFFERENCE) }
 drawPath(path, paint)
 restore()
 } it.getPixel(hit.x, hit.y)
 } val r = Color.red(pixel)
 val g = Color.green(pixel)
 val b = Color.blue(pixel)
 }

slide-22
SLIDE 22

if (hit in bounds) { val (_, r, g, b) = createBitmap(width, height).applyCanvas { withScale(2.0f, 2.0f) { drawPath(path1 - path2, paint) } }[hit.x, hit.y] }

slide-23
SLIDE 23
slide-24
SLIDE 24 vec3 color = vec3(0.65, 0.85, 1.0) + direction.y * 0.72; // (distance, material) vec2 hit = traceRay(origin, direction); float distance = hit.x; float material = hit.y; // We've hit something in the scene if (material > 0.0) { vec3 lightDir = vec3(0.6, 0.7, -0.7); vec3 position = origin + distance * direction; vec3 v = normalize(-direction); vec3 n = normal(position); vec3 l = normalize(lightDir); vec3 h = normalize(v + l); vec3 r = normalize(reflect(direction, n)); float NoV = abs(dot(n, v)) + 1e-5; float NoL = saturate(dot(n, l)); float NoH = saturate(dot(n, h)); float LoH = saturate(dot(l, h)); // ... }
slide-25
SLIDE 25 var color = Float3(0.65f, 0.85f, 1.0f) + direction.y * 0.72f // (distance, material) val hit = traceRay(origin, direction) val distance = hit.x val material = hit.y // We've hit something in the scene if (material > 0.0f) { val lightDir = Float3(0.6f, 0.7f, -0.7f) val position = origin + distance * direction val v = normalize(-direction) val n = normal(position) val l = normalize(lightDir) val h = normalize(v + l) val r = normalize(reflect(direction, n)) val NoV = abs(dot(n, v)) + 1e-5f val NoL = saturate(dot(n, l)) val NoH = saturate(dot(n, h)) val LoH = saturate(dot(l, h)) // ... }
slide-26
SLIDE 26

Data first Math is functional

slide-27
SLIDE 27

data class Float3(var x: Float = 0.0f, var y: Float = 0.0f, var z: Float = 0.0f)

+ operators

slide-28
SLIDE 28

inline fun abs(v: Float3) = Float3(abs(v.x), abs(v.y), abs(v.z)) inline fun length(v: Float3) = sqrt(v.x * v.x + v.y * v.y + v.z * v.z) inline fun length2(v: Float3) = v.x * v.x + v.y * v.y + v.z * v.z inline fun distance(a: Float3, b: Float3) = length(a - b) inline fun dot(a: Float3, b: Float3) = a.x * b.x + a.y * b.y + a.z * b.z

slide-29
SLIDE 29

fun lookAt( eye: Float3, target: Float3, up: Float3 = Float3(z = 1.0f) ): Mat4 { val f = normalize(target - eye)
 val r = normalize(f x up)
 val u = normalize(r x f)
 return Mat4(r, u, f, eye)
 } val h = normalize(v + l) val r = normalize(reflect(direction, n)) val NoV = abs(dot(n, v)) + 1e-5f val NoL = saturate(dot(n, l))

slide-30
SLIDE 30

Aliasing & swizzling

slide-31
SLIDE 31

vec4 v = vec4(…) // Use XYZ for coordinates vec3 position = v.xyz // Use RGB for color data vec3 color = v.rgb // Swizzling vec3 reverseColor = v.bgr
 vec3 grayColor = v.ggg vec4 twoPositions = v.xyxy

slide-32
SLIDE 32

// In Float4 inline var xy: Float2 get() = Float2(x, y) set(value) { x = value.x y = value.y } inline var rg: Float2 get() = Float2(x, y) set(value) { x = value.x y = value.y }

slide-33
SLIDE 33

enum class VectorComponent {
 X, Y, Z, W,
 R, G, B, A,
 S, T, P, Q
 } 


  • perator fun get(index: VectorComponent) = when (index) {


VectorComponent.X, VectorComponent.R, VectorComponent.S -> x
 VectorComponent.Y, VectorComponent.G, VectorComponent.T -> y
 VectorComponent.Z, VectorComponent.B, VectorComponent.P -> z
 else -> throw IllegalArgumentException(“Unknown index”)
 } 


  • perator fun get(


index1: VectorComponent,
 index2: VectorComponent,
 index3: VectorComponent
 ): Float3 {
 return Float3(get(index1), get(index2), get(index3))
 }

slide-34
SLIDE 34

val v = Float4(…)
 val position = v.xyz
 val color = v.rgb
 val reverseColor = v[B, G, R]
 val grayColor = v[G, G, G] val twoPositions = v[X, Y, X, Y]

slide-35
SLIDE 35

Row major Column major

slide-36
SLIDE 36

right up forward translation

slide-37
SLIDE 37

val transform: Mat4 // 3rd column, first element val x3 = transform[2, 0]
 val x3 = transform.z.x // Math notation // Row-major, 1-based val x3 = transform(1, 3)

slide-38
SLIDE 38

Where there is one there are many

slide-39
SLIDE 39

if (color.r > 0.0f && color.g > 0.0f && color.b > 0.0f) { // ... }

slide-40
SLIDE 40

if (all(color gt Float3(0.0f))) { // ... } // any() for || if (any(color lt black)) { // ... }

slide-41
SLIDE 41

https://github.com/google/filament

slide-42
SLIDE 42

Local extension functions

slide-43
SLIDE 43

private fun createMesh() {
 data class Vertex(val x: Float, val y: Float, val z: Float, val n: Float3)
 fun ByteBuffer.put(v: Vertex): ByteBuffer {
 putFloat(v.x)
 putFloat(v.y)
 putFloat(v.z)
 v.n.forEach { putFloat(it) }
 return this
 }
 val vertexData = ByteBuffer.allocate(vertexCount * vertexSize)
 .order(ByteOrder.nativeOrder())
 // Face -Z
 .put(Vertex(-1.0f, -1.0f, -1.0f, Float3(0.0f, 0.0f, -1.0f)))
 .put(Vertex(-1.0f, 1.0f, -1.0f, Float3(0.0f, 0.0f, -1.0f)))
 // ...
 // Build mesh with vertexData
 }

slide-44
SLIDE 44

1.3

slide-45
SLIDE 45

Unsigned Integers

slide-46
SLIDE 46

UInt

slide-47
SLIDE 47

UInt represents natural numbers

slide-48
SLIDE 48

@ColorInt

  • perator fun Bitmap.get(x: Int, y: Int): Int

// Can x and y be < 0? // Will it throw, clamp or wrap around? myBitmap[-1, -1]

slide-49
SLIDE 49

@ColorInt

  • perator fun Bitmap.get(x: UInt, y: UInt): Int

// No more ambiguity myBitmap[-1, -1]

Conversion of signed constants to unsigned ones is

slide-50
SLIDE 50

Kotlin

Signed Byte Short Int Long Unsigned Char UInt ULong

slide-51
SLIDE 51

JVM/ART

Signed byte short int long Unsigned char

slide-52
SLIDE 52

val a: UInt = //... val b: UInt = //... val c = a + b

slide-53
SLIDE 53

1: iload 4 // load a 2: iload 5 // load b 3: iadd 4: invokestatic #13 // kotlin/UInt."constructor-impl":(I)I 5: istore_3

slide-54
SLIDE 54

4: invokestatic #13 // kotlin/UInt."constructor-impl":(I)I

slide-55
SLIDE 55

public static int constructor-impl(int); Code: 0: iload_0 1: ireturn

slide-56
SLIDE 56

1: iload 4 // load a 2: iload 5 // load b 3: isub 4: invokestatic #13 // kotlin/UInt."constructor-impl":(I)I 5: istore_3

slide-57
SLIDE 57

1: iload 4 // load a 2: iload 5 // load b 3: imul 4: invokestatic #13 // kotlin/UInt."constructor-impl":(I)I 5: istore_3

slide-58
SLIDE 58

1: iload 4 // load a 2: iload 5 // load b 3: invokestatic #91 // kotlin/UnsignedKt."uintDivide-J1ME1BU":(II)I 4: invokestatic #13 // kotlin/UInt."constructor-impl":(I)I 5: istore_3

slide-59
SLIDE 59

UInt

slide-60
SLIDE 60

UInt

slide-61
SLIDE 61

Inline Classes

slide-62
SLIDE 62

Inline classes are a zero-cost* abstraction

* When used right
slide-63
SLIDE 63
  • Wraps a single value
  • The underlying value is read-only
  • Single constructor
  • Can only implement interfaces
  • equals/hashcode/toString for free
  • Cannot be used as vararg*
* Unless you are UInt/ULong
slide-64
SLIDE 64

inline class Color(private val c: Int) { val a: Int get() = (c shr 24) and 0xff val r: Int get() = (c shr 16) and 0xff val g: Int get() = (c shr 8) and 0xff val b: Int get() = (c ) and 0xff }

slide-65
SLIDE 65

fun printColor(color: Color) { println(""" red = ${color.r / 255f} green = ${color.g / 255f} blue = ${color.b / 255f} alpha = ${color.a / 255f} """.trimIndent()) } val color = Color(0x7f_10_20_30) printColor(color)

slide-66
SLIDE 66

0: ldc #163 // int 2131763248 1: invokestatic #164 // Method Color."constructor-impl":(I)I 2: istore 7 3: iload 7 4: invokestatic #166 // Method "printColor-M0a6fYQ":(I)V val color = Color(0x7f_10_20_30)

slide-67
SLIDE 67

public static final void printColor-M0a6fYQ(int);
 0: iload_0 1: invokestatic #112 // Method Color.”getR-impl":(I)I fun printColor(color: Color) public static final int getR-impl(int); 0: iload_0 1: bipush 16 2: ishr 3: sipush 255 4: iand 5: ireturn

slide-68
SLIDE 68

Be careful with auto-boxing

slide-69
SLIDE 69
  • Nullable types
  • Inside collections, arrays, etc.
  • When Object or Any is expected
slide-70
SLIDE 70

val a = Color(0x7f_10_20_30)
 val b = Color(0x7f_30_20_10)
 println(a == b) println(a.equals(b))

slide-71
SLIDE 71

1: iload_2 2: invokestatic #152 // Method Color."box-impl":(I)LColor; 3: iload_1 4: invokestatic #152 // Method Color."box-impl":(I)LColor; 5: invokestatic #163 // Method kotlin/jvm/internal/Intrinsics.


//.areEqual:(Ljava/lang/Object;Ljava/lang/Object;)Z

a == b

slide-72
SLIDE 72

1: iload_2 2: iload_1 3: invokestatic #152 // Method Color."box-impl":(I)LColor; 4: invokestatic #156 // Method Color."equals-impl":(ILjava/lang/Object;)Z

a.equals(b)

slide-73
SLIDE 73

inline class Color(private val value: Int) { val a: Int get() = (value shr 24) and 0xff val r: Int get() = (value shr 16) and 0xff val g: Int get() = (value shr 8) and 0xff val b: Int get() = (value ) and 0xff }

slide-74
SLIDE 74

inline class Color(val value: Int) { val a: Int get() = (value shr 24) and 0xff val r: Int get() = (value shr 16) and 0xff val g: Int get() = (value shr 8) and 0xff val b: Int get() = (value ) and 0xff }

slide-75
SLIDE 75

val a = Color(0x7f_10_20_30)
 val b = Color(0x7f_30_20_10)
 println(a.value == b.value)

slide-76
SLIDE 76

var s = “” // Boxing!
 s += a 
 // No boxing
 s += a.toString()

slide-77
SLIDE 77

Coroutines

slide-78
SLIDE 78

Render Culling N Sorting Shadow Color GC Lights N N N N N Driver

N

slide-79
SLIDE 79

private fun startRender(image: BufferedImage, viewer: ImageViewer) { GlobalScope.launch { while (true) { runBlocking { renderTiles(image, viewer) } } } }

slide-80
SLIDE 80

private val NumCpu = Runtime.getRuntime().availableProcessors() private val TilesDispatcher = newFixedThreadPoolContext(NumCpu * 3, "Renderer") private suspend fun renderTiles(image: BufferedImage, viewer: ImageViewer) { // ... coroutineScope { repeat(NumCpu) { i -> repeat(NumCpu).forEach { j -> // ... launch(TilesDispatcher) { val pixels = renderTile(x, y, w, h, resolution, time) viewer.pushUpdate(x, height - h - y, w, h, pixels) } } } } }

slide-81
SLIDE 81

Kotlin scripting

slide-82
SLIDE 82

My wishlist

slide-83
SLIDE 83

User-defined literals

slide-84
SLIDE 84

inline class Half(private val s: Short) {
 fun toFloat(): Float = // ...
 } 
 fun Float.toHalf(): Half = // ... 
 suffix operator fun Float._h() = this.toHalf()

slide-85
SLIDE 85

// pi is of type Half val pi = 3.1415_h

slide-86
SLIDE 86

// 2.0_s returns 2,000 ms suffix operator fun Float._ns() = this / 1_000f suffix operator fun Float._ms() = this suffix operator fun Float._s() = this * 1_000f suffix operator fun Float._m() = this * 60_000f suffix operator fun Float._h() = this * 1_440_000f

slide-87
SLIDE 87

Short-form constructors

slide-88
SLIDE 88

data class Vec3(x: Float, y: Float, z: Float) fun lookAt(pos: Vec3) = // ... lookAt([1f, 2f, 3f])

slide-89
SLIDE 89

data class Vertex(pos: Float3, normal: Float3) addVertex([[1f, 2f, 3f], [0f, 0f, 1f]])

slide-90
SLIDE 90

Linear allocations

slide-91
SLIDE 91

Kotlin/GPU

slide-92
SLIDE 92

Where to find some code

kotlin-math


https://github.com/romainguy/kotlin-math

filament


https://github.com/google/filament https://google.github.io/filament/Filament.md.html

kotlin-shadertoy

https://goo.gl/TFKUwP

slide-93
SLIDE 93

Talks this week

Mathematical modeling with Kotlin
 Today @13:00 Build a game using libGDX and Kotlin
 Today @15:15 Porting D3.js to Kotlin Multiplatform
 Tomorrow @13:00

slide-94
SLIDE 94

Questions?