The Telerik UI for ASP.NET Core MediaPlayer allows you to play videos from static sources or from YouTube. It helps you enrich your application with dynamic content and contributes to a better UX. You can style the component, integrate a ListView control to create a playlist and take advantage of the built-in support for keyboard navigation and globalization.
The MediaPlayer allows you to add multiple sources for the same video. For this purpose, you have to configure the quality-dependent client-side HD feature. When this is done, an HD button will be rendered in the bottom right corner and will enable the selection of preferred quality.
You can implement your own playlist, by changing the source of the MediaPlayer dynamically. The MediaPlayer Playlist uses the ListView component to create a list displaying the videos on the right-hand side of the player.
The MediaPlayer is one of the many Telerik UI for ASP.NET Core controls that are supported in both MVC and Razor Pages applications. To learn more about plugging ASP.NET Core components in Razor Pages, check out the documentation article or visit the Razor Pages examples in our GitHub project repository.
The ASP.NET Core MediaPlayer fires a variety of events, including Auto Play, Full Screen, Mute, Pause, and more.
The Telerik UI for ASP.NET Core suite offers two approaches to declare the MediaPlayer or any other component – choose HTML or Tag helpers based on your preference, practice, and technology background, and add this advanced input element to any new or existing form.
Accessibility and Keyboard Navigation
The MediaPlayer component supports keyboard navigation and complies with the Section 508 and WCAG 2.1 guidelines, thus it is accessible to all users.
You can style the Core MediaPlayer with the help of 3 built-in themes and various swatches the component comes with. Explore the Default (Main Dark, Nordic, Purple), Material (Arctic, Lime Dark, Nova) and Bootstrap (Urban, Vintage etc.) You can easily customize the available themes with a few lines of CSS or create a new one with the Progress SASS ThemeBuilder application to meet your client’s design requirements.