|
App inventor 2 en español
Cómo programar los teléfonos móviles con Android.
Curso de App inventor 2 en español - Juan Antonio Villalpando
-- Tutorial de iniciación de App Inventor 2 en español --
Volver al índice del tutorial
___________________________
169K.- Generador de frecuencias de audio con JavaScript.
 p169K_javascript_audio.aia
- Al mover el Deslizador se envía un dato al archivo de JavaScript que produce un sonido.
- También se puede oir sonidos al tocar sobre los textos de la pantalla.
- El código principal es una adaptación de esta página:
http://www.softsynth.com/webaudio/tone.php
- Para oir bien el efecto es conveniente utilizar los auriculares ya que que el altavoz interno cubre una más pequeña gama de frecuencias.
_________________
- Diseño.
- Subimos los archivos webaudio_tools.js y sonido.html
- En esta ocasión el VisorWeb debe ser Visible, ya que en él se mostrará los botones para elegir sonido.
_________________
- Bloques.
_________________
- Archivo sonidos.html.
sonidos.html |
<!DOCTYPE html>
<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title></title>
</head>
<body >
<script type="text/javascript" src="webaudio_tools.js"> </script>
<script>
datos = window.AppInventor.getWebViewString() ;
// script type="text/javascript" src="tone.js"
// Example showing how to produce a tone using Web Audio API.
// Load the file webaudio_tools.js before loading this file.
// This code will write to a DIV with an id="soundStatus".
var oscillator;
var amp;
// Create an oscillator and an amplifier.
function initAudio()
{
// Use audioContext from webaudio_tools.js
if( audioContext )
{
oscillator = audioContext.createOscillator();
fixOscillator(oscillator);
oscillator.frequency.value = 440;
amp = audioContext.createGain();
amp.gain.value = 0;
// Connect oscillator to amp and amp to the mixer of the audioContext.
// This is like connecting cables between jacks on a modular synth.
oscillator.connect(amp);
amp.connect(audioContext.destination);
oscillator.start(0);
writeMessageToID( "soundStatus", "<p>Audio initialized.</p>");
}
////////////////////////////// DATOS de App Inventor ////////////////////////////////////////
stopTone();
startTone(datos);
//////////////////////////////////////////////////////////////////////////////////////////
}
// Set the frequency of the oscillator and start it running.
function startTone( frequency )
{
var now = audioContext.currentTime;
oscillator.frequency.setValueAtTime(frequency, now);
// Ramp up the gain so we can hear the sound.
// We can ramp smoothly to the desired value.
// First we should cancel any previous scheduled events that might interfere.
amp.gain.cancelScheduledValues(now);
// Anchor beginning of ramp at current value.
amp.gain.setValueAtTime(amp.gain.value, now);
amp.gain.linearRampToValueAtTime(0.5, audioContext.currentTime + 0.1);
////writeMessageToID( "soundStatus", "<p>Play tone at frequency = " + frequency + "</p>");
}
function stopTone()
{
var now = audioContext.currentTime;
amp.gain.cancelScheduledValues(now);
amp.gain.setValueAtTime(amp.gain.value, now);
amp.gain.linearRampToValueAtTime(0.0, audioContext.currentTime + 1.0);
writeMessageToID( "soundStatus", "<p>Stop tone.</p>");
}
// init once the page has finished loading.
window.onload = initAudio;
</script>
<p><span onmouseover="startTone(800)" onmouseout="stopTone()">Roll mouse over for 800 Hz tone</span></p>
<p><span onmouseover="startTone(400)" onmouseout="stopTone()">Roll mouse over for 400 Hz tone</span></p>
<p><span onmouseover="startTone(200)" onmouseout="stopTone()">Roll mouse over for 200 Hz tone</span></p>
<p><span onmouseover="startTone(100)" onmouseout="stopTone()">Roll mouse over for 100 Hz tone</span></p>
</body></html>
|
_________________
- Propuesta.
- Realiza un pequeño piano.
- Modifica algunos parámetros del archivo sonidos.html.
__________________________________
|
