Главная » Processing » Внеэкранное рисование в Processing

0

Иногда вам нужно нарисовать что-то прежде чем выводить это на экран. В Processing это легко делается с помощью объекта PGraphics.

Как это делается

Первое, что нужно сделать – объявить объект класса PGraphics в начале скетча и иниализировать его в функции setup() с функцией. Для реализации анимации в скетче я добавил переменные x и y. Вы можете очистить экран, кликнув мышью.

PGraphics pg;

float x; float y;

void setup()

{

size( 640, 480 );

smooth();

pg = createGraphics( 64, 64, JAVA2D );

background( 255 ); imageMode( CENTER );

x = 0;

y = 0;

}

Первое, что мы сделаем в функции draw() – нарисуем несколько линий в объекте PGraphics. Затем объект будет выведен на экран с помощью функции image(). В посднем фрагменте кода вычисляются значения переменных x и y для анимации скетча.

void draw()

{

pg.beginDraw();

pg.background( 255, 0, 0, 8 ); pg.smooth();

for ( int i = 0; i < 8; i++ ) { pg.stroke( random( 255 ), 0, 0 );

pg.line( random( pg.width ), random( pg.height ), random( pg.width

), random( pg.height ) );

}

pg.endDraw();

image( pg, x, y );

x += random( 4, 16 ); if ( x > width ) {

x = 0;

y += random( 32, 64 ); if ( y > height ) {

y = 0;

fill( 255, 32 ); noStroke();

rect( 0, 0, width, height );

}

}

}

Функция mousePressed() реализует очистку экрана. Цвет фона станет белым или черным с вероятностью 50 процентов.

void mousePressed()

{

if ( random( 100 ) < 50 ) {

background( 0 );

} else {

background( 255 );

}

}

В результате вы получите что-то похожее на этот скриншот. Посмотрите, как он реагирует на нажатие кнопки мыши.

Как это работает

Функция createGraphics() создает контекст, на котором вы будете рисовать. Претавьте, что вы создаете прозрачное изображение. Первые два параметра это ширина и высота изображения, третий – это рендерер. Так как я рисую двухмерные линии, я использовал рендерер P2D. Для начала рисования в объекте PGraphics начните с pg.beginDraw(). Завершить рисование изображения можно с помощью функции pg.endDraw(). Все, что находится между этими строками, будет нарисовано в объекте. Для рисования доступны все функции Processing, вам всего лишь нужно поставить перед именем функций префикс. Так, если вы хотите нарисовать линию в объекте PGraphics, используйте pg.line(), для рисования прямоугольников – pg.rect() и так далее для всех функций. Для получения ширины и высоты вашего объекта используйте pg.width и pg.height. Заметьте, что для функции background() я использовал прозрачный цвет. Это то, что нужно для объекта PGraphics.

Дополнительно

Когда вам понадобится нарисовать много текста, например, тысячу слов, вы обнаружите, что это тормозит скетч. Вы можете исправить ситуацию, написав эти слова в функции setup() в объектах PGraphics. Затем вы можете вывести на экран объекты PGraphics с помощью функции image(), это ускорит работу вашего скетча.

Источник: Ян Вантомм, Processing 2: креативное программирование, перевод с английского Александры Мишутиной, Published by Packt Publishing Ltd., 2012, BIRMINGHAM – MUMBAI.

По теме:

  • Комментарии