albemala / native_video_player

A Flutter widget to play videos on iOS and Android using a native implementation.
MIT License
14 stars 12 forks source link

How do I do it if I want the size to fit width? #10

Closed ayyuby26 closed 10 months ago

albemala commented 11 months ago

@ayyuby26 Sorry, I'm not sure I understand the question. The NativeVideoPlayerView should automatically adapt it's size to the container. You can wrap it into an AspectRatio widget to force an aspect ratio. Check the example code also. Did I answer your question?

rohitranjan1991 commented 11 months ago

@albemala, I am facing a similar issue. I have a video of dimension 1080x608 and with your plugin, I am able to play the video but the video is occupying only 1/3rd of the screen as 2/3 of the screen is white.

I am attempting to play this in Android TV Box where Horizontal width is more that Vertical. I am looking for any ways to stretch the video to cover the whole screen in this plugin

PS: Aspect Ratio does not help here.

albemala commented 11 months ago

@rohitranjan1991 thank you for the additional details. Do you have this problem only on Android TV? or on Android phones/tablets as well?

Would it be possible to share the code you are using to show the video player?

rohitranjan1991 commented 11 months ago

@albemala, yeah It's an Android TV. The problem is with android tv right now but I think the problem may also occur in android phones if the resolution of the video does not match the resolution of the android phone since the video is not streching. This is my build method:

@override
  Widget build(BuildContext context) {
    double mWidth = MediaQuery.of(context).size.width;
    double mHeight = MediaQuery.of(context).size.height;
    return SizedBox(
      height: mHeight,
      width: mWidth,
      child: Stack(
        children: [
          Positioned(
            top: 0,
            bottom: 0,
            left: 0,
            right: 0,
            child: Stack(
              children: [
                Text("currentPlaylistIndex : $currentPlaylistIndex"),
                Container(
                    width: mWidth,
                    height: mHeight,
                    decoration: BoxDecoration(border: Border.all(color: Colors.green)),
                    child: AspectRatio(
                      aspectRatio: 16/9,
                      child: NativeVideoPlayerView(
                        onViewReady: (NativeVideoPlayerController controller) async {
                          log("Initial Video Player Called");
                          _activeVideoController = controller;
                          _init();
                        },
                      ),
                    )),
              ],
            ),
          ),
        ],
      ),
    );
  }

In the below code, the green border is covering the whole screen of the Android TV.

decoration: BoxDecoration(border: Border.all(color: Colors.green)),
rohitranjan1991 commented 11 months ago

@albemala, In your code in the file NativeVideoPlayerViewController, If I make these two changes, It works for me. I am basically wrapping the videoView around a Relative Layout with Match_Parent. Would you be able to provide a dynamic way of wrapping the VideoView around Relative Layout in the dart code so that developers who want to stretch the video can do so ?


  private val relLayout:RelativeLayout

 init {
        api.delegate = this

        videoView = VideoView(context)
        videoView.setBackgroundColor(0)
        // videoView.setZOrderOnTop(true)
        videoView.setOnPreparedListener(this)
        videoView.setOnCompletionListener(this)
        videoView.setOnErrorListener(this)

        relLayout = RelativeLayout(context)
        val rlp = RelativeLayout.LayoutParams(
            RelativeLayout.LayoutParams.MATCH_PARENT,
            RelativeLayout.LayoutParams.MATCH_PARENT
        )
        rlp.addRule(RelativeLayout.ALIGN_PARENT_LEFT);
        rlp.addRule(RelativeLayout.ALIGN_PARENT_TOP);
        rlp.addRule(RelativeLayout.ALIGN_PARENT_RIGHT);
        rlp.addRule(RelativeLayout.ALIGN_PARENT_BOTTOM);
        videoView.layoutParams = rlp
        relLayout.layoutParams = RelativeLayout.LayoutParams(
            RelativeLayout.LayoutParams.MATCH_PARENT,
            RelativeLayout.LayoutParams.MATCH_PARENT
        )
        relLayout.addView(videoView)
    }

and

  override fun getView(): View {
        return relLayout
    }
rranjan007 commented 11 months ago

@albemala any update on this ?

rohitranjan1991 commented 10 months ago

@albemala any update on this ?

albemala commented 10 months ago

I've just published a new version (1.3.1) and the issue should be fixed now. please let me know if that's the case or if you still have the same problem. @rohitranjan1991 thank you your help, I appreciate it :)