Home-theater-designers
Обработката е мощен инструмент, който позволява създаването на изкуство чрез код. Това е комбинация от Java библиотека за работа с графики и интегрирана среда за разработка (IDE), която ви позволява лесно да пишете и изпълнявате код.
Има много проекти за начинаещи в графиката и анимацията, които използват обработка, но също така е в състояние да манипулира видео на живо.
Днес ще правите видео слайдшоу на живо с различни ефекти, контролирани от мишката, като използвате видео библиотеката Processing. Освен че прелиствате видеото на живо, ще се научите да го преоразмерявате и оцветявате и как да го накарате да следва курсора на мишката.
Настройка на проекта
Да започна, изтегляне Обработка и отворете празна скица. Този урок е базиран на система Windows, но трябва да работи на всеки компютър с уеб камера.
Може да се наложи да инсталирате библиотеката Processing Video, достъпна под Скица> Импортиране на библиотека> Добавяне на библиотека . Търся Видео в полето за търсене и инсталирайте библиотеката от Фондацията за обработка .
След като инсталирате, сте готови за работа. Ако искате да пропуснете кодирането, можете изтеглете цялата скица . Много по -добре е обаче да го направите сами от нулата!
Използване на уеб камера с обработка
Започваме с импортиране на библиотеката и създаване на настройвам функция. Въведете следното в празната скица за обработка:
import processing.video.*;
Capture cam;
void setup(){
size(640,480);
cam = new Capture(this, 640, 480);
cam.start();
}
След като импортирате видеотеката, създавате Улавяне извикан екземпляр Оранжево за съхраняване на данните от уеб камерата. В настройвам , размер функция настройва a 640x480 прозорец с размер на пиксел, в който да работите.
Следващият ред възлага Оранжево към нов екземпляр на Улавяне , за това скица, която е със същия размер като прозореца, преди да кажете на камерата да се включи cam.start () .
Не се притеснявайте, ако засега не разбирате всяка част от това. Накратко, казахме на Processing да направи прозорец, да намери нашата камера и да я включи! За да го покажем имаме нужда от a рисувам функция. Въведете това под кода по -горе, извън къдравите скоби.
void draw(){
if (cam.available()){
cam.read();
}
image(cam,0,0);
}
The рисувам функция се извиква всеки кадър. Това означава, че много пъти всяка секунда, ако камерата има данни на разположение Вие Прочети данните от него.
След това тези данни се показват като образ , на позицията 0, 0 , който е в горния ляв ъгъл на прозореца.
Запазете скицата си и натиснете бутона за възпроизвеждане в горната част на екрана.
Успех! Данните, съхранявани от Оранжево се отпечатва правилно на екрана всеки кадър. Ако имате проблеми, проверете внимателно кода си. Java се нуждае от всяка скоба и точка и запетая на правилното място! Обработката може също да отнеме няколко секунди за достъп до уеб камерата, така че ако смятате, че не работи, изчакайте няколко секунди след стартирането на скрипта.
Прелистване на картината
Сега, когато имате живо изображение на уеб камера, нека го манипулираме. В функцията за теглене, заменете изображение (камера, 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!
Използване на мишката
Обработката има вградени методи за достъп до мишката. За да откриете, когато потребителят кликне с мишката, добавете мишка Натиснат функция в долната част на вашия скрипт.
как да премахнете обекти във Photoshop
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);
}
Този код използва образ функция за създаване на четири отделни изображения от камерата във всеки ъгъл на екрана и да ги направи наполовина.
The оттенък функцията добавя цвят към всяко изображение на камерата. Числата са скобите червено, зелено и синьо (RGB) стойности. Оцветяване оцветява целия следния код с избрания цвят.
Запазете и играйте, за да видите резултата. Опитайте да промените RGB номерата във всеки оттенък функция за промяна на цветовете!
Накарайте го да следва мишката
И накрая, нека накараме живото изображение да следва позицията на мишката, използвайки полезни функции от библиотеката Processing. Добавете това над иначе част от вашата логика.
else if(switcher==4 ){
image(cam, mouseX, mouseY, width/2, height/2);
}
Тук позиционирате изображението от камерата си на mouseX и мишкаY . Те са вградени в стойности за обработка, които връщат към кой пиксел е насочена мишката.
Това е! Пет варианта на видео на живо чрез код. Въпреки това, когато стартирате кода, ще забележите няколко проблема.
Завършване на кода
Кодът, който сте създали досега, работи, но ще забележите два проблема. Първо, след като се покаже четирицветната вариация, всичко след това е оцветено в лилаво. Второ, когато преместите видеоклипа с мишката, той оставя следа. Можете да го поправите, като добавите няколко реда в горната част на функцията за теглене.
void draw(){
tint(256,256,256);
background(0);
//draw function continues normally here!
В началото на всеки кадър този код нулира цвета на нюанса на бял и добавя черен цвят на фона, за да спре видеото да оставя следи. Сега, когато тествате програмата, всичко работи перфектно!
Ефекти на уеб камерата: Изкуство от код
Обработката е много мощна и можете да я използвате за много неща. Това е отлична платформа за създаване на изкуство с код, но е еднакво подходяща за управление на роботи!
Ако Java не е вашето нещо, има JavaScript библиотека, базирана на Processing, наречена p5.js. Той е базиран на браузър и дори начинаещите могат да го използват за създаване на фантастични реактивни анимации!
Кредит на изображението: Syda_Productions / Depositphotos
Дял Дял Туит електронна поща 3 начина да проверите дали имейл е реален или фалшивАко сте получили имейл, който изглежда малко съмнителен, винаги е най -добре да проверите неговата автентичност. Ето три начина да разберете дали имейл е реален.
Прочетете Напред Свързани теми- Програмиране
- Java
- Уебкамера
- Обработка
- Уроци по кодиране
Иън Бъкли е журналист на свободна практика, музикант, изпълнител и видео продуцент, живеещ в Берлин, Германия. Когато не пише или е на сцената, той се занимава с „направи си сам“ електроника или код с надеждата да стане луд учен.
Още от Иън БъклиАбонирайте се за нашия бюлетин
Присъединете се към нашия бюлетин за технически съвети, рецензии, безплатни електронни книги и изключителни оферти!
Щракнете тук, за да се абонирате