Create a gist now

Instantly share code, notes, and snippets.

What would you like to do?
Given a sentence as a string, fade in each word and play a sound when the word has been faded in. Titanium Appcelerator.
//import builtin alloy animations
var animation = require('alloy/animation');
var wordString = "Most good programmers do programming not because they expect to get paid or get adulation by the public, but because it is fun to program";
var wordArray = wordString.split(" ");
var lblArray = [];
var lbl = null;
//Generate Label element for each word
for (var i in wordArray)
{
//create label, set text and hide label
lbl = Ti.UI.createLabel({
text: " "+wordArray[i],
opacity: 0
});
//store in label array which we'll use later for the fadeIn affect
lblArray.push(lbl);
//add label to view
$.paragraph.add(lbl);
}
//Play sound, called when fade in on label has finished
function playSound(){
sound = Titanium.Media.createSound({url:"/bell-ring-01.mp3"});
sound.play();
}
//counter used for tracking which label we're fading in
var x = 0;
animation.fadeIn(lblArray[0], 300, fadeInNext);
function fadeInNext(){
//increment current label counter
x = x+1;
//Make sure we don't try to add more labels than there are
if(x < lblArray.length){
//playSound(); //commented this out, it's kind of annoying
animation.fadeIn(lblArray[x], 500,
fadeInNext
);
}
}
$.container.open();
<Alloy>
<Window class="container" id="container">
<View id="paragraph">
</View>
</Window>
</Alloy>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment