Zanimljive upute za programiranje obrade za dizajnera-učitavanje medija i događaj: 13 koraka

2024 Autor: John Day | [email protected]. Zadnja promjena: 2024-01-30 09:37

U obradu se može učitati mnogo vanjskih podataka, među kojima se vrlo često koriste tri vrste. Zasebno su slikovni, audio i video.

U ovom ćemo poglavlju govoriti o tome kako detaljno učitati audio i video zapise, kombinirajući ih sa događajima. Na kraju možete stvoriti vlastitu glazbenu tipkovnicu ili glazbenu paletu.

Korak 1: Pročitajte sliku

Prije nego što počnemo, osvrnimo se na način učitavanja slike.

Korak 2: Funkcije povezane sa slikom

Prije nego što upotrijebimo ove funkcije, moramo stvoriti slikovni objekt kroz PImage. Zatim možemo koristiti ove funkcije za definiranje svih vrsta svojstava slike.

Ne zaboravite pohraniti izvore slika u podatkovnu datoteku prije pokretanja programa.

Korak 3: Učitavanje glazbe, reprodukcija i zaustavljanje

U nastavku vam započinjemo formalno predstavljati pozivanje na glazbu. Vrlo slično učitavanju slike, morate na početku deklarirati audio objekt. Možete pogledati donji primjer iz stvarne gramatike.

Primjer koda (10-1):

[cceN_cpp theme = "dawn"] uvoz obrada.zvuk.*;

SoundFile zvuk;

void setup () {

veličina (640, 360);

pozadina (255);

zvuk = novi SoundFile (ovaj, "1.mp3");

}

void draw () {

}

void keyPressed () {

// Reproduciraj zvuk

if (ključ == 'p') {

zvuk.play ();

}

// Zaustavi zvuk

if (ključ == 's') {

zvuk.stop ();

}

} [/cceN_cpp]

Priprema:

Sama obrada ne nosi nikakvu biblioteku zvuka. Morate ga sami preuzeti. Stoga, prije nego što napišete svoj kôd, radije napravite sljedeće.

Dodavanje knjižnice u obradu. Evo uobičajene prakse. Na traci izbornika odaberite "Alat"- "Dodaj alat", a zatim prijeđite na "Knjižnice". Unesite ključne riječi knjižnice u stupac za pretraživanje kako biste ih mogli izravno preuzeti i instalirati.

Međutim, ako ovu funkciju koristimo u našoj zemlji (u Kini), ne možemo je preuzeti izravnim povezivanjem weba. Moramo pokrenuti VPN. Iako ga pokrenemo, bit će nestabilni uvjeti. Stoga morate biti strpljivi da ga isprobate nekoliko puta. Ovo je najprikladniji način utovara. Ako ne možete instalirati, morate preuzeti sa službene web stranice prema priručniku. (https://processing.org/reference/libraries/) Budući da je način ručne instalacije vrlo kompliciran, o tome ćemo dalje govoriti u drugom poglavlju.

Objasni kod:

Zvučna knjižnica može ispravno raditi nakon završetka pripreme. Kopirajte gornji kôd, kliknite Pokreni, tada će on raditi. Pritisnite tipku "P" za reprodukciju glazbe, "S" za zaustavljanje glazbe.

Ako se koristi za program, prvo ga moramo učitati. Na početku moramo dodati rečenicu "uvoz obrade.zvuk.*". "uvoz" je ključna riječ, što znači doslovno učitavanje. Dodajte naziv knjižnice iza "uvoza", a zatim će učitati knjižnicu. Rep obično slijedi oznaku "*", pa će učitati sve klase povezane s knjižnicom u program bez potrebe da ih dodajete jednu po jednu ručno.

U drugoj rečenici "SoundFile sound;" deklarirao je audio objekt. SoundFile je sličan PImageu.

Unutar postavljanja funkcije, "sound = new SoundFile (this," 1.mp3 ");" koristi se za stvaranje objekta i definiranje njegove putanje čitanja. Ovdje smo zapravo već počeli koristiti novi koncept Class. Trenutno o tome ne raspravljamo duboko. Moramo samo znati da je to fiksna metoda pisanja, a posljednji parametar je za popunjavanje adrese izvora glazbe.

Među keyPressed () događajima, "sound.play ()" i "sound.stop ()" relativno funkcioniraju kao učinak reprodukcije i zaustavljanja. "." u sredini označava funkciju člana koja reprodukcija i zaustavljanje pripadaju audio objektima. Funkciju člana možemo smatrati funkcijom uključenom u objekt. Pripada ovom objektu, koji je unaprijed definiran. Kasnije, kada moramo reproducirati više audio objekata, moramo samo dodati ".play ()" iza naziva relativne varijable.

Audio izvori pohranit će se u datoteku s podacima pod istim katalogom datoteke sketch (sa sufiksom pde). Ako ga nema, možete ga ručno izraditi.

Ne zaboravite napisati funkciju draw. Iako niste nacrtali grafiku, potrebno je uspješno reproducirati glazbu.

Gornji postupak izgleda prilično složen, ali trebate dodati samo nekoliko rečenica koda, a zatim možete realizirati funkciju reprodukcije. Vrlo je prikladno.

Obrada podržava uobičajene audio formate poput mp3, wav, ogg itd.

Korak 4: Kontrola brzine glazbe

Sljedeći primjeri počet će postajati vrlo zanimljivi. Obrada je dala neke funkcije koje mogu kontrolirati brzinu reprodukcije glazbe. Istovremeno, tonovi će se mijenjati s brzinom reprodukcije glazbe. Kad za kontrolu koristimo miša, on će stvoriti vrlo psihodelični učinak.

Video web stranica:

Primjer koda (10-2):

[cceN_cpp theme = "dawn"] uvoz obrada.zvuk.*;

SoundFile zvuk;

void setup () {

veličina (640, 360);

pozadina (255);

zvuk = novi SoundFile (ovaj, "1.mp3");

}

void draw () {

brzina plovka = mouseX/(float) širina * 3;

zvuk.brzina (brzina);

float vol = mouseY/(float) height * 4;

zvuk.pojačalo (vol);

}

void keyPressed () {

// Reproduciraj zvuk

if (ključ == 'p') {

zvuk.play ();

}

// Zaustavi zvuk

if (ključ == 's') {

zvuk.stop ();

}

} [/cceN_cpp]

Objašnjenje koda:

Funkcija.rate () kontrolira brzinu reprodukcije zvuka. Vrijednost u zagradama određuje brzu i sporu brzinu reprodukcije. Kad je vrijednost 1, brzina reprodukcije je normalna. Kad je iznad 1, tada ubrzajte; dok je ispod 1, zatim usporiti.

Funkcija.amp () kontrolira glasnoću zvuka. Vrijednost u zagradama određuje vrijednost volumena. Kad je 1, vrijednost glasnoće je normalna. Kad je više od 1, povećajte glasnoću; dok je ispod 1, zatim smanjite glasnoću.

Ovdje smo izgradili dvije lokalne varijable speed i vol kao parametre za učitavanje. Stoga će vodoravna koordinata miša promijeniti glazbeni ton, a okomita koordinata glasnoću glazbe.

Korak 5: Video reprodukcija i zaustavljanje

U obradi je učitavanje videa slično učitavanju zvuka. Najprije morate preuzeti videoteku. (https://processing.org/reference/libraries/video/index.html)

Primjer koda (10-3):

[cceN_cpp theme = "dawn"] uvoz obrada.video.*;

Filmski mov;

void setup () {

veličina (640, 360);

pozadina (0);

mov = novi film (ovaj, "1.mov");

}

void movieEvent (Filmski film) {

mov.read ();

}

void draw () {

slika (mov, 0, 0, 640, 360);

}

void keyPressed () {

if (ključ == 'p') {

mov.play ();

}

if (ključ == 's') {

mov.stop ();

}

if (ključ == 'd') {

mov.pause ();

}

} [/cceN_cpp]

Snimka zaslona videozapisa:

Objašnjenje koda:

Prva rečenica "import processing.video.*;" Koristi se za učitavanje videoteke.

Druga rečenica "Movie mov;" koristi se za deklariranje video objekta. Među njima, funkcija "filma" slična je PImageu.

U postavljanju funkcije, učinak "mov = new Movie (this," 1.mov ");" je stvaranje objekta i definiranje njegove putanje čitanja. Zadnji parametar popunjava se adresom video izvora.

Uostalom, movieEvent predstavlja video događaj. Koristi se za ažuriranje i čitanje video informacija. "mov.read ()" u slučaju da znači pročitano.

Osim za prikaz slika, funkcija funkcije može prikazati i video. Video objekt možemo promatrati kao dinamičku sliku. Prvi parametar, unosimo naziv varijable video objekta. Drugi i treći parametar su vodoravna i okomita koordinata iscrtana videom. Četvrti i petiti parametar određuju duljinu i širinu video prikaza.

Funkcija.play () znači igrati. Funkcija.stop () znači zaustavljanje i vratit će videozapis na zadano. Funkcija.pause () znači pauza. Prekinut će trenutnu reprodukciju, koja će se nastaviti sve dok se ne pozove funkcija.play ().

Korak 6: Kontrola brzine videa

Primjer koda (10-4):

[cceN_cpp theme = "dawn"] uvoz obrada.video.*;

Filmski mov;

void setup () {

veličina (640, 360);

pozadina (0);

mov = novi film (ovaj, "transit.mov");

}

void movieEvent (Filmski film) {

mov.read ();

}

void draw () {

slika (mov, 0, 0, širina, visina);

float newSpeed = mouseX/(float) width * 4;

mov.speed (newSpeed);

}

void keyPressed () {

if (ključ == 'p') {

mov.play ();

}

if (ključ == 's') {

mov.stop ();

}

if (ključ == 'd') {

mov.pause ();

}

}

[/cceN_cpp]

Objašnjenje koda:

Funkcija.speed () može se koristiti za kontrolu brzine reprodukcije videozapisa. Kad je vrijednost parametra 1, brzina reprodukcije je normalna. Kad je vrijednost veća od 1, tada ubrzati; dok je ispod 1, zatim usporite.

Budući da smo izgradili lokalnu varijablu newSpeed i uvezli je u funkciju setSpeed (), koordinata miša izravno će utjecati na brzinu reprodukcije videozapisa.

Što se tiče više primjera o videu, možete se pozvati na Knjižnice - Video u biblioteci predmeta.

Korak 7: Obrada uobičajenih događaja

Ranije smo predstavili samo događaj keyPressed (). Pokrenut će se nakon pritiska tipkovnice. U nastavku ćemo za vas predstaviti druge uobičajene događaje u Obradi.

Upotreba gore navedenih događaja slična je keyPressed. Nemaju redoslijed u pisanju koda. Drugim riječima, bez obzira na događaj koji ste postavili prije ili iza postavljanja funkcije, dobit ćete isti rezultat. Redoslijed izvršenja odnosi se samo na okidačko stanje samog događaja. Izvršit će se samo ako je uvjet ispunjen. Gore navedeni događaji vrlo su lako razumljivi. Morate samo napraviti mali eksperiment, a zatim možete brzo shvatiti njihovu uporabu.

Tok događaja

Možemo upotrijebiti primjer da znamo redoslijed izvođenja događaja.

Primjer koda (10-5):

[cceN_cpp theme = "dawn"] void setup () {

frameRate (2);

println (1);

}

void draw () {

println (2);

}

void mousePressed () {

println (3);

}

void mouseMoved () {

println (4);

}

void mouseReleased () {

println (5);

}

void keyPressed () {

println (6);

}

void keyReleased () {

println (7);

} [/cceN_cpp]

Objašnjenje koda:

U postavkama funkcija, frameRate () je postavio brzinu rada programa na 2 sličice u sekundi. Smanjivanje broja sličica u sekundi može nam pomoći promatrati izlaz u konzoli u slučaju da će pokrenuti događaji odmah biti premješteni novim podacima na stražnju stranu.

Pokušajte pomaknuti miš, kliknite mišem, otpustite miš i promatrajte izlazni rezultat. Upoznajte redoslijed izvođenja događaja putem println.

Ono na što valja obratiti pozornost je da se funkcije crtanja ne mogu upisivati u druge događaje osim crtanja funkcija, ili se ne mogu prikazati. Ako želimo kontrolirati skrivanje i prikaz grafičkih komponenti putem događaja poput keyPressed, možemo razmisliti o izgradnji bool varijable kao medija.

Događaji će se izvoditi redom. Tek nakon što se implementira sav kôd u trenutnom događaju, izvršit će kôd u sljedećem događaju.

Korak 8: Sveobuhvatni primjer-Glazbena tipkovnica

U kombinaciji s novo shvaćenim događajima, možemo dodati nove interakcije u naš program. Zatim, samo za nekoliko minuta, lako možemo analogno upravljati glazbenom tipkovnicom.

Video web stranica:

Primjer koda (10-6):

[cceN_cpp theme = "dawn"] uvoz obrada.zvuk.*;

SoundFile zvuk1, zvuk2, zvuk3, zvuk4, zvuk5;

logički ključ1, ključ2, ključ3, ključ4, ključ5;

void setup () {

veličina (640, 360);

pozadina (255);

noStroke ();

sound1 = novi SoundFile (this, "do.wav");

sound2 = novi SoundFile (ovaj, "re.wav");

sound3 = novi SoundFile (ovaj, "mi.wav");

sound4 = novi SoundFile (ovaj, "fa.wav");

sound5 = novi SoundFile (ovaj, "so.wav");

}

void draw () {

pozadina (255, 214, 79);

rectMode (CENTAR);

plovak w = širina * 0,1;

plovak h = visina * 0,8;

if (ključ1) {

ispuniti (255);

} else {

ispuniti (238, 145, 117);

}

pravokutni (širina/6, visina/2, š, v);

if (ključ2) {

ispuniti (255);

} else {

ispuniti (246, 96, 100);

}

pravokutni (širina/6 * 2, visina/2, š, v);

if (key3) {

ispuniti (255);

} else {

ispuniti (214, 86, 113);

}

pravokutni (širina/6 * 3, visina/2, š, v);

if (key4) {

ispuniti (255);

} else {

ispuniti (124, 60, 131);

}

pravokutni (širina/6 * 4, visina/2, š, v);

if (key5) {

ispuniti (255);

} else {

ispuniti (107, 27, 157);

}

pravokutni (širina/6 * 5, visina/2, š, v);

}

void keyPressed () {

if (ključ == 'a') {

sound1.play ();

ključ1 = točno;

}

if (ključ == 's') {

sound2.play ();

ključ2 = točno;

}

if (ključ == 'd') {

sound3.play ();

ključ3 = točno;

}

if (key == 'f') {

sound4.play ();

key4 = true;

}

if (ključ == 'g') {

sound5.play ();

key5 = true;

}

}

void keyReleased () {

if (ključ == 'a') {

ključ1 = netočno;

}

if (ključ == 's') {

ključ2 = netočno;

}

if (ključ == 'd') {

key3 = false;

}

if (key == 'f') {

key4 = false;

}

if (ključ == 'g') {

key5 = false;

}

} [/cceN_cpp]

Objašnjenje koda:

Moramo stvoriti više audio objekata za čitanje relativnih zvučnih informacija kako bi svirali različite zvukove kada se aktiviraju različite tipke.

Ovdje koristimo novi key keyReleased (). Funkcija ovog događaja je vratiti boju tipkovnice u njezinu izvornu boju. Kada otpustite ključ, on će se aktivirati.

5 logičkih vrijednosti deklariranih u glavi koriste se za otkrivanje statusa ključa.

Korak 9: Sveobuhvatni primjer-Glazbena paleta 1

Osim događaja s tipkovnicom, događaj miša dobra je stvar što ga moramo fleksibilno koristiti. Sljedeći primjer služi nam za stvaranje glazbene palete, među kojima smo koristili dva događaja vezana za miša.

Video web stranica:

Primjer koda (10-7):

[cceN_cpp theme = "dawn"] uvoz obrada.zvuk.*;

SoundFile zvuk1, zvuk2, zvuk3, zvuk4, zvuk5;

boolean isDragging;

void setup () {

veličina (640, 360);

pozadina (255, 214, 79);

noStroke ();

sound1 = novi SoundFile (this, "do.wav");

sound2 = novi SoundFile (ovaj, "re.wav");

sound3 = novi SoundFile (ovaj, "mi.wav");

sound4 = novi SoundFile (ovaj, "fa.wav");

sound5 = novi SoundFile (ovaj, "so.wav");

}

void draw () {

if (isDragging) {

ispuniti (107, 27, 157, 100);

elipsa (mouseX, mouseY, 16, 16);

}

}

void mouseDragged () {

isDragging = true;

if (mouseX> 100 && mouseX <105) {

sound1.play ();

}

if (mouseX> 200 && mouseX <205) {

sound2.play ();

}

if (mouseX> 300 && mouseX <305) {

sound3.play ();

}

if (mouseX> 400 && mouseX <405) {

sound4.play ();

}

if (mouseX> 500 && mouseX <505) {

sound5.play ();

}

}

void mouseReleased () {

isDragging = false;

} [/cceN_cpp]

Objašnjenje koda:

Nadamo se da tek kad pritisnemo miš i povučemo je, možemo crtati slike. Zato moramo izgraditi logičku varijablu isDragging da bismo dobili trenutni status.

Prilikom povlačenja miša, isDragging postaje prava vrijednost tako da će se crtežne funkcije unutar Draw -a izvršavati. Ostavit će tragove na ekranu. Kad otpustimo miš, isDragging postaje lažna vrijednost. Tako će funkcije crtanja u funkciji draw zaustaviti izvršavanje.

Dizajnirali smo nekoliko uvjeta pokretanja u događaju povlačenja miša. Na primjer, kada je vodoravna koordinata miša među 100 i 105 piksela, glazba će se automatski reproducirati. Time zaslon stvara nekoliko nevidljivih nizova. Samo ako miš prođe kroz određena područja, pokrenut će relativnu glazbu.

Korak 10: Sveobuhvatni primjer-Glazbena paleta 2 (ažurirana verzija)

Učinak gornjeg primjera već je dovoljno dobar. No, ako to pažljivo promatramo, pronaći ćemo mnogo problema. Na primjer, kada se miš kreće vrlo brzo, ostavit će okruglu točku na zaslonu svaki put kad se pomakne. To nije koherentna ravna linija. U međuvremenu, uzrokuje i curenje glazbe. Dok se miš kreće vrlo sporo, prolazeći kroz položaj kada je vodoravna koordinata između 100 i 105, emitirat će glazbu više puta u vrlo kratkom vremenu, što vam daje osjećaj da ste zaglavljeni. Sve ove probleme možemo riješiti primjerom u nastavku.

Video zapise možete pogledati na donjoj poveznici:

v.qq.com/x/page/w03226o4y4l.html

Primjer koda (10-8):

[cceN_cpp theme = "dawn"] uvoz obrada.zvuk.*;

SoundFile zvuk1, zvuk2, zvuk3, zvuk4, zvuk5;

boolean isDragging;

void setup () {

veličina (640, 360);

pozadina (255, 214, 79);

noStroke ();

sound1 = novi SoundFile (this, "do.wav");

sound2 = novi SoundFile (ovaj, "re.wav");

sound3 = novi SoundFile (ovaj, "mi.wav");

sound4 = novi SoundFile (ovaj, "fa.wav");

sound5 = novi SoundFile (ovaj, "so.wav");

}

void draw () {

if (isDragging) {

moždani udar (107, 27, 157, 100);

strokeWeight (10);

linija (mouseX, mouseY, pmouseX, pmouseY);

}

}

void mouseDragged () {

isDragging = true;

if ((mišX - 100) * (pmouseX - 100) <0) {

sound1.play ();

}

if ((mišX - 200) * (pmouseX - 200) <0) {

sound2.play ();

}

if ((mišX - 300) * (pmouseX - 300) <0) {

sound3.play ();

}

if ((mišX - 400) * (pmouseX - 400) <0) {

sound4.play ();

}

if ((mišX - 500) * (pmouseX - 500) <0) {

sound5.play ();

}

}

void mouseReleased () {

isDragging = false;

} [/cceN_cpp]

Objašnjenje koda:

Ovdje smo koristili dvije varijable pmouseX i pmouseY koje se nalaze u samom procesorskom sustavu. Oni su slični mouseX i mouseY, ali ono što su dobili su koordinate miša u zadnjem okviru.

U crtanju funkcija koristili smo funkcijski redak () za zamjenu izvorne funkcije elipse (). Time je koordinata zadnjeg kadra izravno povezana s koordinatom trenutnog okvira. Tako možemo nacrtati koherentne ravne linije ili krivulje.

U slučaju mouseDragged, osmislili smo novi uvjet pokretanja. Procjenom jesu li koordinate zadnjeg okvira i trenutnog okvira na istoj strani kako bi se znalo je li određena koordinata pređena. Uzmite ovaj uvjet kao primjer: "if ((mouseX - 100) * (pmouseX - 100) <0)". Među njima, iz pozitivne i negativne vrijednosti proizašle iz "mouseX - 100", možemo znati je li mouseX desno ili lijevo od vodoravne koordinate 100. Slično "pmouseX - 100". Stoga, kada dvije točke sprijeda i straga nisu na istoj strani, pozitiv množi negativ, dobit će novi negativni broj. Time je ispunjeni uvjet ispunjen.

Gore navedeni je pojednostavljeni izraz, koji je pametno upotrijebio određeni matematički algoritam-množenje dva negativa stvorit će pozitiv. Također ga možete podijeliti u dvije situacije za zasebnu raspravu. Međutim, mnogo je složenije napisati uvjete presude. Uvjeti prosudbe "if ((mouseX = 100) || (mouseX> 100 && pmouseX <= 100))" ekvivalentni su odredbenim uvjetima izvornog koda.

Korak 11: Relativne funkcije o audio i video kontroli

Gore navedene funkcije dovoljne su za opće scenarije uporabe. Ako ga želite duboko kopati, ovdje sam za vas prikupio neke uobičajene funkcije u vezi sa zvukom i videom. Možete istražiti njegovu uporabu prema vlastitim zahtjevima.

Za više informacija možete se obratiti dokumentima sa službene web stranice.

Audio (https://processing.org/reference/libraries/sound/index.html)

Videozapis (https://processing.org/reference/libraries/video/index.html)

Ovaj članak dolazi od dizajnera Wenzyja.

Korak 12: Relativna očitanja:

Zanimljiv vodič za programiranje za dizajnera-obrada početnog dodira

Zanimljive programske upute za dizajnera - izradite svoj prvi program za obradu

Zanimljiv vodič za programiranje za dizajnera-pokrenite svoju sliku (prvi dio)

Zanimljiv vodič za programiranje za dizajnera-pokrenite svoju sliku (drugi dio)

Zanimljive upute za programiranje za dizajnera- Kontrola procesa programa- Izjava petlje

Zanimljive programske upute za dizajnera-Kontrola programskog procesa-Izjava o stanju (prvi dio)

Zanimljive programske upute za dizajnera-Kontrola programskog procesa-Izjava o stanju (drugi dio)

Zanimljive programske upute za dizajnera-prilagođene funkcije i fraktalna rekurzija

Zanimljive programske upute za dizajnera-prilagođene funkcije i fraktalna rekurzija

Zanimljive upute za programiranje obrade za dizajnera-kontrola boje

Korak 13: Izvor

Ovaj članak je sa:

Ako imate bilo kakvih pitanja, možete se obratiti na adresu [email protected].