Home-theater-designers
Обработка - это мощный инструмент, позволяющий создавать искусство с помощью кода. Это комбинация библиотеки Java для работы с графикой и интегрированной среды разработки (IDE), которая позволяет легко писать и запускать код.
Существует множество проектов для начинающих с графикой и анимацией, в которых используется обработка, но она также способна управлять живым видео.
Сегодня вы будете создавать слайд-шоу в реальном времени с различными эффектами, управляемыми мышью, с помощью библиотеки обработки видео. Вы научитесь не только переворачивать видео в реальном времени, но и изменять его размер и цвет, а также заставлять его следовать за курсором мыши.
Настройка проекта
Начать, скачать Обработка и откройте пустой эскиз. Это руководство основано на системе Windows, но оно должно работать на любом компьютере с веб-камерой.
Возможно, вам потребуется установить библиотеку обработки видео, доступную в Эскиз> Импорт библиотеки> Добавить библиотеку . Ищи видео в поле поиска и установите библиотеку из Фонд обработки .
После установки вы готовы к работе. Если вы хотите пропустить кодирование, вы можете скачать полный эскиз . Однако гораздо лучше сделать его самому с нуля!
Использование веб-камеры с обработкой
Начнем с импорта библиотеки и создания настраивать функция. Введите в пустой эскиз обработки следующие данные:
import processing.video.*;
Capture cam;
void setup(){
size(640,480);
cam = new Capture(this, 640, 480);
cam.start();
}
После импорта видеотеки вы создаете Захватывать экземпляр называется апельсин для хранения данных с веб-камеры. В настраивать , то размер функция устанавливает 640 x 480 окно размером в пиксель для работы.
Следующая строка присваивает апельсин к новому экземпляру Захватывать , для это эскиз, который имеет тот же размер, что и окно, прежде чем сказать камере включиться с помощью cam.start () .
Не волнуйтесь, если вы пока не понимаете все это. Короче говоря, мы сказали Обработке создать окно, найти нашу камеру и включить ее! Для его отображения нам понадобится рисовать функция. Введите его под кодом выше, за пределами фигурных скобок.
void draw(){
if (cam.available()){
cam.read();
}
image(cam,0,0);
}
В рисовать функция вызывается каждый кадр. Это означает, что много раз в секунду если у камеры есть данные доступный ты читать данные из него.
Эти данные затем отображаются в виде изображение , на позиции 0, 0 , который находится в верхнем левом углу окна.
Сохраните свой набросок и нажмите кнопку воспроизведения вверху экрана.
Успех! Данные, хранящиеся апельсин правильно печатается на экране каждый кадр. Если у вас возникли проблемы, внимательно проверьте свой код. Java нужны все скобки и точки с запятой в нужном месте! Обработке также может потребоваться несколько секунд для доступа к веб-камере, поэтому, если вы считаете, что она не работает, подождите несколько секунд после запуска скрипта.
Переворачивание картинки
Теперь, когда у вас есть изображение с веб-камеры в реальном времени, давайте поработаем с ним. В функции рисования замените изображение (cam, 0,0); с этими двумя строками кода.
scale(-1,1);
image(cam,-width,0);
Сохраните и перезапустите эскиз. Вы видите разницу? Используя отрицательный шкала значение, все Икс значения (пиксели по горизонтали) теперь перевернуты. Из-за этого нам нужно использовать отрицательное значение окна ширина правильно расположить изображение.
Чтобы перевернуть изображение вверх ногами, нужно внести всего пару небольших изменений.
scale(-1,-1);
image(cam,-width,-height);
На этот раз оба Икс а также а также значения переворачиваются, изображение с камеры в реальном времени переворачивается вверх дном. До сих пор вы закодировали нормальное изображение, горизонтально перевернутое изображение и вертикально перевернутое изображение. Давайте настроим способ переключения между ними.
Создание цикла
Вместо того, чтобы каждый раз переписывать ваш код, мы можем использовать числа для их циклического перебора. Создать новый целое число в верхней части вашего кода называется переключатель .
import processing.video.*;
int switcher = 0;
Capture cam;
Мы можем использовать значение переключателя, чтобы определить, что происходит с изображением камеры. Когда скетч запускается, вы присваиваете ему значение 0 . Теперь мы можем использовать логику, чтобы изменить то, что происходит с изображением. Обновите свой рисовать способ выглядеть так:
void draw(){
if (cam.available()){
cam.read();
}
if(switcher==0){
image(cam,0,0);
}
else if(switcher == 1){
scale(-1,1);
image(cam,-width,0);
}
else if(switcher == 2){
scale(-1,-1);
image(cam,-width,-height);
}
else{
println('Switcher = 0 again');
switcher = 0;
}
}
Теперь все три варианта кода сработают в зависимости от значения переключателя. Если он не соответствует одному из наших если или если еще заявления, еще пункт сбрасывается на 0. Логика - важный навык для новичков, и вы можете узнать о них и многом другом с помощью отличного Руководства по программированию на YouTube!
Использование мыши
Обработка имеет встроенные методы доступа к мыши. Чтобы определить, когда пользователь щелкает мышью, добавьте mousePressed внизу вашего скрипта.
как мне подключить свой телефон к компьютеру
void mousePressed(){
switcher++;
}
Обработка отслеживает любые щелчки мыши и прерывает программу, чтобы выполнить этот метод, когда обнаруживает его. Каждый раз, когда вызывается метод, значение переключателя увеличивается на единицу. Сохраните и запустите ваш скрипт.
Теперь, когда вы нажимаете кнопку мыши, она циклически меняет ориентацию видео, прежде чем вернуться к исходному. Пока вы только что перевернули видео, теперь давайте займемся чем-нибудь поинтереснее.
Добавление дополнительных эффектов
Теперь вы запрограммируете четырехцветный эффект живого изображения, похожий на знаменитые произведения искусства Энди Уорхола. Добавить эффекты так же просто, как добавить в логику еще одно предложение. Добавьте это в свой скрипт между последними иначе если заявление, и еще .
else if(switcher == 3){
tint(256, 0, 0);
image(cam, 0, 0, width/2, height/2);
tint(0, 256, 0);
image(cam, width/2, 0, width/2, height/2);
tint(0, 0, 256);
image(cam, 0, height/2, width/2, height/2);
tint(256, 0, 256);
image(cam, width/2, height/2, width/2, height/2);
}
Этот код использует изображение функция для создания четырех отдельных изображений камеры в каждом углу экрана и уменьшения их всех половинного размера.
В оттенок функция добавляет цвет к каждому изображению камеры. Цифры в скобках красный, зеленый и синий (RGB) ценности. Оттенок закрашивает весь следующий код выбранным цветом.
Сохраните и играйте, чтобы увидеть результат. Попробуйте изменить числа RGB в каждом оттенок функция изменения цвета!
Заставить его следовать за мышью
Наконец, давайте заставим живое изображение следовать за положением мыши, используя полезные функции из библиотеки Processing. Добавьте это над еще часть вашей логики.
else if(switcher==4 ){
image(cam, mouseX, mouseY, width/2, height/2);
}
Здесь вы размещаете изображение с камеры на мышьX а также мышьY . Они встроены в значения обработки, которые возвращают, на какой пиксель указывает мышь.
Вот и все! Пять вариантов живого видео через код. Однако, когда вы запустите код, вы заметите пару проблем.
Завершение кода
Код, который вы создали до сих пор, работает, но вы заметите две проблемы. Во-первых, как только появляется четырехцветная вариация, все после этого окрашивается в фиолетовый цвет. Во-вторых, когда вы перемещаете видео мышкой, оно оставляет след. Вы можете исправить это, добавив пару строк вверху функции рисования.
void draw(){
tint(256,256,256);
background(0);
//draw function continues normally here!
В начале каждого кадра этот код сбрасывает цвет оттенка на белый и добавляет черный цвет фона, чтобы видео не оставляло следов. Теперь при тестировании программы все работает отлично!
Эффекты веб-камеры: Искусство из кода
Обработка очень мощная, и вы можете использовать ее для многих вещей. Это отличная платформа для создания произведений искусства с помощью кода, но она в равной степени подходит и для управления роботами!
Если Java вам не нравится, существует библиотека JavaScript, основанная на Processing, под названием p5.js. Он основан на браузере, и даже новички могут использовать его для создания фантастических реактивных анимаций!
Кредит изображения: Syda_Productions / Depositphotos
Делиться Делиться Твитнуть Эл. адрес 3 способа проверить, является ли электронное письмо настоящим или поддельнымЕсли вы получили письмо, которое выглядит немного сомнительным, всегда лучше проверить его подлинность. Вот три способа узнать, настоящее ли электронное письмо.
Читать далее Похожие темы- Программирование
- Джава
- Вебкамера
- Обработка
- Учебники по кодированию
Ян Бакли - независимый журналист, музыкант, исполнитель и видеопродюсер, живущий в Берлине, Германия. Когда он не пишет или на сцене, он возится с электроникой или кодом своими руками в надежде стать безумным ученым.
Ещё от Ian BuckleyПодписывайтесь на нашу новостную рассылку
Подпишитесь на нашу рассылку, чтобы получать технические советы, обзоры, бесплатные электронные книги и эксклюзивные предложения!
Нажмите здесь, чтобы подписаться