How to play video full screen in landscape using exoplayer

问题

I am using exoplayer to play video from url in my android app. In portrait everything work as expected (using viewpager, fragments and tabs inside activity). My goal is to play the video in full screen when the user is in landscape. It means only the video will play in landscape and all other details will desapear and return back to the original layout when portrait. How can I achieve this please? or what is the best way to achieve this? any sample code will be appreciate.

回答1:

i am a noob so this is the best i can help with, btw I tested this in the Exoplayer Demo application, i changed the exoplayer height to 600px and i applied this code and it worked perfectly.

add this Code to detect screen orientation

  @Override
  public void onConfigurationChanged(Configuration newConfig) {
  super.onConfigurationChanged(newConfig);

  // Checking the orientation of the screen
  if (newConfig.orientation == Configuration.ORIENTATION_LANDSCAPE) {
     //First Hide other objects (listview or recyclerview), better hide them using Gone.
     FrameLayout.LayoutParams params = (FrameLayout.LayoutParams) simpleExoPlayerView.getLayoutParams();
     params.width=params.MATCH_PARENT;
     params.height=params.MATCH_PARENT;
     simpleExoPlayerView.setLayoutParams(params);
  } else if (newConfig.orientation == Configuration.ORIENTATION_PORTRAIT){
     //unhide your objects here.
     FrameLayout.LayoutParams params = (FrameLayout.LayoutParams) simpleExoPlayerView.getLayoutParams();
     params.width=params.MATCH_PARENT;
     params.height=600;
     simpleExoPlayerView.setLayoutParams(params);
  }
}

btw in case you are not using FrameLayout but RelativeLayout

      RelativeLayout.LayoutParams params = (RelativeLayout.LayoutParams) simpleExoPlayerView.getLayoutParams();

I forgot that you need to hide the action or title bar, hope this code helps, add these codes inside the code above, also i think you will need to extend your activity to AppCompatActivity for getSupportActionBar code to work.

if(getSupportActionBar()!=null) {
   getSupportActionBar().hide();
}
//To show the action bar
if(getSupportActionBar()!=null) {
   getSupportActionBar().show();
 }

also this may help to set the whole project in full screen, to hide status bar.etc, must be added inside onConfigurationChanged based on screen orientation.

In LandScape

ExoPlayerActivity.this.getWindow().getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_HIDE_NAVIGATION | View.SYSTEM_UI_FLAG_FULLSCREEN || View.SYSTEM_UI_FLAG_IMMERSIVE);

To exit from fullscreen in PORTRAIT

ExoPlayerActivity.this.getWindow().getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION | View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN);

I edited the code, I added View.SYSTEM_UI_FLAG_IMMERSIVE to prevent status bar from showing when user click on the control button in the video.

回答2:

You can check the orientation while setting the Player and set the params accordingly:

if (getActivity().getResources().getConfiguration().orientation == 
Configuration.ORIENTATION_LANDSCAPE) {
        params = (LinearLayout.LayoutParams) 
exoPlayerView.getLayoutParams();
        params.width = params.MATCH_PARENT;
        params.height = params.MATCH_PARENT;
        exoPlayerView.setLayoutParams(params);
    }

And hide the action bar :

((AppCompatActivity) getActivity()).getSupportActionBar().hide();

回答3:

For screens with hardware buttons, If no other views share the screen with PlayerView of ExoPlayer, it will fill the entire screen by default. However for devices with virtual buttons on the screen, it will not fill the entire screen. in my case the issues fixed by adding this line to PlayerView.

ads:resize_mode="fill"

as I have admob ads in the activity layout, I have added this line in the top RelativeLayout tag.

xmlns:ads="http://schemas.android.com/apk/res-auto"

I know it doesn't make sense, however using android:resize_mode="fill" will gave you gradle building error.

also you might remove system UI for even more space:

    @Override
public void onWindowFocusChanged(boolean hasFocus) {
    super.onWindowFocusChanged(hasFocus);
    if (hasFocus) {
        hideSystemUI();
    }
}

private void hideSystemUI() {
    // Enables  "lean back" mode
    // Or for "sticky immersive," replace it with SYSTEM_UI_FLAG_IMMERSIVE_STICKY
    View decorView = getWindow().getDecorView();
    decorView.setSystemUiVisibility(
            // Hide the nav bar and status bar
            View.SYSTEM_UI_FLAG_HIDE_NAVIGATION
                    | View.SYSTEM_UI_FLAG_FULLSCREEN);

}

for more information please visit android developer page https://developer.android.com/training/system-ui/immersive

回答4:

My solusion with data binding:

layout.xml

<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools">

<data>
    <import type="android.view.View" />
    <variable
        name="orientationLandscape"
        type="boolean" />

    <variable
        name="step"
        type="com.udacity.zeban.baking.data.models.Step" />
</data>

<android.support.constraint.ConstraintLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <com.google.android.exoplayer2.ui.SimpleExoPlayerView
        android:id="@+id/step_video"
        android:layout_width="match_parent"
        android:layout_height="@dimen/player_height"
        app:layout_constraintBottom_toTopOf="@+id/scroll"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_height="@{orientationLandscape}" />

    <ScrollView
        android:id="@+id/scroll"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/step_video">

        <android.support.v7.widget.CardView
            android:id="@+id/description"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_margin="@dimen/spacing_small"
            android:visibility="@{orientationLandscape ? View.GONE : View.VISIBLE}">

            <TextView
                android:id="@+id/step_description"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_margin="@dimen/spacing_small"
                android:text="@{step.getDescription()}"
                tools:text="@tools:sample/lorem/random" />

        </android.support.v7.widget.CardView>
    </ScrollView>
</android.support.constraint.ConstraintLayout>

and add this in your actvity or fragment:

@BindingAdapter("layout_height")
public static void setLayoutHeight(View view, boolean orientationLandscape) {
    view.getLayoutParams().height = orientationLandscape ? RelativeLayout.LayoutParams.MATCH_PARENT : 600;
}

@Override
public void onResume() {
    super.onResume();
    binding.setOrientationLandscape(getResources().getConfiguration().orientation == Configuration.ORIENTATION_LANDSCAPE);
}

My project here

回答5:

Be sure to set the length and width of the player view to match with its parent, in landscape mode.

Use this to hide the status bar: getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN);
Use this to hide the navigation bar: getWindow().getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_HIDE_NAVIGATION);

回答6:

I think we are missing the more obvious answer here. Just create a new layout file in layout-land directory so that the new layout file will be applied when you are in landscape mode.

In this new layout file, simply change your ExoPlayer's layout_height to be match_parent so that it takes up the whole screen.

回答7:

You can make a dialog for the landscape mode, first initialize a dialog,

private void initFullscreenDialog() {
    mFullScreenDialog = new Dialog(mContext, android.R.style.Theme_Black_NoTitleBar_Fullscreen) {
        public void onBackPressed() {
            if (mExoPlayerFullscreen) {    //mExoPlayerFullscreen is a boolean to check if it is already fullscreen or not
                closeFullscreenDialog();
            }
            super.onBackPressed();
        }
    };
}

Now as below you'll initialize your fullscreen button:-

mFullScreenButton.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            if (!mExoPlayerFullscreen) {
                ((Activity) mContext).setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_SENSOR_LANDSCAPE);
                openFullscreenDialog();
            } else {
                ((Activity) mContext).setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_SENSOR_PORTRAIT);
                closeFullscreenDialog();
            }
        }
    });

then you can open and close fullscreen as follows :-

private void openFullscreenDialog() {
    ((ViewGroup) playerView.getParent()).removeView(playerView);
    mFullScreenDialog.addContentView(playerView, new ViewGroup.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT));
    mFullScreenIcon.setImageResource(R.drawable.ic_exit_fullscreen);
    mExoPlayerFullscreen = true;
    mFullScreenDialog.show();
}

private void closeFullscreenDialog() {
    ((ViewGroup) playerView.getParent()).removeView(playerView);
    ((FrameLayout) findViewById(R.id.main_media_frame)).addView(playerView);
    mExoPlayerFullscreen = false;
    mFullScreenDialog.dismiss();
    mFullScreenIcon.setImageResource(R.drawable.ic_fullscreen);
}