Creating a custom ShuttleSliderComponent

We can't have a multitrack studio experience without the ability to shuttle back and forth through our mix! Let's double down on Slider and enhance its capabilities by combining the best of all the options NativeScript and Angular provide us. In the process, our player controls will start to become much more useful.

Starting at the high level, open app/modules/player/components/player-controls/player-controls.component.html and replace it with the following:

<StackLayout row="1" col="0" class="controls">  <shuttle-slider [currentTime]

="currentTime"     [duration]="duration"></shuttle-slider>  <Button 

[text]="playStatus" (tap)="togglePlay()"    class="btn btn-primary w-100"></Button></StackLayout>

We are replacing ...

Get NativeScript for Angular Mobile Development now with O’Reilly online learning.

O’Reilly members experience live online training, plus books, videos, and digital content from 200+ publishers.