Обработка: Перемещение центральной точки случайного Звездного поля в центр

Question

Я работаю над небольшой космической симуляцией с обработкой. В игре вы можете увеличить & вне Солнечной системы. Чтобы понять, что аккуратный эффект паралакса, я хочу, чтобы увеличить в случайно рожденных starky в фоновом режиме. До сих пор у меня все работает, но звездский увеличивает масштаб в верхнем левом углу. Я знаю, что мне нужно перевести начальную точку звезд на (ширина/2, высота/2), но я не могу понять, как я это делаю.

Вот код:

int starCount = 1200; 
float[] xStar = new float[starCount]; 
float[] yStar = new float[starCount]; 
float starSpread; 
float zoom; 

void setup() { 
    size(1600, 900); 
    frameRate(30); 
    calcStars(); 
    zoom = 1; 
} 

void draw() { 
    background(#000000); 
    for(int i=0;i<starCount;i++){ 
    fill(#fff7e6); 
    noStroke(); 
    ellipse(xStar[i]*starSpread,yStar[i]*starSpread,1,1); 
    } 

    starSpread = 1+zoom*0.001; 
} 


void calcStars(){ 
    for(int i=0;i<starCount;i++){ 
    xStar[i] = -random(0-width); 
    } 
    for(int i=0;i<starCount;i++){ 
    yStar[i] = -random(0-height); 
    } 
} 

void mousePressed(){ 
    zoom = zoom - 1; 
} 

(Нажмите мышью на «увеличение» из < - Я хочу, чтобы звезды, чтобы перейти к середине, не в верхнем левом углу!)

Итак, у меня есть 2 массива, дающих мне 1200 случайных координат в окне. «zoom» - это простой поплавок, который управляется слайдером. Эта переменная контролирует распространение всего содержимого. Он усваивается на 0,001, чтобы немного повлиять на мои звезды.

Теперь может кто-нибудь помочь мне сделать масштаб, как я его намерен?

Заранее благодарен!

Answer 1

Есть куча способов сделать это, но основной подход заключается в следующем:

Шаг 1: Подсчитайте, как далеко друг от друга от центра экрана каждой звезды.

Этап 2: Масштаб этого расстояния.

Шаг 3: Нарисуйте каждую звезду, которая масштабируется на расстоянии от центральной точки.

int starCount = 1200; 
float[] xStar = new float[starCount]; 
float[] yStar = new float[starCount]; 
float zoom = 1; 

void setup() { 
    size(1600, 900); 
    frameRate(30); 
    calcStars(); 
} 

void draw() { 
    background(#000000); 
    for (int i=0; i<starCount; i++) { 
    fill(#fff7e6); 
    noStroke(); 

    float centerX = width/2.0; 
    float centerY = height/2.0; 

    float xDistFromCenterX = centerX - xStar[i]; 
    float yDistFromCenterY = centerY - yStar[i]; 

    float scaledXDistFromCenterX = zoom * xDistFromCenterX; 
    float scaledYDistFromCenterY = zoom * yDistFromCenterY; 

    ellipse(centerX + scaledXDistFromCenterX, centerY + scaledYDistFromCenterY , 1, 1); 
    } 

} 

void calcStars() { 
    for (int i=0; i<starCount; i++) { 
    xStar[i] = -random(0-width); 
    } 
    for (int i=0; i<starCount; i++) { 
    yStar[i] = -random(0-height); 
    } 
} 

void mousePressed() { 
    zoom = zoom + .1; 
} 

Это работает, и я думаю, что это очень близко к тому, что вы собираетесь, но вы могли бы также рассмотреть рефакторинга кода, чтобы использовать Star объект, который отслеживает его собственной позиции. Всякий раз, когда вы хотите увеличить масштаб, просто сообщите каждому объекту Star для перемещения. Вы могли бы также нарисовать ваши старты до изображения раньше времени, а затем просто масштабировать это изображение. Как я уже сказал, есть множество способов сделать это.