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 the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.