Draw overlay (HUD) on Android VideoView?
I have a custom view that draws 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 an RTSP stream on my VideoView as soon as the video starts playing it looks like that:
How can i force the HUD to draw on top of the VideoView ? HUD extends SurfaceView
Project
The project I'm trying to add the the VideoView is DroidPlanner You can try cloning and see the problem. (Need to add the VideoView manually because it's not in the repo).
I found the answer for your question: VideoView on top of SurfaceView The SurfaceView and the VideoView are both surface views and it was not supported to overlap these in old versions of Android but available since 2.0.
What you need to do:
hudWidget.getHolder().setFormat(PixelFormat.TRANSPARENT);
hudWidget.setZOrderMediaOverlay(true);
There is a pull request where you can try these. https://github.com/arthurbenemann/droidplanner/pull/247
The thread that brought the solution: https://groups.google.com/forum/?fromgroups#!msg/android-developers/nDNQcceRnYA/ps9wTBfXIyEJ
From the documentation on FrameLayout available here: Link
Child views are drawn in a stack, with the most recently added child on top
Add an id to the FrameLayout in 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 the video starts, do the following:
frameLayout.removeView(hudView);
frameLayout.addView(hudView);
make a Handler which 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;
}