Android. Transparent Layout over another layout

Question

I am developing video player and I need to display SeekBar, current time text view, video length text view over my video view. I also need tho put the into any Layout with transparent background. I have read some topics here, in Stackoverflow, but they did not help in solving my problem. Can anyone help me please! Thank You ver much! Here is my xml layout for videoplayer.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:tools="http://schemas.android.com/tools"
  android:id="@+id/video_main_container"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent" >
 <!-- This is Layout that must be in the top of my video view --->
<LinearLayout
    android:id="@+id/streams"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentLeft="true"
    android:layout_alignParentRight="true"
    android:layout_alignParentTop="true"
    android:background="#40ffffff"
    android:orientation="horizontal"
    android:visibility="gone" >

    <Spinner
        android:id="@+id/language_spinner"
        android:layout_width="0dip"
        android:layout_height="wrap_content"
        android:layout_weight="1" />

    <Spinner
        android:id="@+id/subtitle_spinner"
        android:layout_width="0dip"
        android:layout_height="wrap_content"
        android:layout_weight="1" />

    <ImageView
        android:id="@+id/full_screen"
        android:layout_width="20dp"
        android:layout_height="20dp"
        android:layout_weight="1"
        android:src="@drawable/logo_fullscreen" />

</LinearLayout>
<!-- This is layout with seekbar and text views with current time, video file length -->
<!-- I need to show it on the bottom of my video view -->
<RelativeLayout
    android:id="@+id/controls"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:layout_alignParentLeft="true"
    android:layout_alignParentRight="true"
    android:backgroundDimEnabled="true"
    android:background="#00ffffff"
    >

    <Button
        android:id="@+id/play_pause"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@android:drawable/ic_media_play"
        android:contentDescription="@null"
        android:enabled="false" />

    <Button
        android:id="@+id/scale_type"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_toRightOf="@+id/play_pause"
        android:background="@android:drawable/ic_menu_info_details"
        android:enabled="true" />

    <SeekBar
        android:id="@+id/seek_bar"
        android:alpha="0.5"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_centerVertical="true"
        android:layout_toRightOf="@+id/scale_type" />

    <TextView
        android:layout_margin="3dp"
        android:id="@+id/current_time_text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/seek_bar"
        android:layout_alignLeft="@+id/seek_bar"
        android:text="" />

    <TextView
        android:layout_margin="3dp"
        android:id="@+id/video_length_text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/seek_bar"
        android:layout_alignRight="@+id/seek_bar"
        android:text="" />

</RelativeLayout>
    <!-- This is my VideoView, all controls I must display over it --->
<com.ffmpeg.FFmpegSurfaceView
    android:id="@+id/video_view"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:layout_above="@+id/controls"
    android:layout_below="@+id/streams"
    android:visibility="visible" />
</RelativeLayout>

Answer 1

You are implementing your video view after implementing all other things. You should first add your videoView and then SeekBar on it if you are using RelativeLayout.

something like below :

<LinearLayout
    android:id="@+id/streams"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentLeft="true"
    android:layout_alignParentRight="true"
    android:layout_alignParentTop="true"
    android:background="#40ffffff"
    android:orientation="horizontal"
    android:visibility="gone" >

    <Spinner
        android:id="@+id/language_spinner"
        android:layout_width="0dip"
        android:layout_height="wrap_content"
        android:layout_weight="1" />

    <Spinner
        android:id="@+id/subtitle_spinner"
        android:layout_width="0dip"
        android:layout_height="wrap_content"
        android:layout_weight="1" />

    <ImageView
        android:id="@+id/full_screen"
        android:layout_width="20dp"
        android:layout_height="20dp"
        android:layout_weight="1"
        android:src="@drawable/logo_fullscreen" />
</LinearLayout>
<!-- This is layout with seekbar and text views with current time, video file length -->
<!-- I need to show it on the bottom of my video view -->

<com.ffmpeg.FFmpegSurfaceView

    android:layout_below="@+id/streams"
    android:id="@+id/video_view"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:visibility="visible" />

<RelativeLayout
    android:id="@+id/controls"
    android:layout_width="match_parent"
    android:layout_height="50dp"
    android:layout_alignParentBottom="true"
    android:background="#33000000" >

    <Button
        android:id="@+id/play_pause"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"
        android:background="@android:drawable/ic_media_play"
        android:contentDescription="@null"
        android:enabled="false" />

    <Button
        android:id="@+id/scale_type"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"
        android:layout_toRightOf="@+id/play_pause"
        android:background="@android:drawable/ic_menu_info_details"
        android:enabled="true" />

    <SeekBar
        android:id="@+id/seek_bar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_centerVertical="true"
        android:layout_toRightOf="@+id/scale_type"
        android:alpha="0.5" />

    <TextView
        android:id="@+id/current_time_text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/seek_bar"
        android:layout_below="@+id/seek_bar"
        android:layout_margin="3dp"
        android:text="" />

    <TextView
        android:id="@+id/video_length_text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignRight="@+id/seek_bar"
        android:layout_below="@+id/seek_bar"
        android:layout_margin="3dp"
        android:text="" />
</RelativeLayout>
<!-- This is my VideoView, all controls I must display over it - -->

Answer 2

Create a new style inside your styles.xml. like:

    <style name="Theme.Transparent" parent="android:Theme">
    <item name="android:windowIsTranslucent">true</item>
    <item name="android:windowBackground">@android:color/transparent</item>
    <item name="android:windowContentOverlay">@null</item>
    <item name="android:windowNoTitle">true</item>
    <item name="android:windowIsFloating">true</item>
    <item name="android:backgroundDimEnabled">false</item>
</style>

And use it as your activity theme in manifest.somethinh like:

        <activity
        android:name="...."
        android:label="@string/app_name"
        android:theme="@style/Theme.Transparent" 
       ......

Answer 3

Not sure what the actual problem is here, but if you expect those controls to be on top of the FFmpegSurfaceView (in Z-order), they should occur after it in that layout file.