Full screen videoview without stretching the video

Android Stack picture Android Stack · Aug 31, 2012 · Viewed 79k times · Source

I wonder if I can get a way to let video run via videoview in full screen?

I searched a lot and tried many ways such as:

  1. Apply theme in manifest:

    android:theme="@android:style/Theme.NoTitleBar.Fullscreen"
    

    but that does not force the video to be in full screen.

  2. Apply in activity itself:

    requestWindowFeature(Window.FEATURE_NO_TITLE);  
    getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,  
        WindowManager.LayoutParams.FLAG_FULLSCREEN);
    

    also does not force the video to be in full screen.

The only way force video to full screen is:

<VideoView android:id="@+id/myvideoview"
    android:layout_width="fill_parent"
    android:layout_alignParentRight="true"
    android:layout_alignParentLeft="true" 
    android:layout_alignParentTop="true" 
    android:layout_alignParentBottom="true" 
    android:layout_height="fill_parent"> 
</VideoView> 

This way it results in full screen video but it stretches the video itself (elongated video) ,

I'm not applying this improper solution to my videoview, so is there is any way to do it without stretching the video?

Video Class:

public class Video extends Activity {
    private VideoView myvid;

    @Override
    public void onCreate(Bundle icicle) {
        super.onCreate(icicle);
        setContentView(R.layout.main);
        myvid = (VideoView) findViewById(R.id.myvideoview);
        myvid.setVideoURI(Uri.parse("android.resource://" + getPackageName() 
            +"/"+R.raw.video_1));
        myvid.setMediaController(new MediaController(this));
        myvid.requestFocus();
        myvid.start();
    }
}

main.xml:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <VideoView
        android:id="@+id/myvideoview"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" />

</LinearLayout>

Answer

caiocpricci2 picture caiocpricci2 · Sep 9, 2012

Like this you can set the properties of the video by yourself.

Use a SurfaceView (gives you more control on the view), set it to fill_parent to match the whole screen

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"     
              android:orientation="vertical" 
              android:layout_width="match_parent"
              android:layout_height="fill_parent">

    <SurfaceView
        android:id="@+id/surfaceViewFrame"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_gravity="center" >
    </SurfaceView>
</Linearlayout>

then on your java code get the surface view and add your media player to it

surfaceViewFrame = (SurfaceView) findViewById(R.id.surfaceViewFrame);
player = new MediaPlayer();
player.setDisplay(holder);

set on your media player a onPreparedListener and manually calculate the desired size of the video, to fill the screen in the desired proportion avoiding stretching the video!

player.setOnPreparedListener(new OnPreparedListener() {

        @Override
        public void onPrepared(MediaPlayer mp) {
                    // Adjust the size of the video
    // so it fits on the screen
    int videoWidth = player.getVideoWidth();
    int videoHeight = player.getVideoHeight();
    float videoProportion = (float) videoWidth / (float) videoHeight;       
    int screenWidth = getWindowManager().getDefaultDisplay().getWidth();
    int screenHeight = getWindowManager().getDefaultDisplay().getHeight();
    float screenProportion = (float) screenWidth / (float) screenHeight;
    android.view.ViewGroup.LayoutParams lp = surfaceViewFrame.getLayoutParams();

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

    if (!player.isPlaying()) {
        player.start();         
    }

        }
    });

I modified this from a tutorial for video streaming that I followed some time ago, can't find it right now to reference it, if someone does please add the link to the answer!

Hope it helps!

EDIT

Ok, so, if you want the video to occupy the whole screen and you don't want it to stretch you will end up with black stripes in the sides. In the code I posted we are finding out what is bigger, the video or the phone screen and fitting it the best way we can.

There you have my complete activity, streaming a video from a link. It's 100% functional. I can't tell you how to play a video from your own device because I don't know that. I'm sure you will find it in the documentation here or here.

public class VideoPlayer extends Activity implements Callback, OnPreparedListener, OnCompletionListener, 
    OnClickListener {   

private SurfaceView surfaceViewFrame;
private static final String TAG = "VideoPlayer";
private SurfaceHolder holder;
private ProgressBar progressBarWait;
private ImageView pause;
private MediaPlayer player; 
private Timer updateTimer;
String video_uri = "http://daily3gp.com/vids/familyguy_has_own_orbit.3gp";  


@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.videosample);       


    pause = (ImageView) findViewById(R.id.imageViewPauseIndicator);
    pause.setVisibility(View.GONE);
    if (player != null) {
        if (!player.isPlaying()) {
            pause.setVisibility(View.VISIBLE);
        }
    }


    surfaceViewFrame = (SurfaceView) findViewById(R.id.surfaceViewFrame);
    surfaceViewFrame.setOnClickListener(this);
    surfaceViewFrame.setClickable(false);

    progressBarWait = (ProgressBar) findViewById(R.id.progressBarWait);

    holder = surfaceViewFrame.getHolder();
    holder.addCallback(this);
    holder.setType(SurfaceHolder.SURFACE_TYPE_PUSH_BUFFERS);

    player = new MediaPlayer();
    player.setOnPreparedListener(this);
    player.setOnCompletionListener(this);
    player.setScreenOnWhilePlaying(true);
    player.setDisplay(holder);
}

private void playVideo() {
        new Thread(new Runnable() {
            public void run() {
                try {
                    player.setDataSource(video_uri);
                    player.prepare();
                } catch (Exception e) { // I can split the exceptions to get which error i need.
                    showToast("Error while playing video");
                    Log.i(TAG, "Error");
                    e.printStackTrace();
                } 
            }
        }).start();     
}

private void showToast(final String string) {
    runOnUiThread(new Runnable() {
        public void run() {
            Toast.makeText(VideoPlayer.this, string, Toast.LENGTH_LONG).show();
            finish();
        }
    });
}


public void surfaceChanged(SurfaceHolder holder, int format, int width, int height) {
    // TODO Auto-generated method stub

}

public void surfaceCreated(SurfaceHolder holder) {
    playVideo();
}

public void surfaceDestroyed(SurfaceHolder holder) {
    // TODO Auto-generated method stub

}
//prepare the video
public void onPrepared(MediaPlayer mp) {        
    progressBarWait.setVisibility(View.GONE);

    // Adjust the size of the video
    // so it fits on the screen
    int videoWidth = player.getVideoWidth();
    int videoHeight = player.getVideoHeight();
    float videoProportion = (float) videoWidth / (float) videoHeight;       
    int screenWidth = getWindowManager().getDefaultDisplay().getWidth();
    int screenHeight = getWindowManager().getDefaultDisplay().getHeight();
    float screenProportion = (float) screenWidth / (float) screenHeight;
    android.view.ViewGroup.LayoutParams lp = surfaceViewFrame.getLayoutParams();

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

    if (!player.isPlaying()) {
        player.start();         
    }
    surfaceViewFrame.setClickable(true);
}

// callback when the video is over
public void onCompletion(MediaPlayer mp) {
    mp.stop();
    if (updateTimer != null) {
        updateTimer.cancel();
    }
    finish();
}

//pause and resume
public void onClick(View v) {
    if (v.getId() == R.id.surfaceViewFrame) {
         if (player != null) {
            if (player.isPlaying()) {
                player.pause();
                pause.setVisibility(View.VISIBLE);
            } else {
                player.start();
                pause.setVisibility(View.GONE);
            }
        }
    }
}

}