 <p>I had the same problem yesterday. I'm sure there must be a better way but I couldn't see anything in the documentation, this was my solution:</p> <pre><code>var animation = require('alloy/animation'); var previousIndex = $.tabbedBar.getIndex(); $.tabbedBar.addEventListener('click', function(){ var currentIndex = $.tabbedBar.getIndex(); var viewArr = []; viewArr[0] = $.view1; viewArr[1] = $.view2; viewArr[2] = $.view3; animation.crossFade(viewArr[previousIndex], viewArr[currentIndex], 700) previousIndex = currentIndex; }); </code></pre> <p>EDIT: (In case you don't know, on Android there's a module to give you similar functionality: <a href="https://github.com/ricardoalcocer/viewpager" rel="nofollow">https://github.com/ricardoalcocer/viewpager</a> but check issue #5 on the original repo as you'll have to incorporate that into any build. On the Android version, you don't need to handle the clicks yourself.)</p>