Play fullscreen video using nativescript-exoplayer

Question

I'm using nativescript with angular.I have successfully inserted the video player using nativescript-exoplayer plugin but can't find any way to play videos in fullscreen.How could I implement this?please help.

Answer 1

I was recently trying to do the same thing and found a solution that isn't perfect but should get the job done. It works better with vertical videos because it isn't actually a full-screen setting but it is a workaround that allows you to have your video take up most of the device.

What you should do is to create a new component in angular as well as a new service. When you want to make a video full screen, update the src variable in the service. Here is my code (.ts file) for that function where this.videoPlayer references the service seen below. (The last line of the function simply is how I redirect to the fullscreen component)

 fullscreen() {
this.videoPlayer.src = this.videoSrc;
this.nav.dashboard = 'fullscreen';


}

The service is very simple, it is only used to transfer the src of the video - nothing else:

import { Injectable } from '@angular/core';


@Injectable({
  providedIn: 'root'
})
export class VideoplayerService {
src: string;

  constructor() { }
}

Here are the important parts of my fullscreencomponent where this.videoPlayer again references the service:

export class FullScreenComponent implements OnInit {
src: string;

 
  ngOnInit() {
    this.src = this.videoPlayer.src;
  }

  back() {
    this.nav.dashboard = 'dashboard';
  }

}

And now, you can use the same code you had before that implemented the exoplayer, but add:

height="100%"
width="100%"

This will set the video to take up as much of the screen as it can (note - it might not take up all of the screen due to video size)

I tested this on Android