Уроки, алгоритмы, программы, примеры

Вход на сайт

Материалы по разделам

Построения
на плоскости (2D)
Графика
в пространстве (3D)
Вычислительная
геометрия
Физическое
моделирование
Фрактальная
графика

Новые комментарии

dobryj den, popytalas otkryt prikreplionnyj fail ctoby posmotret kak rabotaet, no mne ego ne pokazyvaet vydajet osibku. Pochemu?
Очень интересно! ии сайт крутой жалко что умирает(
У Вас число превысит максимальное число int. Можно использовать в Вашем случае uint, но лучше все переписать на double.
Добавление к программе строки glutReshapeFunc(changeSize); приводит к тому, что треугольник перестаёт совсем отрисовываться.
Выдаёт ошибку glut32.dll не найден! При том, что он лежит в System32! Всё решил) Нужно отправить не в System32, а в System.

Счетчики и рейтинг

Рейтинг@Mail.ru Яндекс.Метрика
Среда программирования: 
HTML 5 + JavaScript

Processing — это подъязык программирования, основанный на java с простым и понятным си-подобным синтаксисом. Он дает возможность быстро и легко создавать мультимедиа приложения. Processing работает поверх JVM, так что вы можете использовать Java-библиотеки, а так же запускать свои приложения в браузере. В нем реализованы инструменты для построения графических примитивов, 3D-объектов, работа со светом, текстом, инструментами трансформации. Мы можем импортировать и эскпортировать файлы аудио/видео/звуковых форматов, обрабатывать события мыши/клавиатуры, работать со сторонними библиотеками (openGL, PDF, DXF), работать с сетью.
Документация (англ.)
Страница с базовыми примерами.
Примеры посерьезней.

Для работы с ним на понадобиться загрузить Processing и распаковать архив. Далее запускаем processing.exe. Вот так выглядит PDE в среде Windows 8:

Теперь давайте попробуем написать простенькую программу. Например мяч отбивающийся от стенок. Хоть processing и очень простой язык, который допускает много вольностей, но если мы хотим написать хорошую программу, то необходимо следовать некоторым соглашениям. Так, например, все функции инициализации: size() — размер окна, stroke() — цвет линий, background() — цвет фона, и некоторые другие, необходимо помещать внутрь специальной служебной функции void setup(). Рекомендуется писать ее первой. Следующая служебная функция — void draw(). Её аналогом можно назвать int main() в C++.
Эта функция является основой для построения любой анимации. Её особенностью является то, что она автоматически вызывается при каждом обновлении фреймбуфера.

//Переменные определяющие местоположение и скорость мяча.
float x = 100;
float y = 100;
float xspeed = 1;
float yspeed = 3.3;
 
//Настройка окна и фона.
void setup() {
  size(400,400);
  background(255);
}
 
//Рисуем мяч.
void draw() {
  background(255);
 
  //Перемещаем мяч в соответствии с его скоростью.
  x = x + xspeed;
  y = y + yspeed;
 
  //Проверка границ. (Отбивание от стенок).
  if ((x > width) || (x < 0)) {
    xspeed = xspeed * -1;
  }
  if ((y > height) || (y < 0)) {
    yspeed = yspeed * -1;
  }
 
  stroke(0);
  fill(255,0,0);
  // Отображаем мяч по месту нахождения (х, у).
  ellipse(x,y,50,50);
}

Нажимаем "Run".
Результат неплохой :)

Самое классное то, что все это можно без труда перенести на Android. Для этого нам потребуется скачать Android sdk. Сменить режим в Processing с "java" на "Android" и при смене указать папку где лежит наше sdk.

Теперь, если у вас есть устройство на Android, подключите его к USB и переходите к шагу написания кода, если нет то придется настраивать, заходим Android->Android AVD Manager в открытом окне создаем новое устройство New... и жммакаем Start... затем Launch

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

Выделенные цифры нужно вписать в текстовый файл настроек Processing File->preferences->preferences.txt и сохранить.

android.emulator.port=5554

Теперь когда все готово, запустим простенькую программку, реагирующую на тач:

// Создаем переменную для хранения текущего поворота квадрата
float boxRotation = 0;
 
void setup() {
  // Устанавливаем размер экрана
  size(240,320);
  //Сглаживание
  smooth();
  //Устанавливаем заливку и ободку цвета для квадрата и круга
  fill(255);
  stroke(255);
  //Рисуем квадрат по по центру
  rectMode(CENTER);
 
};
 
void draw() {
  //Устанавливаем градиент фона,
  //все более красным, по мере движения пальца вниз по экрану.
  background(mouseY * (255.0/800), 100, 0);
  //Меняем направление вращения квадрата в зависимости от того, 
  //как наш палец перемещаться с право-налево.
  boxRotation += (float) (pmouseX - mouseX)/100;
 
  //Рисуем мяч и линию
  line(width/2, height/2, mouseX, mouseY);
  ellipse(mouseX, mouseY, 40, 40);
 
  //Рисуем квадрат
  pushMatrix();
    translate(width/2, height/2);
    rotate(boxRotation);
    rect(0,0, 150, 150);
  popMatrix();
};

Далее, код запускаем через Sketch->Run in Emulator(если у вас подключено устройство то Run in Device)
Результат: