Управляємо файлами SVG в Processing

Прекрасним властивістю Processing є те, що вам не потрібно малювати всі фігури у вашому скетчі Ви можете намалювати все, що вам потрібно в програмі – редакторі векторних файлів, а потім експортувати їх у Processing як файли SVG

Приступимо

Перше, що вам потрібно зробити – створити файл SVG для скетчу Processing підтримує SVG файли, створені в Adobe Illustrator і Inkscape Inkscape – це відкритий редактор векторних файлів, тому якщо у вас немає доступу до дорогої платній програмі начебто Illustrator, це хороший варіант Ви можете завантажити його тут: http://inkscapeorg/

Створіть новий скетч і збережіть його під імям manipulating_svg_filespde Файл SVG збережіть у папці data вашого скетчу Ви також можете зробити це, перетягнувши файл SVG в текстовий редактор Processing, точно так само, як ви робили це в прикладі з зображеннями

Як це робиться

Почнемо в оголошення декількох обєктів класу PShape і завантаження їх у функцію setup () Мінлива snowFlake буде використовуватися для зберігання вашого файлу SVG, інші змінні будуть зберігати інші частини головного файлу SVG

PShape snowFlake PShape small1 PShape small2 PShape small3 PShape small4 PShape small5 PShape small6 PShape big1

void setup()

{

size( 640, 480 )

smooth()

snowFlake = loadShape(&quotsnowflakesvg&quot)

small1 = snowFlakegetChild(&quotsmall1&quot) small2 = snowFlakegetChild(&quotsmall2&quot) small3 = snowFlakegetChild(&quotsmall3&quot) small4 = snowFlakegetChild(&quotsmall4&quot) small5 = snowFlakegetChild(&quotsmall5&quot) small6 = snowFlakegetChild(&quotsmall6&quot) big1 = snowFlakegetChild(&quotbig1&quot)

shapeMode( CENTER )

}

У функції draw () ми виведемо на екрані файл SVG за допомогою функції shape ():

void draw()

{

background( 255 )

// regular snowflake

shape( snowFlake, 160, 120 )

// distorted snowflake

shape( snowFlake, 480, 120, 160, 80 )

// orange snowflake snowFlakedisableStyle() fill( 255, 128, 0 )

stroke( 255 )

strokeWeight( 2 )

shape( snowFlake, 160, 360 ) snowFlakeenableStyle()

// draw separate parts (colorful star) strokeWeight( 1 )

stroke( 0 ) small1disableStyle()

fill( 151, 183, 189 )

shape( small1, 480, 360 ) small1enableStyle() small2disableStyle() fill( 216, 234, 237 )

shape( small2, 480, 360 ) small2enableStyle()

small3disableStyle() fill( 151, 183, 189 )

shape( small3, 480, 360 ) small3enableStyle()

small4disableStyle() fill( 216, 234, 237 )

shape( small4, 480, 360 ) small4enableStyle()

small5disableStyle() fill( 151, 183, 189 )

shape( small5, 480, 360 ) small5enableStyle()

small6disableStyle() fill( 108, 223, 234 )

shape( small6, 480, 360 ) small6enableStyle()

strokeWeight( 2 ) big1disableStyle() fill( 251, 0, 95 )

stroke( 255 )

shape( big1, 480, 360 ) big1enableStyle()

}

В результаті ви побачите щось схоже на цей скріншот:

Як це працює

Файл SVG є, по суті, файлом XML Спробуйте відкрити його в будь-якому текстовому редакторі і подивитися, як він виглядає

Для завантаження в скетч файлу SVG потрібно перед функцією setup () оголосити обєкт PShape Далі потрібно завантажити файл в обєкт за допомогою функції loadShape () Вивести на екран файл SVG можна за допомогою функції shape () Перший параметр цієї функції це посилання на ваш обєкт PShape, другий і третій це координати x і y місця, де ви хочете намалювати фігуру Четвертий і пятий параметри можуть бути додані, якщо ви хочете змінити розмір фігури Файли SVG виводяться на екран зі своїми власними параметрами, але ви можете змінити колір обєкта PShape за допомогою методу disableStyle () і функцій fill () і stroke () з Processing Переконайтеся, що ви Прима метод enableStyle () після завершення змін У цьому прикладі для доступу до різних фігур з завантаженого SVG файлу ми використовували метод getChild () Для цього нам знадобилося використовувати атрибут id з фігури, що міститься у файлі SVG У нашому прикладі рядок small4 = snowFlakegetChild (small4) отримує рядок xml, що починається з

Додатково

На жаль, повна специфікація SVG не дозволені Processing Наприклад, не працюють діаграми Тому, якщо ваш файл SVG має властивості, які Processing не підтримує, Processing видасть вам помилку

Джерело: Ян Вантомм, Processing 2: креативне програмування, переклад з англійської Олександри Мішутіної, Published by Packt Publishing Ltd, 2012, BIRMINGHAM – MUMBAI

Схожі статті:


Сподобалася стаття? Ви можете залишити відгук або підписатися на RSS , щоб автоматично отримувати інформацію про нові статтях.

Коментарів поки що немає.

Ваш отзыв

Поділ на параграфи відбувається автоматично, адреса електронної пошти ніколи не буде опублікований, допустимий HTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

*

*