Af Torben Okholm, Alt om Data
Denne artikel er oprindeligt bragt på Alt om Data. Computerworld overtog i november 2022 Alt om Data. Du kan læse mere om overtagelsen her.
Processing er et programmeringssprog, der bygger på Java, men da det er beregnet til at lade kreative typer programmere deres idéer hurtigt, insisterer det ikke på, at man skriver store mængder klasser og metoder for at få noget på skærmen.
Processing-miljøet genererer Java, JavaScript og sågar Android-apps. Koden er hurtig, sproget er godt understøttet med nyttige biblioteker, og der er masser af eksempler at lege med. Her vil vi udforske evnen til at oprette og manipulere lyd ved hjælp af det medfølgende Minim-bibliotek.
Sketchens anatomi
I Processing hedder programmer ‘sketches’, og de bliver gemt i en mappe, der hedder Processing i Dokumenter-biblioteket.
Medmindre variablerne er specifikke for et objekt eller et objekts metode, kan Processing godt lide, at du deklarerer variabler globalt. Når en sketch kører første gang, bliver funktionen setup () kaldt og giver programmøren et sted at lægge initialiseringskode.
Efter setup() kalder Processing vedholdende funktionen draw(), hvilket i praksis danner en uendelig løkke. Hvis din sketch skal udføre nogle setup-operationer, skriver du selv setup(), og eventuelle statements, der skal gøre gentagne gange, går i draw(). Du behøver dog ikke bruge disse to funktioner for at strukturere en sketch. Din sketch kan være en liste over statements, der kun kører en gang, men sketches, der er mere komplekse, beror på setup() og draw().
Arbejd med Minim
Minim-biblioteket følger med Processing og er klar til brug. Lad os derfor skrive en sketch, der kan afspille en lydfil. Først skal vi definere et par objekter. Det første er et lydafspiller-objekt, der kan indlæse og afspille filen. Nu kan vi kalde lydafspillerens afspillemetode for at afspille filen.
import ddf.minim.*;
Minim minim;
AudioPlayer player;
minim = new Minim(this);
player = minim.
loadFile(“Gnossienne 1 Lent.wav”);
player.play();
Gem sketchen ved at klikke ‘File > Save as’. Skriv et navn, så opretter Processing en mappe under Processing-mappen til at gemme det hele i.
Indsæt din egen fil ved at kopiere den ind i sketchens mappe. Kør sketchen igen. Nu kan du høre, din fil blive afspillet.
Avancerede funktioner
Lad os gøre sagerne mere interessante og lave et oscilloskop. Her skal vi bruge funktionerne setup() og draw().
import ddf.minim.*;
Minim minim;
AudioPlayer player;
void setup() {
size(400, 200);
minim = new Minim(this);
player = minim.loadFile
(“Gnossienne 1 Lent.wav”, 512);
player.play();
}
void draw() {
}
void display_scope() {
for (int i = 0; i < player.bufferSize() - 1; i++) {
float x1 = map(i,0,player.bufferSize(),0,width);
float x2 = map(i+1,0,player.
bufferSize(),0,width);
line(x1,50+player.left.get(i)*50,x2,50+player.left.get(i+1)*50);
line(x1,150+player.right.get(i)*50,x2,150+player.right.get(i+1)*50);
}
}
Denne gang har vi oprettet en setup()-function, og inden i den har vi specificeret en bufferstørrelse på 512 bytes. Det er her, vores oscil-loskopfunktion læser sine data. Vi har også specificeret en størrelse på Processings outputvindue.
Funktionen draw() rydder løbende skærmen ved at indstille baggrunden til sort (colour zero) og penfarven til 255 (hvid). Derefter kal-der den display_scope(), der hurtigt gennemgår det aktuelle indhold i lydafspillerens inputbuffer og trækker to oscilloskopspor, der viser det aktuelle indhold. Kør sketchen, så bør du kunne se et dobbelt oscilloskop-spor.
Frekvensanalyse
Nu skal vi tilføje en visuel signalanalysator. Begynd med at oprette et andet objekt, denne gang af typen FFT. Det står for fast Fourier transform og er en metode til hurtigt at analysere en buffer og finde iboende frekvenser. Føj den følgende linje til sketchen under AudioPlayer-definitionen:
FFT fft;
Føj nu den følgende linje til setup() umiddelbart før den linje, der begynder at afspille filen.
fft = new FFT(player.bufferSize(), player.sampleRate());
Til sidst skal vi oprette denne funktion:
void display_spectrum() {
fft.forward(player.mix);
for (int i = 0; i < fft.specSize(); i++)
{
line(i*5, height, i*5, height - fft.getBand(i)*10);
}
}
Hvis du nu føjer et kald i draw() til display_spectrum() efter visningen af oscilloskop-sporene, bør du få en overlejret realtids-analyse af den indkommende lyd. Vi kan farve linjerne i spektrumanalysatoren med stroke()-statementet for at reflektere lydintensiteten for hver analyseret frekvens.
stroke(0,fft.getBand(i)*10,0);
Vi kan få spektrumanalysatoren til at at vise tykkere bjælker med rect()-statementet i stedet for line(). Det tegner et rektangel. Vi bruger simpelthen fill()-statementet til at angive farven (i dette tilfælde den samme dynamiske grønne som før) og tegne rektanglet.
fill(0,fft.getBand(i)*10,0);
rect(i*5,height,5,-fft.getBand(i)*10);
Processing er en effektiv metode til hurtigt at få visuelle ideer omsat til kode, men dets egentlige styrke ligger i de biblioteker, der udvider kernesproget. Der findes mange andre end Minim, som følger med Processing 2.0, og flere bliver vedligeholdt af brugermiljøet. Der er en komplet liste på http://bit.ly/boRoS.
Open Processings website (http://bit.ly/aF7eu0) rummer hundreder af eksempler på Processing-sketcher.
Klik ‘Browse’ øverst på Open Processing-siden for at åbne arkivet med uploadede sketcher. Klik på fanen ‘Popular’ for at se sketcher, andre kan lide, eller vælg ‘Tags’ for at søge efter emne. Hver sketch hos Open Processing kører også i din webbrowser, og det er nemt at komme rundt.
Der er så mange sketcher at vælge imellem, at det er nyttigt at kunne klikke på ‘Collections’ og se de grupper, som andre har samlet.
Hvis du vil se kildekoden for en sketch, skal du klikke på fanen ‘Code’. Så kan du kopiere og indsætte den i Processing. Mange af sketchene på website rummer omfattende og meget beskrivende kommentarer, som kan hjælpe dig med at forstå, hvad der sker bag kulisserne. Hvis du er særlig stolt af dit eget arbejde, kan du uploade din egen sketch til Open Processing og prale med dine færdigheder. Hvis du opretter en konto, kan du lave din egen portfolio og vise dine sketcher.
Få bedre styr på Minims audio-output
1. Visualiser filteret
Vi vil lave en oscillator, der frembringer en sawtooth-kurveform, et audio-output, der spiller den lyd, oscillatoren laver, og et lowpass-filter, der påvirker audio-outputtet og filtrerer lyden.
2. Koden
Skriv denne sketch, og kør den.
import ddf.minim.*;
import ddf.minim.signals.*;
import ddf.minim.analysis.*;
import ddf.minim.effects.*;
Minim minim;
AudioOutput output;
SawWave sawtooth;
LowPassFS lowpass;
void setup()
{
size(800, 200);
minim = new Minim(this);
output = minim.getLineOut(Minim.STEREO, 512);
sawtooth = new SawWave(440, 1, 44100);
lowpass = new LowPassFS(200, 44100);
output.addSignal(sawtooth);
output.addEffect(lowpass);
}
void draw()
{
lowpass.setFreq(map(mouseX, 0, width, 60, 5000));
3. Kør sketchen
Draw()-funktionen læser musens vandrette position og kortlægger den returnerede værdi til mellem 60 og 5.000 Hz. Det bruger den til at indstille cutoff-frekvensen til filteret. En sawtooth danner en lyd, der er rig på harmonier.
1. Gå til JavaScript-tilstand
Når man laver en webside fra grunden, kan man konvertere den til JavaScript, så enhver webbrowser kan læse den uden at have Java installeret. Gem sketchen, og klik ‘Standard’ øverst i Processing-programmerings-miljøet. Vælg ‘JavaScript’ fra listen over alternativer, så starter miljøet sig selv i JavaScript-tilstand.
2. Kør sketchen
Kør sketchen ved blot at klikke ‘Run’-knappen på værktøjslinjen. Processing starter en webserver i baggrunden og åbner din webbrowser (eller en ny fane, hvis den allerede kører) for at køre sketchen. Hvis din browser har en plugin såsom NoScript kørende, skal du aktivere scripts på din lokale host (127.0.0.1) for at give scriptet lov til at køre..
3. Eksporter sketchen
Klik ‘File > Export’, så bliver sketchen eksporteret som en JavaScript-app. Mappen med appen rummer tre filer og en mappe, hvoraf den første er index.html. Dobbeltklik på den for at køre appen. Den anden fil er Processings JavaScript-bibliotek, processing.js. Endelig er der sketchen. Eventuelle biblioteker er i Libs-mappen.
Hvis du bruger Eclipse til at udvikle Java, kan du udvikle sketcher med Proclipsing
1. Hent Eclipse
Med Java installeret downloader du Eclipse IDE forJava Developers fra http://bit.ly/5YPO6 og åbner zipfilen. Installer Eclipse ved at trække den øverste mappe fra dette arkiv til dit Documents-bibliotek. Åbn så mappen, og dobbeltklik den eksekverbare. Eclipse-miljøet bliver åbnet og beder dig om et workspace. Accepter standardvalget.
2. Installer Proclipsing
Klik ‘Help > Install new software’, klik så ‘Add’. Skriv navnet Proclipsing og en placering for http://proclipsing.googlecode.com/svn/tags/current_releases/proclipsingSite/. Klick ‘Add’, vælg boksene ‘Core’ og ‘Export’, tryk ‘Next’ to gange, accepter licensaftalen, og klik ‘Finish’. Du bliver nu bedt om at genstarte.
3. Tjek installationen
Nu vil vi vide, om Proclipsing er installeret korrekt. Klik ‘Window > Preferences’. I vinduet kan du se en tekst i Proclipsings venstre felt. Klik her, og sørg for, at de to stier til højre fører til den mappe, der rummer Processing-filen og Processings sketchpad.
4. Opret et Processing-projekt
Nu kan vi oprette et Processing-projekt og se, hvordan det ser ud. Klik ‘File > New > Project’. Blad ned til Processing-teksten, fold den ud, og vælg ‘Processing project’. Klik ‘Next’, skriv et projektnavn, og vælg de biblioteker, du vil bruge i projektet. Klik ‘Finish’ for at oprette projektet.
5. Projektstruktur
Dit projekts træ kan ses i venstre side af Eclipse. Fold det og src-undertræet ud. Her er en datamappe, hvor du gemmer dine mediefiler, billeder og så videre. Du finder også selve sketchen. Fold den ud, og dobbeltklik på Javafilen. En Java-kildefil kommer frem. Bemærk, at den rummer de sædvanlige setup- og trækfunktioner.
6. Kør sketchen
Giv sketchen noget at lave ved at føje linjen size(400,400) til setup-funktionen. Føj så linjen Ellipse(100,100,150,100) til trækfunktionen. Gem projektet, og kør det ved at klikke ‘Run > Run as > Java applet’. Det sædvanlige Processing-outputvindue viser en ellipse. Til lykke, du kører en Processing-sketch i Eclipse!
Man kan eksportere en sketch fra Processing som en eksekverbar fil, man kan sende til en ven. Klik ‘File > Export’. Et vindue giver adgang til adskillige operativsystemer. Vælg det rigtige.
Man kan også vælge, om man vil have applikationen til at køre i fuld skærm. Hvis dit output-vindue er lille, giver det ingen mening, men hvis din sketch bruger hele skærmen, er det en god ide. Hvis du vælger det, bliver applikationen kompileret med en speciel ‘Stop’-knap forneden, så brugerne kan vende tilbage til operativsystemet.
Klik ‘Export’, så bliver sketchmappen åbnet. Du kan se en mappe ved navn application.<OS>, hvor OS er navnet på operativsystemet. Hvis du har nogen ressourcefiler, indsætter du dem i hver af disse målmapper. Nu kan du e-maile applikationsmapperne til folk. Brugerne trækker blot den øverste mappe i zipfilen til et passende sted, åbner den og dobbeltklikker på den eksekverbare fil.
[themepacific_accordion_section title="Fakta"]
Det skal du bruge
[/themepacific_accordion_section][/themepacific_accordion]