Android VideoView Proportional Scaling

Question

In Android\'s VideoView, is there any way to achieve the same effect as ImageView.ScaleType.CENTER_CROP?

That is, I want my VideoView to play the video such that it

Answer 1

In Android's VideoView, here is a simple and easy way to achieve the same effect as ImageView.ScaleType.CENTER_CROP

XML

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">

    <VideoView
        android:id="@+id/videoView"
        android:layout_width="@dimen/dimen_0dp"
        android:layout_height="@dimen/dimen_0dp"
        android:visibility="gone"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

In Kotlin:

videoView.setOnPreparedListener { mediaPlayer ->
    val videoRatio = mediaPlayer.videoWidth / mediaPlayer.videoHeight.toFloat()
    val screenRatio = videoView.width / videoView.height.toFloat()
    val scaleX = videoRatio / screenRatio
    if (scaleX >= 1f) {
        videoView.scaleX = scaleX
    } else {
        videoView.scaleY = 1f / scaleX
    }
}

In JAVA:

videoView.setOnPreparedListener(new MediaPlayer.OnPreparedListener() {
@Override
public void onPrepared(MediaPlayer mp) {
      float videoRatio = mp.getVideoWidth() / (float) mp.getVideoHeight();
      float screenRatio = videoView.getWidth() / (float) 
      videoView.getHeight();
      float scaleX = videoRatio / screenRatio;
      if (scaleX >= 1f) {
          videoView.setScaleX(scaleX);
      } else {
          videoView.setScaleY(1f / scale);
      }
   }
});

And this worked for me. Hope this will help someone.

Answer 2

Although it is too late, but it might help someone else looking for the same problem. The following answer maintains the aspect ratio(videoProportion). The extra part of the videoview is cropped by the Phone's view.

private void setDimension() {
     // Adjust the size of the video
     // so it fits on the screen
     float videoProportion = getVideoProportion();
     int screenWidth = getResources().getDisplayMetrics().widthPixels;
     int screenHeight = getResources().getDisplayMetrics().heightPixels;
     float screenProportion = (float) screenHeight / (float) screenWidth;
     android.view.ViewGroup.LayoutParams lp = videoView.getLayoutParams();

     if (videoProportion < screenProportion) {
         lp.height= screenHeight;
         lp.width = (int) ((float) screenHeight / videoProportion);
     } else {
         lp.width = screenWidth;
         lp.height = (int) ((float) screenWidth * videoProportion);
     }
     videoView.setLayoutParams(lp);
 }

// This method gets the proportion of the video that you want to display.
// I already know this ratio since my video is hardcoded, you can get the  
// height and width of your video and appropriately generate  the proportion  
//    as :height/width 
private float getVideoProportion(){
  return 1.5f;
}

Answer 3

ConstraintLayout has an attribute app:layout_constraintDimensionRatio for this purpose.

<androidx.constraintlayout.widget.ConstraintLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <VideoView
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:layout_constraintDimensionRatio="4:3" <!-- w:h -->
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />
</ConstraintLayout>

See the official documentation for more details