🔮 :: Fluid Lattice ver.1

📝 Rust Code

use nannou::prelude::*;

const GRID_SIZE: usize = 100;  // 50x50 grid
const PARTICLE_SPACING: f32 = 10.0;  // Particle spacing (adjusted for screen size)
const VOID_RADIUS: f32 = 100.0;  // Void area radius (around mouse)
const REPULSION_FORCE: f32 = 2.0;  // Repulsion force strength
const DAMPING: f32 = 0.95;  // Velocity damping (to slow down particles)

struct Particle {
    position: Vec2,
    velocity: Vec2,
    home_position: Vec2,  // Initial position (for reset)
}

struct Model {
    particles: Vec<Particle>,
    window_rect: Rect,
}

fn main() {
    nannou::app(model)
        .update(update)
        .event(event)  // Add event handling for key input
        .run();
}

fn model(app: &App) -> Model {
    let window = app.new_window().size(800, 800).view(view).build().unwrap();
    let window_rect = app.window(window).unwrap().rect();

    let mut particles = Vec::new();
    let start_x = - (GRID_SIZE as f32 / 2.0) * PARTICLE_SPACING;
    let start_y = - (GRID_SIZE as f32 / 2.0) * PARTICLE_SPACING;

    for i in 0..GRID_SIZE {
        for j in 0..GRID_SIZE {
            let pos_x = start_x + i as f32 * PARTICLE_SPACING;
            let pos_y = start_y + j as f32 * PARTICLE_SPACING;
            let pos = vec2(pos_x, pos_y);
            particles.push(Particle {
                position: pos,
                velocity: vec2(0.0, 0.0),
                home_position: pos,
            });
        }
    }

    Model {
        particles,
        window_rect,
    }
}

fn update(app: &App, model: &mut Model, update: Update) {
    let mouse = app.mouse.position();
    let dt = update.since_last.as_secs_f32();

    for p in model.particles.iter_mut() {
        let to_mouse = mouse - p.position;
        let dist = to_mouse.length();  // Use length() instead of magnitude()

        if dist < VOID_RADIUS && dist > 0.0 {
            // Void effect: calculate direction to flee from mouse
            let repulsion_dir = -to_mouse.normalize();  // Opposite direction
            let force = repulsion_dir * (REPULSION_FORCE * (1.0 - dist / VOID_RADIUS));  // Force based on distance
            p.velocity += force;
        }

        // Pull slightly toward home position (stabilization)
        let to_home = p.home_position - p.position;
        p.velocity += to_home * 0.01;

        // Apply velocity and damping
        p.position += p.velocity * dt * 60.0;  // Frame-rate independent
        p.velocity *= DAMPING;

        // Clamp position to window boundaries (optional: keep particles on screen)
        p.position = p.position.clamp(model.window_rect.bottom_left(), model.window_rect.top_right());
    }
}

fn event(_app: &App, model: &mut Model, event: Event) {
    if let Event::WindowEvent {
        id: _,
        simple: Some(WindowEvent::KeyPressed(Key::N)),
    } = event {
        // Reset particles to home position when 'n' is pressed
        for p in model.particles.iter_mut() {
            p.position = p.home_position;
            p.velocity = vec2(0.0, 0.0);
        }
    }
}

fn view(app: &App, model: &Model, frame: Frame) {
    let draw = app.draw();
    draw.background().color(BLACK);  // Black background

    for p in &model.particles {
        draw.ellipse()
            .xy(p.position)
            .radius(2.0)  // Small white dots
            .color(WHITE);
    }

    draw.to_frame(app, &frame).unwrap();
}

코드 설명과 문법 포인트

50x50 그리드의 입자(작은 흰 점)들을 블랙 배경에 배치하고, 마우스 움직임에 따라 "void" 효과(마우스 주위 반경 내 입자들이 도망감)를 실시간으로 구현합니다. 'n' 키를 누르면 모든 입자가 초기 그리드 위치로 리셋됩니다.

주요 nannou API 사용

• app.mouse.position(): 마우스 위치 실시간 추적. 인터랙션의 핵심.
• draw.background().color(BLACK): 블랙 배경 설정.
• draw.ellipse().xy(pos).radius(2.0).color(WHITE): 작은 원(점)으로 입자 그리기.
• app.new_window().size(800, 800): 창 크기 설정. 그리드 간격이 화면에 맞게 배치됨.
• update.since_last.as_secs_f32(): 프레임 간 시간(delta time)으로 부드러운 애니메이션. 실시간 움직임 보장.
• event 함수 추가: 키 입력 처리. nannou의 Event::WindowEvent와 KeyPressed로 'n' 키 감지.

Rust 문법

• 구조체(Struct): Particle 구조체로 각 입자의 위치(position), 속도(velocity), 초기 위치(home_position) 저장. 데이터 캡슐화.
• 벡터(Vec2): nannou의 vec2(x, y)로 2D 벡터 사용. 연산 예: to_mouse = mouse - p.position, magnitude()로 거리, normalize()로 단위 벡터.
• 루프와 벡터(Vec): particles: Vec로 동적 배열. 초기화 시 중첩 for 루프로 50x50 생성. iter_mut()으로 mutable 반복.
• 클램프(clamp): p.position.clamp(rect.bottom_left(), rect.top_right())로 화면 경계 제한 (입자가 화면 밖으로 안 나감).
• 상수(const): const GRID_SIZE: usize = 50;처럼 컴파일 타임 상수 정의. 코드 가독성 향상.
• 열거형(Enum)과 패턴 매칭: event 함수에서 if let Event::WindowEvent { ... } = event 패턴으로 키 이벤트 필터링. Rust의 안전한 패턴 매칭.
• 타입 변환: i as f32로 usize를 f32로 캐스팅. nannou에서 자주 사용.

동작 원리

1. 초기화(model): 50x50 그리드 계산. 각 입자의 홈 위치 저장.
2. 업데이트(update): 매 프레임 마우스와 입자 거리 계산. VOID_RADIUS 내이면 반발력(repulsion) 적용. 속도에 감쇠(damping)로 자연스럽게 멈춤. 홈 위치로 약간 끌어당겨 안정화.
3. 뷰(view): 블랙 배경에 흰 점들 렌더링.
4. 이벤트(event): 'n' 키로 모든 입자 리셋.
5. 인터랙션: 마우스 움직이면 void처럼 입자들이 밀려나감. 멀어지면 서서히 원위치로 복귀.

팁과 수정 아이디어

• 성능: 2500개 입자(50*50)라 부드러움. 더 많으면 최적화 필요 (e.g., 쿼드트리).
• void 시각화: 마우스 주위에 투명 원 추가: draw.ellipse().xy(mouse).radius(VOID_RADIUS).color(rgba(0.0, 0.0, 0.0, 0.2));
• PARTICLE_SPACING 조정으로 밀도 변경. REPULSION_FORCE로 도망 속도 튜닝.
• 창 크기 800x800로 설정했지만, window_rect로 동적 조정됨.