Пользователь
0,1
рейтинг
27 апреля 2009 в 13:39

Разработка → Знакомство с Processing 1.0

Цель написания этого топика — познакомить вас с замечательным языком Processing. Этот ЯП не может похвастать широкой функциональностью или богатыми выразительными средствами, но он способен предложить кое-что другое…

Что же это такое?


Итак, processing — это подязык программирования, основанный на java с простым и понятным си-подобным синтаксисом.
Processing дает возможность быстро и легко создавать мультимедиа приложения (в терминологии processing — скетчи). Под словом мультимедиа я подразумеваю средства языка, которые позволяют разрабатывать графику, анимацию, разнообразную визуализацию, интерактивные приложения…
В принципе, ничего не мешает создавать даже 3D-аппликации (в том числе и игры), ведь processing имеет средства поддержки OpenGL. Все эти возможности, вкупе с большим количеством функций и очень логичным синтаксисом, делают этот язык идеальным для обучения и прививания интереса к программированию.

Прекрасно понимая, что одна картинка стоит тысячи слов, хочу представить пару примеров визуализации, созданной в processing:



image

image

Как начать


Procesing 1.0 — это бесплатное, открытое, кроссплатформенное ПО.
Исходный архив включает в себя java-машину, сам интерпретатор, мини-IDE, и несколько десятков примеров. Версии для разных платформ доступны на странице загрузки (все ссылки в конце топика).
После загрузки и распаковки архива, необходимо найти в корневом каталоге исполняемый файл, запускающий IDE, в котором можно и нужно писать код.
Все готово к работе!

Быстрый старт


Я не ставил себе задачи научить кого-либо основам этого языка. В этом нет необходимости, ведь на оффсайте помимо подробнейшего мануала, есть несколько статей, в которых очень доступно, на простом английском языке обьясняются все азы и особенности работы с processing. Все описано очень подробно, есть даже иллюстрации. Также к вашим услугам и обширное коммюнити, представленное форумом с десятками тысяч постов.
Поэтому я остановлюсь лишь на нескольких моментах, о которых стоит знать новичкам. Сказать по правде, я сам еще полный новичок, но кое-что уже усвоил и спешу этим поделиться.
Итак начнем с главного — с синтаксиса языка.

По моему мнению, он очень поход на классический си. Так что если у вас есть опыт работы с такими языками, как C, PHP, JavaScript, etc, то можно считать, что processing вы практически знаете — очень многие языковые конструкции, операторы, циклы выглядят точно так же.

Разберемся с терминологией.

Скетч — исходный файл вашей программы.
Скетчбук — каталог, содержащий исходные файлы, файлы ресурсов и т.д. Короче все, что относится к одному проекту.
PDE — Processing Development Environment. Родная среда разработки языка.

Еще раз о возможностях

Прежде чем я начну рассматривать примеры кода, хочу еще раз упомянуть те возможности, которые нам предлагает processing.
Итак, в нашем распоряжении инструменты для построения графических примитивов, 3D-объектов, работа со светом, текстом, инструментами трансформации. Мы можем импортировать и эскпортировать файлы аудио/видео/звуковых форматов, обрабатывать события мыши/клавиатуры, работать со сторонними библиотеками (openGL, PDF, DXF), работать с сетью.

Вот так выглядит PDE в среде Windows XP:

Пользовательский интерфейс
Результат выполнения программы:
Окно исполнения программы

Пишем хелловорлд

Наконец мы подобрались к самому главному — первому примеру кода. Аналогом классического «hello, world» у нас будет вот такой код:
  1. line(25, 100, 125, 100);
Что делает эта функция, я думаю, в пояснении не нуждается. Но на всякий случай расскажу :)
Функция line принимает четыре аргумента и рисует в двухмерной плоскости линию с координатами, заданными в аргументах, с цветом и толщиной по умолчанию. Аргументы в порядке использования: x1, y1, x2, y2 — координаты начальной и конечной точек.
Собственно, практически все задачи решаются в этом языке такими же простыми способами. Для 3D-объектов, естественно, добавляется ось Z.

Начальная инициализация


Хоть processing и очень простой язык, который допускает много вольностей, но если мы хотим написать хорошую программу, то необходимо следовать некоторым соглашениям.

Так, например, все функции инициализации: size() — размер окна, stroke() — цвет линий, background() — цвет фона, и некоторые другие, необходимо помещать внутрь специальной служебной функции void setup(). Рекомендуется писать ее первой.

Следующая служебная функция — void draw(). Её аналогом можно назвать int main() в C++.
Эта функция является основой для построения любой анимации. Её особенностью является то, что она автоматически вызывается при каждом обновлении фреймбуфера.

Последнее соглашение связано с позиционированием объектов в координатной плоскости.
После инициализации размера окна функцией setup(), внутри программы становятся доступны две глобальных константы — WIDTH и HEIGHT, в которых хранится соответственно ширина и высота окна. Каждый раз, когда вы хотите спозиционировать, скажем, круг по центру экрана, польэуйтесь такой записью:
  1. ellipse(WIDTH/2, HEIGHT/2, 50, 50);
Вот пример маленькой программки, написанной с использованием соглашений:
  1. void setup() {
  2.     size(400, 400);
  3.     stroke(255);
  4.     background(192, 64, 0);
  5.    }
  6.  
  7. void draw() {
  8.     line(150, 25, mouseX, mouseY);
  9.    }
Функции mouseX и mouseY возвращают текущие координаты курсора мыши. Таким образом, при каждом движении мыши будут рисоваться новые линии. Выглядит это вот так:

image

Напоследок


Предвидя возможные возгласы, вроде «Да чем этот процессинг лучше того же Adobe Flash/Microsoft Silverlight etc...».
Во-первых: это отличная бесплатная и открытая альтернатива. Тем более, что результат ваших трудов можно сконвертировать в джава-апплет и вставить на веб-страницу.
Во-вторых: сами разработчики уже ответили на этот вопрос в своем FAQ. Не могу не процитировать один абзац оттуда:
There are things that are always going to be better in Flash, and other types of work that will always be better in Processing. But fundamentally (and this cannot be emphasized enough), this is not an all-or-nothing game… We're talking about tools. Do people refuse to use pencils because pens exist? No, you just use them for different things, and for specific reasons. If Processing works for you, then use it. If not, don't. It's easy! It's free! You're not being forced to do anything.
И действительно: это разные вещи, разные инструменты, каждый из которых подходит для своих целей. Так что никаких холиваров, пожалуйста.
Еще раз повторюсь: processing очень хорошо подходит для обучения — в нем нет ничего лишнего, а результат доступен быстро и очень нагляден. Я считаю этот язык не средством серьезной разработки, а просто интересным хобби, которое позволяет расслабиться и отвлечься от основной работы.

Ссылки

frexin @sindrom
карма
50,8
рейтинг 0,1
Пользователь
Реклама помогает поддерживать и развивать наши сервисы

Подробнее
Спецпроект

Самое читаемое Разработка

Комментарии (38)

  • +10
    Есть не менее замечательная реализация на Javascript (выполняется прямо в браузере, требует Canvas)
    • 0
      Эта реализация имеет только академическую ценность имхо. Разница в производительности Java-based Javascript-based решений огромна. Если же надо сделать чтонить подобное в браузере, то есть Flash/Silverlight. Которые будут тоже намного шустрее.
      • +4
        Однако не требует никаких дополнительных плагинов для браузера. Да пока не шустро, но как писал Пол Грэм, скоро это не будет иметь значение.
      • 0
        Технологии не стоят на месте, — производительность подобных вещей с каждым новым релизом современных браузеров стремительно растёт. К тому же, большое преимущество перед Flash-реализацией — на джаваскрипте писать намного проще, если это нужно интегрировать на страницу.
        • 0
          Безусловно. Если бы у нас был быстрый canvas c хардверным ускорением графики, то никакие флэши вообще не были бы нужны.
  • 0
    > Да чем этот процессинг лучше того же Adobe Flash/Microsoft Silverlight etc…
    cleoag.livejournal.com/1545637.html
    флэш бы умер на полпути до этого ((8
  • –16
    Processing интересен, статья нет. Факт выпрашивания рейтинга только подтверждает сказанное мной накануне.
  • 0
    Пример сайта, программы или чего-то еще, где это практически используется, в студию. («Огромное количество живых примеров» и cleoag.livejournal.com/1545637.html не катит — это не практическое применение, хотя и красиво).
    • 0
      Основное практическое применение процессинга — это создание визуала. Именно в этом плане у него мало конкурентов, некоторые вещи можно сделать на flash или на javafx, но они все равно будут не дотягивать по уровню исполнения.

      Советую посмотреть вот эти видео.
    • 0
      Музыкальная визуализация в iTunes 8 использует визуализатор Magnetosphere от Flight404.
    • 0
      Universal Everything делали на Пороцессинге ролик для рекламы Audi TT.

      Но используют действительно мало.
  • +1
    processing.org/exhibition/ — тут под сотню примеров практического использования
  • 0
    Интересная технология, я бы применил её для создания заставок на рабочий стол. Хотя я думаю что если поразмыслить можно много что поинтереснее найти.
  • +1
    А как вам вот такая штукенция — Tiction? Так называемый «нодный секвенсер».
  • 0
    Очень здорово, я тут освоил v4 и тоже хочу опробовать процессинг.
  • НЛО прилетело и опубликовало эту надпись здесь
  • 0
    Пока смотрел ролик — чуть не уснул! Ужасное озвучивание — полностью разжижает мозг. Хотя сам Processing 1.0 немного заинтересовал.
    • +1
      Ты что!? Это же легендарные Boards of Canada!
  • 0
    Действительно больше как для баловства(развлечения) подходит. JavaFX кстати хорош для мультимедиа приложений написаных на java.
  • +2
    Недавно открыл для себя процессинг — очень увлекательно, пока написал пару «фильтров» для изображения и простенький трекинг цветных объектов с веб-камеры, причём сделал это через пару часов после того как установил этот пакет.

    И тоже думал написать о нём на Хабре :)

    это подязык программирования
    Всё же его называют java-фреймворком.
  • –3
    > line(25, 100, 125, 100);

    это лет пятнадцать назад я на своем спектруме писал
    простите
    • +1
      А я вот эти времена не застал, поэтому радуюсь сейчас :)
    • +1
      Вот, я тоже вспомнил это чудесное время! Этот язык хорош хотя бы тем, что может заинтересовать подрастающее поколение сделать что-то прикольное на современном уровне, не вдаваясь в дебри opengl.
  • +1
    PDE как-то удивительно похоже на Arduino IDE. с чего бы это?
    • 0
      Так родственные проекты же.
  • +4
    Для тех кому интересно — http://www.openframeworks.cc аналогичный проект, но основанный на с/с++. Лично мне нравится за то, что сразу работает под OpenGL и расширения к нему накручиваются намного легче.
  • +2
    > Итак, processing — это подязык программирования, основанный на java с простым и понятным си-подобным синтаксисом.

    Processing это DSL, предметно-ориентированный язык. Автор, учи матчасть.

    > В принципе, ничего не мешает создавать даже 3D-аппликации

    Убил. Application = приложение.

    > Итак начнем с главного — с синтаксиса языка.

    Жесть. Главное это всегда семантика, синтаксис вторичен (или даже находится на 10-м месте %)).

    > По моему мнению, он очень поход на классический си.

    Моя по-русски не разговаривает?

    > Так что если у вас есть опыт работы с такими языками, как C, PHP, Javascript, etc, то можно считать, что processing вы практически знаете — очень многие языковые конструкции, операторы, циклы выглядят точно так же.

    Бугак. Processing императивен, только и всего.

    PS Processing не впечатлил, ждем FieldTrip! :)
  • +1
    Я ждал этого комментария :)
  • 0
    Вещь хорошая, жаль что на Джаве.
  • +2
    Подскажите, где код к первой картинке?
    www.picamatic.com/show/2009/04/26/08/27/3420389_490x361.jpg
  • 0
    А как оно по сравнению с тем же pov-ray?
    • 0
      Немного для разных вещей. Как я понял, Processing для интерактивной графики или даже real-time.
      • 0
        А результат после Processing можно потом raytrace'ить?
  • 0
    Извините за критику но уж ОЧЕНЬ сиьно напоминает OpenGL.

    А если нет разницы. Зачем учить еще один язык?
    • 0
      Разница большая. OpenGL это GAPI, а не DSL.

      Разные уровни абстракции: вершины, отрезки, полигоны, нормали, программируемое затенение vs оно же, но завернутое в «новый, улучшенный синтаксис». %)

      А если серьезно, то мне лично не понравилось манипулирование состоянием, прямо как в OpenGL. Такой подход ужасен же.
  • 0
    Что-то никто не вспомнил про новый продукт от гугла для анимации 3D.
    Правда там плагин нужен и он пока только для хрома. но еще же не вечер.
    Кавалеры только примеряют свои смокинги, а дамы дрожат от нетерпения.
    • 0
      Возможно фанаты процессинга процессинга сделают рендер ProcessingJS через O3D. Будет интересно посмотреть на производительность по сравнению с 3D через Java.
  • НЛО прилетело и опубликовало эту надпись здесь

Только зарегистрированные пользователи могут оставлять комментарии. Войдите, пожалуйста.