🔧 ┠ 6. Extension 함수 — OPENRNDR 스타일의 핵심

BamgasiJM·2026년 9월 28일

목록 보기

6/17

그리기 명령을 Drawer 객체로 호출하다 보면 격자나 방사형 배치처럼 같은 계산이 반복됩니다.

extend {
    drawer.clear(ColorRGBa.BLACK)
    drawer.circle(400.0, 400.0, 100.0)
}

격자는 반복문으로 직접 그릴 수 있습니다.

extend {
    for (x in 0 until 10) {
        for (y in 0 until 10) {
            val px = x * 80.0
            val py = y * 80.0
            drawer.circle(px, py, 20.0)
        }
    }
}

같은 배치 규칙을 여러 작품에서 쓴다면 계산을 확장 함수로 묶을 수 있습니다.

extend {
    drawer.grid(10, 10, 80.0, 20.0)
}

Drawer를 리시버로 선언한 확장 함수를 정의하면 drawer.grid(...)처럼 호출할 수 있습니다. 이 호출 문법은 멤버 메서드와 비슷하지만, Drawer 클래스 자체에 멤버를 추가하지는 않습니다.

Extension 함수란?

확장 함수는 기존 타입을 리시버로 받는 함수를 선언해 그 타입의 값에서 메서드처럼 호출하게 합니다. 타입의 소스나 런타임 구조를 바꾸지 않으며, 접근할 수 있는 멤버도 해당 위치에서 원래 접근 가능한 범위로 제한됩니다.

기본 문법

// 정수 클래스에 새 메서드 추가
fun Int.isEven(): Boolean {
    return this % 2 == 0
}

// 사용
val num = 10
println(num.isEven())  // true

구조:

fun 클래스이름.메서드이름(파라미터): 반환타입 {
    // this는 자동으로 클래스의 인스턴스
}

더 복잡한 예제

// String 클래스에 "단어 개수 세기" 메서드 추가
fun String.wordCount(): Int {
    return this.split(" ").size
}

val text = "Hello World OPENRNDR"
println(text.wordCount())  // 3

확장 함수 본문에서 this는 리시버인 String 값입니다. 확장 함수는 정적으로 해석되므로, 같은 객체라도 컴파일 시점에 알려진 변수 타입에 따라 호출되는 확장 함수가 달라질 수 있습니다. 실제 멤버 함수가 같은 이름으로 있으면 멤버가 우선합니다.

OPENRNDR에서의 Extension 함수

왜 중요한가?

그리기와 좌표 계산에 반복되는 패턴을 이름 있는 함수로 묶으면 호출부에서 매개변수와 목적을 읽기 쉽습니다.

// 1단계: 반복되는 코드 발견
extend {
    // 격자 패턴을 매번 이렇게 쓴다
    for (x in 0 until 10) {
        for (y in 0 until 10) {
            drawer.circle(x * 80.0, y * 80.0, 20.0)
        }
    }
}

// 2단계: Extension 함수로 추상화
fun Drawer.grid(cols: Int, rows: Int, spacing: Double, radius: Double = 20.0) {
    for (x in 0 until cols) {
        for (y in 0 until rows) {
            circle(x * spacing, y * spacing, radius)
        }
    }
}

// 3단계: 간단하게 사용
extend {
    drawer.grid(10, 10, 80.0)
}

p5.js와의 비교

p5.js: 별도 함수를 정의하는 방식

p5.js에서는 새 함수를 만들어야 합니다:

function drawGrid(cols, rows, spacing) {
    for (let x = 0; x < cols; x++) {
        for (let y = 0; y < rows; y++) {
            circle(x * spacing, y * spacing, 20);
        }
    }
}

function draw() {
    background(0);
    drawGrid(10, 10, 80);
}

drawGrid는 전역 함수로 정의됩니다. 프로젝트가 커지면 함수 이름과 그리기 대상의 관계를 작성자가 관리해야 합니다.

OPENRNDR: 메서드처럼 사용

fun Drawer.grid(cols: Int, rows: Int, spacing: Double) {
    for (x in 0 until cols) {
        for (y in 0 until rows) {
            circle(x * spacing, y * spacing, 20.0)
        }
    }
}

extend {
    drawer.grid(10, 10, 80.0)  // Drawer의 메서드처럼!
}

확장 함수의 리시버 타입이 Drawer이므로 호출부의 drawer.grid(...)에서 그리기 대상과 패턴 함수의 관계를 함께 읽을 수 있습니다. grid는 Drawer의 멤버 함수가 아니며, 확장 함수가 선언된 파일이나 패키지 범위에서 사용할 수 있습니다.

실전 예제 1: 격자 그리기

// Extension 함수 정의
fun Drawer.grid(
    cols: Int,
    rows: Int,
    spacing: Double,
    radius: Double = 20.0
) {
    for (x in 0 until cols) {
        for (y in 0 until rows) {
            circle(x * spacing, y * spacing, radius)
        }
    }
}

program {
    extend {
        drawer.clear(ColorRGBa.BLACK)
        drawer.fill = ColorRGBa.WHITE
        drawer.grid(12, 12, 60.0, 15.0)
    }
}

사용의 편의성:

drawer.grid(12, 12, 60.0, 15.0) 호출로 이중 반복과 좌표 계산을 숨깁니다.
간격과 반지름을 인자로 바꾸어 같은 배치 규칙을 재사용합니다.

실전 예제 2: 원형 배치

// 중심 주위에 원형으로 배치
fun Drawer.radialLayout(
    count: Int,
    distance: Double,
    radius: Double = 20.0,
    centerX: Double = 400.0,
    centerY: Double = 400.0
) {
    require(count > 0) { "count must be positive" }
    for (i in 0 until count) {
        val angle = TWO_PI * i / count
        val x = centerX + distance * cos(angle)
        val y = centerY + distance * sin(angle)
        circle(x, y, radius)
    }
}

program {
    extend {
        drawer.clear(ColorRGBa.BLACK)
        drawer.fill = ColorRGBa.PINK
        
        // 화면 중앙에서 12개 원을 150 픽셀 거리에 배치
        drawer.radialLayout(12, 150.0, 15.0)
    }
}

실전 예제 3: 나선 그리기

// 나선 패턴
fun Drawer.spiral(
    count: Int,
    spacing: Double,
    rotation: Double = 0.0,
    centerX: Double = 400.0,
    centerY: Double = 400.0
) {
    for (i in 0 until count) {
        val angle = rotation + i * 0.2
        val radius = i * spacing
        val x = centerX + radius * cos(angle)
        val y = centerY + radius * sin(angle)
        point(x, y)
    }
}

program {
    var t = 0.0
    
    extend {
        drawer.clear(ColorRGBa.BLACK)
        drawer.strokeWeight = 2.0
        drawer.stroke = ColorRGBa.CYAN
        
        drawer.spiral(500, 0.5, t)  // 회전하는 나선
        
        t += 0.02
    }
}

고급: `Drawer` + `Vector2` Extension

Vector2에 메서드 추가

// Vector2의 각도와 거리를 얻기
fun Vector2.angle(): Double {
    return atan2(y, x)
}

fun Vector2.magnitude(): Double {
    return sqrt(x * x + y * y)
}

// 사용
val v = Vector2(3.0, 4.0)
println(v.magnitude())  // 5.0
println(v.angle())      // ~0.93 라디안

Drawer와 Vector2 Extension 조합

// Vector2 리스트를 경로로 그리기
fun Drawer.path(points: List<Vector2>, closed: Boolean = false) {
    if (points.isEmpty()) return
    
    for (i in 0 until points.size - 1) {
        lineSegment(points[i], points[i + 1])
    }
    
    if (closed) {
        lineSegment(points.last(), points.first())
    }
}

program {
    extend {
        drawer.clear(ColorRGBa.BLACK)
        drawer.stroke = ColorRGBa.WHITE
        
        val triangle = listOf(
            Vector2(400.0, 200.0),
            Vector2(600.0, 400.0),
            Vector2(200.0, 400.0)
        )
        
        drawer.path(triangle, closed = true)  // 삼각형 그리기
    }
}

기본 파라미터 값 (Default Parameters)

Extension 함수에서 기본값을 지정할 수 있습니다:

// 반지름의 기본값 설정
fun Drawer.grid(
    cols: Int,
    rows: Int,
    spacing: Double,
    radius: Double = 20.0  // 기본값
) {
    for (x in 0 until cols) {
        for (y in 0 until rows) {
            circle(x * spacing, y * spacing, radius)
        }
    }
}

// 사용
extend {
    drawer.grid(10, 10, 80.0)          // radius = 20.0 (기본값)
    drawer.grid(10, 10, 80.0, 30.0)    // radius = 30.0 (명시)
}

좋은 기본값 설계:

자주 쓰는 값을 기본값으로
변경 가능성이 있는 값만 파라미터로

실전 예제 4: 복잡한 패턴

// 동심원(concentric circles)
fun Drawer.concentricCircles(
    count: Int,
    startRadius: Double,
    spacing: Double,
    centerX: Double = 400.0,
    centerY: Double = 400.0
) {
    for (i in 0 until count) {
        val radius = startRadius + i * spacing
        circle(centerX, centerY, radius)
    }
}

// 격자 + 동심원 조합
program {
    var t = 0.0
    
    extend {
        drawer.clear(ColorRGBa.BLACK)
        drawer.fill = ColorRGBa.WHITE
        
        // 격자
        for (x in 0 until 5) {
            for (y in 0 until 5) {
                val cx = 100.0 + x * 160.0
                val cy = 100.0 + y * 160.0
                
                drawer.concentricCircles(
                    count = 3,
                    startRadius = 20.0,
                    spacing = 15.0,
                    centerX = cx,
                    centerY = cy
                )
            }
        }
        
        t += 0.01
    }
}

리시버 체이닝

Extension 함수는 다른 Extension 함수 안에서도 사용할 수 있습니다:

// 기본 Extension
fun Drawer.box(
    x: Double,
    y: Double,
    width: Double,
    height: Double,
    cornerRadius: Double = 0.0
) {
    rectangle(x, y, width, height)
    // 모서리 처리 등...
}

// 다른 Extension을 사용하는 새로운 Extension
fun Drawer.tiled(
    cols: Int,
    rows: Int,
    width: Double,
    height: Double
) {
    for (x in 0 until cols) {
        for (y in 0 until rows) {
            val px = x * width
            val py = y * height
            box(px, py, width, height)  // 다른 Extension 사용
        }
    }
}

extend {
    drawer.tiled(5, 5, 100.0, 100.0)
}

유틸리티 Extension 라이브러리 만들기

자주 쓰는 Extension들을 한 파일에 모아서 라이브러리처럼 사용할 수 있습니다:

// DrawerExtensions.kt (또는 아무 파일)

// 격자
fun Drawer.grid(cols: Int, rows: Int, spacing: Double, radius: Double = 20.0) {
    for (x in 0 until cols) {
        for (y in 0 until rows) {
            circle(x * spacing, y * spacing, radius)
        }
    }
}

// 원형 배치
fun Drawer.radialLayout(
    count: Int,
    distance: Double,
    radius: Double = 20.0,
    centerX: Double = 400.0,
    centerY: Double = 400.0
) {
    require(count > 0)
    for (i in 0 until count) {
        val angle = TWO_PI * i / count
        val x = centerX + distance * cos(angle)
        val y = centerY + distance * sin(angle)
        circle(x, y, radius)
    }
}

// 경로 그리기
fun Drawer.path(points: List<Vector2>, closed: Boolean = false) {
    if (points.isEmpty()) return
    for (i in 0 until points.size - 1) {
        lineSegment(points[i], points[i + 1])
    }
    if (closed) {
        lineSegment(points.last(), points.first())
    }
}

// 나선
fun Drawer.spiral(
    count: Int,
    spacing: Double,
    rotation: Double = 0.0,
    centerX: Double = 400.0,
    centerY: Double = 400.0
) {
    for (i in 0 until count) {
        val angle = rotation + i * 0.2
        val radius = i * spacing
        val x = centerX + radius * cos(angle)
        val y = centerY + radius * sin(angle)
        point(x, y)
    }
}

// --------- 메인 파일에서 사용 ---------

program {
    extend {
        drawer.clear(ColorRGBa.BLACK)
        drawer.fill = ColorRGBa.WHITE
        
        // 모든 Extension 메서드 사용 가능
        drawer.grid(10, 10, 80.0)
        drawer.radialLayout(8, 150.0)
        drawer.spiral(200, 1.0)
    }
}

Vector2 Extension의 실용성

벡터 연산 확장

// 정규화된 벡터 (방향만, 거리는 1)
fun Vector2.normalized(): Vector2 {
    val len = sqrt(x * x + y * y)
    if (len == 0.0) return Vector2(0.0, 0.0)
    return Vector2(x / len, y / len)
}

// 벡터의 회전
fun Vector2.rotated(angleRadians: Double): Vector2 {
    val cos = cos(angleRadians)
    val sin = sin(angleRadians)
    return Vector2(
        x * cos - y * sin,
        x * sin + y * cos
    )
}

// 사용
val v = Vector2(1.0, 1.0)
val rotated = v.rotated(PI / 4)  // 45도 회전
val norm = v.normalized()        // 정규화

실제 활용

program {
    extend {
        drawer.clear(ColorRGBa.BLACK)
        
        val center = Vector2(400.0, 400.0)
        val direction = (mouse.position - center).normalized()
        
        // direction 방향으로 선 그리기
        drawer.lineSegment(center, center + direction * 150.0)
    }
}

실전 예제: 상호작용하는 나선

// 마우스를 따라다니는 나선
fun Drawer.spiralTowards(
    count: Int,
    spacing: Double,
    targetPosition: Vector2,
    rotation: Double = 0.0
) {
    for (i in 0 until count) {
        val angle = rotation + i * 0.2
        val radius = i * spacing
        
        val x = radius * cos(angle)
        val y = radius * sin(angle)
        
        val point = Vector2(x, y) + targetPosition
        circle(point.x, point.y, 2.0)
    }
}

program {
    var t = 0.0
    
    extend {
        drawer.clear(ColorRGBa.BLACK)
        drawer.fill = ColorRGBa.CYAN
        
        spiralTowards(200, 0.8, mouse.position, t)
        
        t += 0.02
    }
}

조건부 로직이 있는 Extension

// 격자 + 선택적 필터링
fun Drawer.selectiveGrid(
    cols: Int,
    rows: Int,
    spacing: Double,
    radius: Double = 20.0,
    shouldDraw: (Int, Int) -> Boolean = { _, _ -> true }  // 기본: 모두 그리기
) {
    for (x in 0 until cols) {
        for (y in 0 until rows) {
            if (shouldDraw(x, y)) {
                circle(x * spacing, y * spacing, radius)
            }
        }
    }
}

// 사용 1: 기본 (모두 그리기)
extend {
    drawer.selectiveGrid(10, 10, 80.0)
}

// 사용 2: 체스판 패턴
extend {
    drawer.selectiveGrid(10, 10, 80.0) { x, y ->
        (x + y) % 2 == 0
    }
}

// 사용 3: 대각선 패턴
extend {
    drawer.selectiveGrid(10, 10, 80.0) { x, y ->
        x == y
    }
}

고급 기능:

마지막 파라미터는 람다 (조건 함수)
기본값으로 "모두 그리기" 제공
호출할 때 조건을 커스터마이징

정리: Extension 함수의 이점

이점	설명
재사용성	반복되는 패턴을 한 번만 정의
명확성	코드의 의도가 명확함
가독성	복잡한 로직을 간단한 메서드 호출로
유지보수	패턴 수정 시 한 곳만 변경
조합	작은 그리기 함수를 호출해 더 큰 패턴 구성
라이브러리화	유틸리티 함수들을 체계적으로 관리

p5.js와의 차이

p5.js: 전역 함수

function drawGrid(cols, rows, spacing) {
    for (let x = 0; x < cols; x++) {
        for (let y = 0; y < rows; y++) {
            circle(x * spacing, y * spacing, 20);
        }
    }
}

function draw() {
    drawGrid(10, 10, 80);
}

문제: 전역 네임스페이스 오염, 의도 불명확

OPENRNDR: Extension 함수

fun Drawer.grid(cols: Int, rows: Int, spacing: Double) {
    for (x in 0 until cols) {
        for (y in 0 until rows) {
            circle(x * spacing, y * spacing, 20.0)
        }
    }
}

extend {
    drawer.grid(10, 10, 80.0)
}

장점: 명확한 관계, 체계적 조직, 메서드처럼 사용

다음 단계: `when` 조건 분기

다음 글에서는 when 문법을 다룹니다.

if-else보다 훨씬 강력한 조건 분기:

val mode = 1  // 앞 단계에서 선택한 모드

when (mode) {
    0 -> drawer.grid(10, 10, 80.0)
    1 -> drawer.radialLayout(12, 150.0)
    2 -> drawer.spiral(200, 1.0)
    else -> drawer.clear(ColorRGBa.BLACK)
}

이것이 사용자 입력에 따라 다른 패턴을 그리는 인터랙티브 아트를 가능하게 합니다.

연습 문제

1. 기본 Extension 만들기

// 정수에 "2배가 되는가" 메서드 추가
fun Int.isDouble(other: Int): Boolean {
    return this == other * 2
}

// 테스트
println(10.isDouble(5))   // true
println(10.isDouble(3))   // false

2. Drawer Extension 만들기

// 정사각형 그리기 (중심 기준)
fun Drawer.square(
    centerX: Double,
    centerY: Double,
    size: Double
) {
    val half = size / 2
    rectangle(centerX - half, centerY - half, size, size)
}

extend {
    drawer.square(400.0, 400.0, 100.0)
}

3. 격자 개선

radius를 매개변수로 추가하고 기본값을 20.0으로 지정합니다. 호출할 때 생략하면 반지름 20의 원, 네 번째 인자를 주면 지정한 반지름의 원이 그려집니다.

fun Drawer.grid(
    cols: Int,
    rows: Int,
    spacing: Double,
    radius: Double = 20.0
) {
    for (x in 0 until cols) {
        for (y in 0 until rows) {
            circle(x * spacing, y * spacing, radius)
        }
    }
}

program {
    extend {
        drawer.clear(ColorRGBa.BLACK)
        drawer.fill = ColorRGBa.WHITE
        drawer.grid(12, 12, 60.0)       // 기본 반지름 20.0
        drawer.grid(12, 12, 60.0, 8.0)  // 반지름 8.0
    }
}

두 격자는 같은 간격으로 그려지며, 두 번째 호출은 반지름이 더 작습니다. 두 호출을 함께 두면 도형이 겹치므로 비교할 때는 한 번에 한 호출만 남겨도 됩니다.

4. 복합 Extension

// Vector2 리스트를 시각화
fun Drawer.visualizePoints(points: List<Vector2>, radius: Double = 5.0) {
    for (point in points) {
        circle(point.x, point.y, radius)
    }
}

program {
    extend {
        drawer.clear(ColorRGBa.BLACK)
        drawer.fill = ColorRGBa.PINK
        
        val points = (0 until 20)
            .map { Vector2(it * 40.0, 200.0 + 100.0 * sin(it.toDouble())) }
        
        drawer.visualizePoints(points, 10.0)
    }
}

5. 심화: 조건부 Grid

조건 함수를 매개변수로 받으면 격자에서 그릴 셀을 선택할 수 있습니다. 아래 호출은 테두리와 주대각선에 놓인 원만 그립니다.

fun Drawer.selectiveGrid(
    cols: Int,
    rows: Int,
    spacing: Double,
    shouldDraw: (Int, Int) -> Boolean
) {
    for (x in 0 until cols) {
        for (y in 0 until rows) {
            if (shouldDraw(x, y)) {
                circle(x * spacing, y * spacing, 12.0)
            }
        }
    }
}

program {
    extend {
        drawer.clear(ColorRGBa.BLACK)
        drawer.fill = ColorRGBa.CYAN
        val cols = 10
        val rows = 10
        drawer.selectiveGrid(cols, rows, 60.0) { x, y ->
            x == 0 || y == 0 || x == cols - 1 || y == rows - 1 || x == y
        }
    }
}

조건의 ||는 셀의 x 또는 y가 가장자리이거나, 두 인덱스가 같은 경우를 고릅니다. 테두리와 왼쪽 위에서 오른쪽 아래로 이어지는 대각선이 남습니다. 체스판 무늬는 조건식만 (x + y) % 2 == 0으로 바꾸면 됩니다.

BamgasiJM

Coding Art with Blender / Three.js / p5.js / GLSL Shader / Processing / nannou

다음 포스트

🔧 ┠ 6. Extension 함수 — OPENRNDR 스타일의 핵심

OPENRNDR

Extension 함수란?

기본 문법

더 복잡한 예제

OPENRNDR에서의 Extension 함수

왜 중요한가?

p5.js와의 비교

p5.js: 별도 함수를 정의하는 방식

OPENRNDR: 메서드처럼 사용

실전 예제 1: 격자 그리기

실전 예제 2: 원형 배치

실전 예제 3: 나선 그리기

고급: `Drawer` + `Vector2` Extension

Vector2에 메서드 추가

Drawer와 Vector2 Extension 조합

기본 파라미터 값 (Default Parameters)

실전 예제 4: 복잡한 패턴

리시버 체이닝

유틸리티 Extension 라이브러리 만들기

Vector2 Extension의 실용성

벡터 연산 확장

실제 활용

실전 예제: 상호작용하는 나선

조건부 로직이 있는 Extension

정리: Extension 함수의 이점

p5.js와의 차이

p5.js: 전역 함수

OPENRNDR: Extension 함수

다음 단계: `when` 조건 분기

연습 문제

1. 기본 Extension 만들기

2. Drawer Extension 만들기

3. 격자 개선

4. 복합 Extension

5. 심화: 조건부 Grid

🔧 ┠ 7. `when` — 코틀린의 강력한 조건 분기

0개의 댓글

🔧 ┠ 6. Extension 함수 — OPENRNDR 스타일의 핵심

OPENRNDR

Extension 함수란?

기본 문법

더 복잡한 예제

OPENRNDR에서의 Extension 함수

왜 중요한가?

p5.js와의 비교

p5.js: 별도 함수를 정의하는 방식

OPENRNDR: 메서드처럼 사용

실전 예제 1: 격자 그리기

실전 예제 2: 원형 배치

실전 예제 3: 나선 그리기

고급: Drawer + Vector2 Extension

Vector2에 메서드 추가

Drawer와 Vector2 Extension 조합

기본 파라미터 값 (Default Parameters)

실전 예제 4: 복잡한 패턴

리시버 체이닝

유틸리티 Extension 라이브러리 만들기

Vector2 Extension의 실용성

벡터 연산 확장

실제 활용

실전 예제: 상호작용하는 나선

조건부 로직이 있는 Extension

정리: Extension 함수의 이점

p5.js와의 차이

p5.js: 전역 함수

OPENRNDR: Extension 함수

다음 단계: when 조건 분기

연습 문제

1. 기본 Extension 만들기

2. Drawer Extension 만들기

3. 격자 개선

4. 복합 Extension

5. 심화: 조건부 Grid

🔧 ┠ 7. `when` — 코틀린의 강력한 조건 분기

0개의 댓글

고급: `Drawer` + `Vector2` Extension

다음 단계: `when` 조건 분기