Next

Φόρτωση - load και αναπαραγωγή - play 'ηχουε

Το p5.js διαθέτει ενσωματωμένη βιβλιοθήκη ήχου p5.js, η οποία μας επιτρέπει να χειριζόμαστε τον ήχο.

Για να φορτώσουμε τον ήχο, χρησιμοποιούμε τη συνάρτηση  loadSound() .  Παρόμοια με άλλα μέσα, βάζουμε αυτή τη λειτουργία μέσα σε preload().

Για να παίξουμε πραγματικά τον ήχο θα πρέπει να χρησιμοποιήσουμε τη συνάρτηση  play(). 

Επιπλέον, μπορούμε να ρυθμίσουμε το επίπεδο ήχου χρησιμοποιώντας τη συνάρτηση setVolume() . Αυτή η συνάρτηση λαμβάνει τιμές από 0,0 (ελάχιστο) έως 1,0 (μέγιστο).

Παράδειγμα

Ακολουθεί ένα παράδειγμα κώδικα όπου φορτώνουμε και παίζουμε έναν ήχο:

function preload() {
 mySound = loadSound('sounds/Sg.mp3');
}

function setup() {
  // define the sound level
  mySound.setVolume(0.1);
  // play the sound
  mySound.play();
}

Μπορείτε να δείτε το αποτέλεσμα του παραπάνω κώδικα here

Exercise

  1. Open your Visual Studio editor and the p5yourName folder.
  2. Open the file ex812.js in your editor and save it as ex1031.js
  3. Open the file ex812.html in your editor and save it as ex1031.html
  4. In the ex1031.html file, update the link to ex1031.js  from exersice812.js
  5. Go to the index.html file and create, under Module 10, a link to the ex1031.html  file with the title "load and play sound".

Modify the ex1031.jsfile and use as a base the above example to load a sound. The sound volume should increase as long as the mouse is pressed and when released, should return to the original volume. You can see here an example.

Answer:

function preload() {
 mySound = loadSound('sounds/Sg.mp3');
}

function setup() {
  // define the sound level
  mySound.setVolume(0.1);
  // play the sound
  mySound.play();
}
function mousePressed() {
  // increase sound level when mouse is pressed
  mySound.setVolume(0.5);
}
function mouseReleased() {
  // return to the original sound level
  mySound.setVolume(0.1);
}

Κάντε μια  Git commit με το μήνυμα "load and play sound".

  • Δείτε περισσότερα για την loadSound() function
  • Δείτε περισσότερα για την play() function
  • Δείτε περισσότερα για την setVolume() function
Next