Fullscreen button on VideoView
This example shows how to add a fullscreen button on VideoView in Sketchware android project. In the project there will be a button to pick video files and a LinearLayout for the VideoView. On picking the video file, it will play in VideoView and there will be a fullscreen button on the MediaController of the VideoView, clicking on which the video will become fullscreen.
1. In main.xml add a Button button1, a TextView textview1, and a LinearLayout linear2. For linear2 set padding 0, height 300, and gravity CENTER_HORIZONTAL.
2. In View manager set orientation to Both landscape and portrait.
4. Create a List String list, a String path, and a boolean isFullscreen.
5. Create a More block declare. Put following code in it.
}
RelativeLayout rl;
VideoView videoView;
MediaController mc;
FrameLayout fm;
private int mOriginalSystemUiVisibility;
{
6. In onCreate event use add source directly block and put following code in it.
rl = new RelativeLayout(this);
RelativeLayout.LayoutParams rlp = new RelativeLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT);
rl.setGravity(Gravity.CENTER_HORIZONTAL|Gravity.CENTER_VERTICAL);
rl.setBackgroundColor(Color.DKGRAY);
rl.setLayoutParams(rlp);
videoView = new VideoView(this);
FrameLayout.LayoutParams flp = new FrameLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT);
flp.gravity = Gravity.CENTER_HORIZONTAL;
videoView.setLayoutParams(flp);
mc = new FullScreenMediaController(this);
mc.setAnchorView(videoView);
videoView.setMediaController(mc);
rl.addView(videoView);
linear2.addView(rl);
fm = (FrameLayout)MainActivity.this.getWindow().getDecorView();
7. In button1 onClick, pick files.
8. In picker onFilesPicked event, use blocks and codes as shown in image.
The code used is
Uri videoUri = Uri.fromFile(new java.io.File(path));
videoView.setVideoURI(videoUri);
videoView.start();
9. Create a More Block show_fullscreen. Put following code in it, and set isFullscreen to true.
int currentPosition = videoView.getCurrentPosition();
mOriginalSystemUiVisibility = fm.getSystemUiVisibility();
linear2.removeAllViews();
fm.addView(rl);
MainActivity.this.getWindow().addFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN);
fm.setSystemUiVisibility(3846);
videoView.start();
videoView.seekTo(currentPosition);
10. Create a more block hide_fullscreen. Put following code in it, and set isFullscreen to false.
int currentPosition = videoView.getCurrentPosition();
fm.removeView(rl);
fm.setSystemUiVisibility(mOriginalSystemUiVisibility);
MainActivity.this.getWindow().clearFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN);
linear2.addView(rl);
videoView.start();
videoView.seekTo(currentPosition);
11. Using ImageManager add images of fullscreen buttons: ic_fullscreen_white and ic_fullscreen_exit_white.
12. Create a more block extra and put codes to define a FullScreenMediaController in it.
}
public class FullScreenMediaController extends MediaController {
public FullScreenMediaController(Context context) {
super(context);
}
@Override
public void setAnchorView(View view) {
super.setAnchorView(view);
final ImageView fullScreen = new ImageView(super.getContext());
FrameLayout.LayoutParams params = new FrameLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
params.gravity = Gravity.RIGHT; params.rightMargin = 80;
params.topMargin = 50;
addView(fullScreen, params);
if(isFullscreen){
fullScreen.setImageResource(R.drawable.ic_fullscreen_exit_white);
} else{
fullScreen.setImageResource(R.drawable.ic_fullscreen_white);
}
fullScreen.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
if(isFullscreen){
_hide_fullscreen();
} else{
_show_fullscreen();
}
} });
}}{
13. In onBackPressed event, hide fullscreen if it is fullscreen and finish activity if it is not fullscreen.
