Draw overlay (HUD) on Android VideoView?

Question

I have a custom view that draws a HUD :

Here is my layout:

<?xml version="1.0" encoding="utf-8"?> <FrameLayout 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/videoView1" android:layout_gravity="center" android:layout_width="match_parent" android:layout_height="wrap_content" /> <com.widgets.HUD android:id="@+id/hud" android:layout_width="fill_parent" android:layout_height="fill_parent" /> </FrameLayout> 

 public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { View view = inflater.inflate(R.layout.hud_fragment, container, false); frameLayout = (FrameLayout) view.findViewById(R.id.frameLayout); hudWidget = (HUD) view.findViewById(R.id.hudWidget); videoView = (VideoView) view.findViewById(R.id.videoView1); videoView.setVideoURI(Uri.parse("http://88.150.210.138:5001/spor")); videoView.start(); frameLayout.removeView(hudWidget); frameLayout.addView(hudWidget); hudWidget.bringToFront(); return view; } 

I play the RTSP stream on my VideoView , as soon as the video starts playing, it looks like this:

How can I make HUD draw on top of VideoView ? HUD extends SurfaceView

Project

• The project that I am trying to add to VideoView, DroidPlanner. You can try cloning and see the problem. (You must add the VideoView manually because it is not in the repo).

Answer 1

I found the answer to your question: VideoViews on top of SurfaceView SurfaceViews and VideoViews are surface views and are not supported for overlapping them in older versions of Android, but are available from version 2.0.

What you need to do:

• set pixelformat to TRANSPARENT to allow video flow through the interface

hudWidget.getHolder().setFormat(PixelFormat.TRANSPARENT);

2. set the HUD surface as a media overlay.

hudWidget.setZOrderMediaOverlay(true);

3. create a new surface and set it as Display for MediaPlayer, which plays the video.

There is a transfer request where you can try them. https://github.com/arthurbenemann/droidplanner/pull/247

The thread that brought the solution: https://groups.google.com/forum/?fromgroups#!msg/android-developers/nDNQcceRnYA/ps9wTBfXIyEJ

Answer 2

From the FrameLayout documentation available here: Link

Child modes are drawn on the stack, with the last child added up

Add id in FrameLayout to your layout file. In your onCreate(Bundle) you will have something similar:

 // find your framelayout frameLayout = (FrameLayout) findViewById(....); videoView = (VideoView) findViewById(R.id.videoView1); hudView = (com.widgets.HUD) findViewById(R.id.hud); 

After starting the video, do the following:

 frameLayout.removeView(hudView); frameLayout.addView(hudView); 

Answer 3

make a Handler that invalidate your hudView every 50 or 100 milliseconds

like this:

 @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { View view = inflater.inflate(R.layout.hud_fragment, container, false); frameLayout = (FrameLayout) view.findViewById(R.id.frameLayout); hudWidget = (HUD) view.findViewById(R.id.hudWidget); videoView = (VideoView) view.findViewById(R.id.videoView1); videoView.setVideoURI(Uri.parse("http://88.150.210.138:5001/spor")); videoView.start(); frameLayout.removeView(hudWidget); frameLayout.addView(hudWidget); hudWidget.bringToFront(); //The Handler which invalidate your (hudWidget) every 50 milliseconds new Handler() { public void handleMessage(android.os.Message msg) { super.handleMessage(msg); hudWidget.invalidate(); sendEmptyMessageDelayed(0, 50); }; }.sendEmptyMessage(0); return view; } 

Answer 4

Check FrameLayout to replace RelativeLayout.

It may work well.

Answer 5

Extend VideoView and call setWillNotDraw(false) in its constructor. This way you can draw in onDraw(Canvas) .