Jak tworzyć niesamowite efekty kamery internetowej za pomocą Java i przetwarzania

Przetwarzanie to potężne narzędzie, które umożliwia tworzenie sztuki za pomocą kodu. Jest to połączenie biblioteki Java do pracy z grafiką oraz zintegrowanego środowiska programistycznego (IDE), które umożliwia łatwe pisanie i uruchamianie kodu.

Istnieje wiele projektów graficznych i animacyjnych dla początkujących, które wykorzystują przetwarzanie, ale jest również w stanie manipulować wideo na żywo.

Dzisiaj będziesz robił pokaz slajdów na żywo z różnych efektów kontrolowanych myszką, korzystając z biblioteki przetwarzania wideo. Oprócz odwracania wideo na żywo nauczysz się zmieniać jego rozmiar i kolor, a także sposób naśladowania kursora myszy.

Konfiguracja projektu

Aby rozpocząć, pobierz Przetwarzanie i otwórz pusty szkic. Ten samouczek jest oparty na systemie Windows, ale powinien działać na każdym komputerze z kamerą internetową.

Może być konieczne zainstalowanie biblioteki przetwarzania wideo, dostępnej pod Szkic> Importuj bibliotekę> Dodaj bibliotekę. Szukać Wideo w polu wyszukiwania i zainstaluj bibliotekę z The Processing Foundation.

Po zainstalowaniu jesteś gotowy do pracy. Jeśli chcesz pominąć kodowanie, możesz pobrać pełny szkic. Jednak znacznie lepiej jest zrobić to od zera!

Używanie kamery internetowej z przetwarzaniem

Zacznijmy od zaimportowania biblioteki i utworzenia Ustawiać funkcjonować. Wpisz następujący tekst do pustego szkicu przetwarzania:

import processing.video. *; Kamera przechwytująca; void setup () size (640,480); cam = nowe przechwytywanie (this, 640, 480); cam.start ();  

Po zaimportowaniu biblioteki wideo tworzysz plik Zdobyć instancja o nazwie krzywka do przechowywania danych z kamery internetowej. W Ustawiać, rozmiar funkcja konfiguruje a 640 × 480 okno wielkości pikseli do pracy.

Kolejny wiersz przypisuje krzywka do nowej instancji Zdobyć, dla to naszkicuj, który ma taki sam rozmiar jak okno, zanim powiesz aparatowi, aby się włączył cam.start ().

Nie martw się, jeśli na razie nie rozumiesz wszystkich części tego. Krótko mówiąc, powiedzieliśmy Processing, aby zrobił okno, znalazł nasz aparat i włączył go! Aby go wyświetlić, potrzebujemy rysować funkcjonować. Wpisz to poniżej powyższego kodu, poza nawiasami klamrowymi.

void draw () if (cam.available ()) cam.read ();  obraz (kamera, 0,0);  

The rysować funkcja jest wywoływana co ramkę. Oznacza to, że wiele razy na sekundę, Jeśli kamera ma dane dostępny ty czytać dane z niego.

Te dane są następnie wyświetlane jako obraz, na stanowisku 0, 0, który jest w lewym górnym rogu okna.

Zapisz szkic i naciśnij przycisk odtwarzania u góry ekranu.

Powodzenie! Dane przechowywane przez krzywka jest poprawnie drukowany na ekranie każdej klatki. Jeśli masz problemy, dokładnie sprawdź swój kod. Java potrzebuje każdego wspornika i średnika we właściwym miejscu! Przetwarzanie może również wymagać kilku sekund, aby uzyskać dostęp do kamery internetowej, więc jeśli uważasz, że nie działa, poczekaj kilka sekund po uruchomieniu skryptu.

Przerzucanie obrazu

Teraz, gdy masz obraz z kamery na żywo, zmanipulujmy go. W funkcji rysowania zamień obraz (kamera, 0,0); z tymi dwoma liniami kodu.

skala (-1,1); obraz (kamera, szerokość, 0); 

Zapisz i ponownie uruchom szkic. Czy widzisz różnicę? Używając negatywu skala wartość, wszystkie z x wartości (piksele poziome) są teraz odwrócone. Z tego powodu musimy użyć ujemnej wartości okna szerokość aby poprawnie ustawić obraz.

Odwrócenie obrazu do góry nogami wymaga tylko kilku drobnych zmian.

skala (-1, -1); obraz (kamera, szerokość, wysokość); 

Tym razem oba x i y wartości są odwracane, co odwraca obraz z kamery na żywo do góry nogami. Do tej pory zakodowałeś normalny obraz, obraz odwrócony w poziomie i obraz odwrócony w pionie. Ustawmy sposób na przełączanie się między nimi.

Making It Cycle

Zamiast przepisywać kod za każdym razem, możemy używać liczb do ich przewijania. Stwórz nowy liczba całkowita na górze kodu o nazwie przełącznik.

import processing.video. *; int przełącznik = 0; Kamera przechwytująca; 

Możemy użyć wartości przełącznika, aby ustalić, co stanie się z obrazem z kamery. Po rozpoczęciu szkicu nadajesz mu wartość 0. Teraz możemy użyć logiki, aby zmienić to, co dzieje się z obrazem. Zaktualizuj swój rysować metoda, aby wyglądać następująco:

void draw () if (cam.available ()) cam.read ();  if (switcher == 0) image (cam, 0,0);  else if (switcher == 1) scale (-1,1); obraz (kamera, szerokość, 0);  else if (switcher == 2) skala (-1, -1); obraz (kamera, szerokość, wysokość);  else println („ponownie Switcher = 0”); przełącznik = 0;  

Teraz wszystkie trzy warianty kodu zostaną uruchomione w zależności od wartości przełącznika. Jeśli nie pasuje do jednego z naszych Jeśli lub Jeśli inaczej oświadczenia, jeszcze klauzula zostaje zresetowana do 0. Logika to ważna umiejętność dla początkujących. Możesz się o niej dowiedzieć i wiele więcej dzięki doskonałemu samouczkowi programowania YouTube 17 najlepszych samouczków programowania YouTube 17 najlepszych samouczkom programowania YouTube W tym poście „ chciałbym wskazać Ci jedną z najlepszych serii programów YouTube, jakie znaleźliśmy. Wszystkie te są wystarczające, aby zmoczyć stopy jako początkujący programista. !

Używanie myszy

Przetwarzanie ma wbudowane metody dostępu do myszy. Aby wykryć, kiedy użytkownik kliknie myszą, dodaj mousePressed funkcja u dołu skryptu.

void mousePressed () switcher ++;  

Przetwarzanie nasłuchuje kliknięć myszy i przerywa programowi wykonanie tej metody po wykryciu jednego z nich. Za każdym razem, gdy wywoływana jest metoda, wartość przełącznika zwiększa się o jeden. Zapisz i uruchom skrypt.

Teraz, gdy naciśniesz przycisk myszy, cyklicznie przewija się różne orientacje filmów, zanim powrócisz do oryginału. Jak dotąd przerzuciłeś wideo, teraz zróbmy coś bardziej interesującego.

Dodawanie więcej efektów

Teraz zakodujesz czterokolorowy efekt na żywo podobny do słynnego dzieła Andy'ego Warhola. Dodanie kolejnych efektów jest tak proste, jak dodanie kolejnej klauzuli do logiki. Dodaj to do skryptu między ostatnimi inaczej jeśli oświadczenie i jeszcze.

else if (switcher == 3) odcień (256, 0, 0); obraz (krzywka, 0, 0, szerokość / 2, wysokość / 2); odcień (0, 256, 0); obraz (krzywka, szerokość / 2, 0, szerokość / 2, wysokość / 2); odcień (0, 0, 256); obraz (krzywka, 0, wysokość / 2, szerokość / 2, wysokość / 2); odcień (256, 0, 256); obraz (krzywka, szerokość / 2, wysokość / 2, szerokość / 2, wysokość / 2);  

Ten kod używa obraz funkcja, aby utworzyć cztery osobne obrazy z kamery w każdym rogu ekranu i ustawić je w połowie wielkości.

The odcień funkcja dodaje kolor do każdego obrazu z kamery. Liczby w nawiasach czerwony, zielony i niebieski (RGB) wartości. Odcień zabarwia cały poniższy kod wybranym kolorem.

Zapisz i graj, aby zobaczyć wynik. Spróbuj zmienić liczby RGB w każdym z nich odcień funkcja zmiany kolorów!

Robiąc to podążaj za myszką

Na koniec sprawmy, aby obraz na żywo podążał za pozycją myszy za pomocą pomocnych funkcji z biblioteki Processing. Dodaj to powyżej jeszcze część twojej logiki.

else if (switcher == 4) image (cam, mouseX, mouseY, width / 2, height / 2);  

Tutaj ustawiasz obraz z kamery na mouseX i mysi. Są one wbudowane w wartości przetwarzania, które zwracają piksel, na który wskazuje mysz.

To jest to! Pięć wariantów wideo na żywo za pomocą kodu. Jednak po uruchomieniu kodu zauważysz kilka problemów.

Dokończenie kodu

Utworzony do tej pory kod działa, ale zauważysz dwa problemy. Po pierwsze, gdy pojawi się czterokolorowa odmiana, wszystko później jest zabarwione na fioletowo. Po drugie, kiedy przesuwasz wideo za pomocą myszy, pozostawia ślad. Możesz to naprawić, dodając kilka linii na górze funkcji rysowania.

void draw () tint (256,256,256); tło (0); // funkcja rysowania działa tutaj normalnie! 

Na początku każdej klatki kod ten resetuje kolor odcienia do białego i dodaje kolor tła czerni, aby zatrzymać pozostawienie ścieżki wideo. Teraz, gdy testujesz program, wszystko działa idealnie!

Webcame Effects: Art From Code

Przetwarzanie jest bardzo wydajne i można go używać do wykonywania wielu czynności. To doskonała platforma do tworzenia sztuki za pomocą kodu, ale równie dobrze nadaje się do sterowania robotami!

Jeśli Java nie jest twoją rzeczą, istnieje biblioteka JavaScript oparta na przetwarzaniu o nazwie p5.js. Jest oparty na przeglądarce, a nawet początkujący mogą go używać do tworzenia fantastycznych animacji reaktywnych Jak napisać skrypt wrażliwej na głos animacji robota w p5.js Jak napisać skrypt wrażliwej na głos animacji robota w p5.js Chcesz zainteresować dzieci programowaniem ? Pokaż im ten przewodnik budowania reaktywnej animowanej głowy robota. !

Źródło obrazu: Syda_Productions / Depositphotos