About change background image for .mp3 karaoke

[huyvip0312]

I use VLC beta for android with play .mp3 + g karaoke file. I try to change background of SurfaceView with android:id="@+id/player_surface" (in player.xml layout) but background image show superimposed on lyrics text of .cdg files (see screenshot http://i44.photobucket.com/albums/f27/h ... 1406693625). I want to background image show underside lyrics text of .cdg files. What can I do? Please help me implement it.
Thanks all!

[edwardw]

Try using a FrameLayout to overlay the SurfaceView over the ImageView; see http://stackoverflow.com/questions/2268 ... ther-views or something.

[huyvip0312]

Try using a FrameLayout to overlay the SurfaceView over the ImageView; see http://stackoverflow.com/questions/2268 ... ther-views or something.

I try using a ImageView in FrameLayout, code player.xml like:

...
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="false" >

<ImageView
android:id="@+id/img_test"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:background="@drawable/cone"/>

<FrameLayout
android:id="@+id/player_surface_frame"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:foregroundGravity="clip_horizontal|clip_vertical" >

<SurfaceView
android:id="@+id/player_surface"
android:layout_width="1dp"
android:layout_height="1dp"
/>

<SurfaceView
android:id="@+id/subtitles_surface"
android:layout_width="1dp"
android:layout_height="1dp"
android:visibility="invisible"
/>
</FrameLayout>
</FrameLayout>
...

But underside lyrics text still filling black background (see http://i44.photobucket.com/albums/f27/h ... 5a9fe1.png and http://i44.photobucket.com/albums/f27/h ... 0d4c5c.png). Please help me to remove black background. Thank all!

[edwardw]

Try searching on StackOverflow or Google on how to use FrameLayout.

[huyvip0312]

Try searching on StackOverflow or Google on how to use FrameLayout.

I understand about use FrameLayout. When I use:
...
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="false"
android:background="#ffffff" >

<FrameLayout
android:id="@+id/player_surface_frame"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:foregroundGravity="clip_horizontal|clip_vertical" >



<SurfaceView
android:id="@+id/player_surface"
android:layout_width="800dp"
android:layout_height="400dp"
/>
<ImageView
android:id="@+id/img_test"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="fitCenter"
android:layout_gravity="center"
android:background="@drawable/cone"/>

<SurfaceView
android:id="@+id/subtitles_surface"
android:layout_width="1dp"
android:layout_height="1dp"
android:visibility="invisible"
/>

</FrameLayout>
</FrameLayout>
...

then UI see like: http://i44.photobucket.com/albums/f27/h ... a40036.png and if i use:
...
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="false"
android:background="#ffffff" >

<FrameLayout
android:id="@+id/player_surface_frame"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:foregroundGravity="clip_horizontal|clip_vertical" >

<FrameLayout
android:id="@+id/player_surfa"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:foregroundGravity="clip_horizontal|clip_vertical" >
<ImageView
android:id="@+id/img_test"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="fitCenter"
android:layout_gravity="center"
android:background="@drawable/cone"/>
</FrameLayout>

<SurfaceView
android:id="@+id/player_surface"
android:layout_width="800dp"
android:layout_height="400dp"
/>


<SurfaceView
android:id="@+id/subtitles_surface"
android:layout_width="1dp"
android:layout_height="1dp"
android:visibility="invisible"
/>

</FrameLayout>
</FrameLayout>
...

then UI see like http://i44.photobucket.com/albums/f27/h ... 84fac7.png. My problem is VLC always paint black background underside lyrics text show as default. I don't know where draw black background and where assign UI (video or .mp3 + g playing) for surfaceview. Can you help me? Thanks!