:: BASIC_08_cursor_following_dot

BamgasiJM·2025년 9월 19일

Nannou <BASIC>

목록 보기
21/41
post-thumbnail

📝 Rust Code

use nannou::prelude::*;

fn main() {
	nannou::app(model).update(update).run();
}

struct Model {}

fn model(app: &App) -> Model {
	app.new_window().view(view).build().unwrap();
    Model {}
}

fn update(_app: &App, _model: &mut Model, _update: Update) {}

fn view(app: &App, _model: &Model, frame: Frame) {
	let draw = app.draw();
    draw.background().color(rgba(0.1, 0.1, 0.1, 1.0));
    draw.ellipse()
    	.x_y(app.mouse.x, app.mouse.y)
        .w_h(50.0, 50.0)
        .color(rgba(0.9, 0.9, 0.4, 1.0));
    draw.to_frame(app, &frame).unwrap();
}

📝 Rust Code + Comment

// Nannou 라이브러리의 기본 기능들을 사용하기 위해 prelude 모듈을 임포트합니다.
// 이 모듈은 자주 사용되는 타입(Point2, Rgba 등), 함수(rgba, pt2 등), 트레잇 등을 포함합니다.
use nannou::prelude::*;

// 프로그램의 진입점입니다.
// Nannou 애플리케이션을 설정하고 실행합니다.
fn main() {
    // nannou::app()으로 애플리케이션 빌더를 생성하고,
    // - model: 초기 상태를 설정하는 함수
    // - update: 매 프레임 상태를 갱신하는 함수
    // - run(): 창을 열고 렌더링 루프를 시작
    nannou::app(model).update(update).run();
}

// 애플리케이션의 상태를 저장하는 구조체입니다.
// 이 예제에서는 상태를 저장할 필요가 없어 빈 구조체로 정의합니다.
struct Model {}

// 애플리케이션이 시작될 때 한 번만 호출되는 초기화 함수입니다.
fn model(app: &App) -> Model {
    // 새로운 창을 생성하고:
    app.new_window()
        .view(view)    // 렌더링 콜백으로 `view` 함수 지정
        .build()       // 창 생성 완료
        .unwrap();     // 오류 발생 시 패닉 (간단한 예제이므로)

    // 빈 Model 인스턴스 반환
    Model {}
}

// 매 프레임마다 호출되는 상태 업데이트 함수입니다.
// 이 예제에서는 상태 변경이 없으므로 모든 인자를 사용하지 않고 무시합니다.
fn update(_app: &App, _model: &mut Model, _update: Update) {
    // 아무 작업도 하지 않음
}

// 매 프레임 화면을 그리는 함수입니다.
fn view(app: &App, _model: &Model, frame: Frame) {
    // 그리기 명령을 담을 `Draw` 객체를 생성합니다.
    let draw = app.draw();

    // 배경을 짙은 회색(rgba(0.1, 0.1, 0.1, 1.0))으로 설정합니다.
    // 알파값 1.0은 완전 불투명을 의미합니다.
    draw.background().color(rgba(0.1, 0.1, 0.1, 1.0));

    // 마우스 커서 위치에 노란색 타원(원)을 그립니다:
    draw.ellipse()
        // .x_y(x, y): 타원의 중심 좌표를 직접 x, y 값으로 지정
        // app.mouse.x와 app.mouse.y는 현재 마우스 커서의 화면 좌표입니다.
        // 화면 중앙이 (0, 0)이며, 오른쪽/위로 갈수록 값이 증가합니다.
        .x_y(app.mouse.x, app.mouse.y)
        // .w_h(width, height): 타원의 너비와 높이를 각각 50.0 픽셀로 설정
        // 너비와 높이가 같으므로 원형이 됩니다.
        .w_h(50.0, 50.0)
        // 색상을 노란색 계열(밝은 노랑)으로 설정하며, 완전 불투명(alpha = 1.0)
        .color(rgba(0.9, 0.9, 0.4, 1.0));

    // 위에서 정의한 모든 그리기 명령을 실제 프레임 버퍼에 렌더링합니다.
    // unwrap()은 렌더링 오류 시 프로그램을 중단시킵니다 (간단한 예제용).
    draw.to_frame(app, &frame).unwrap();
}

이 코드에서는 별도로 윈도우 크기를 지정하지 않았기 때문에, Nannou는 기본 창 크기를 사용합니다.

✅ Nannou의 window 크기

  • Nannou는 창 크기를 명시하지 않으면 기본값으로 800 x 600 픽셀을 사용합니다.

  • Nannou는 화면 중심이 (0, 0) 이고, 가로/세로 범위는 창 크기에 따라 자동 조정됩니다.

    • 예: 800×600 창 → x 범위: -400 ~ +400, y 범위: -300 ~ +300
  • 따라서 app.mouse.x, app.mouse.y 같은 값도 이 범위 내에서 작동합니다.

  • .size(w, h)를 사용해서 원하는 창 크기를 만듭니다..

profile
Coding Art with Blender / oF / Processing / p5.js / nannou

0개의 댓글