Layout design: SurfaceView doesn't display

Question

I have built a layout that can display a picture on three different areas. It didn't matter when I used an imageview but somehow it does not work with a surfaceview. There are basically three areas like below, and the third area(or area no.3) is where I want to put a picture through surfaceview

http://imageshack.us/m/202/3189/000hjb.jpg

A picture made by SurfaceView could be displayed on the area no.1, but not on 2 and 3 like below.

http://img215.imageshack.us/img215/9891/111lcv.jpg

Below is a screenshot that I tried with an imageview, and they had no problem.

http://imageshack.us/m/199/7231/222mlr.jpg

I have no idea to figure out. What I want to do is putting a picture made by SurfaceView on area 2 and 3 whose id is tableRow_cardImage - TableRow - and assistant_cardboard - LinearLayout.

If anyone has an idea to figure out this, would you please help me?

Thanks in advance and below is my xml code of layout

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    >
<LinearLayout android:id="@+id/header" android:layout_height="wrap_content" android:layout_width="match_parent">
    <TextView android:id="@+id/header_life_title" android:textSize="20sp" android:text="Life: " android:layout_height="wrap_content" android:layout_width="wrap_content"></TextView>
    <TextView android:id="@+id/header_life_value" android:textSize="20sp" android:text="20" android:layout_height="wrap_content" android:layout_width="wrap_content"></TextView>
    <Button android:text="Inc." android:id="@+id/header_btn_inc" android:layout_width="wrap_content" android:layout_height="35dp" android:layout_gravity="center_vertical">
    <Button android:text="Dec." android:id="@+id/header_btn_dec" android:layout_width="wrap_content" android:layout_height="35dp">
    <Button android:text="Put L." android:id="@+id/header_btn_putLand" android:layout_width="wrap_content" android:layout_height="35dp">
    <Button android:text="Remove L." android:id="@+id/header_btn_removeLand" android:layout_width="wrap_content" android:layout_height="35sp">
    <LinearLayout android:layout_width="wrap_content" android:layout_height="match_parent" android:id="@+id/land_space">
    </LinearLayout>
</LinearLayout>
    <ScrollView android:id="@+id/scrollView1" android:layout_height="wrap_content" android:layout_width="match_parent">
        <LinearLayout android:id="@+id/linearLayoutInScrollview"
            android:orientation="horizontal" 
            android:layout_height="wrap_content"
            android:layout_width="wrap_content">
            <TableLayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/cardboard">
                <LinearLayout android:layout_height="40dp"
                    android:layout_width="wrap_content" android:id="@+id/layout_menu">
                    <Spinner android:id="@+id/spinner_creature"
                        android:layout_height="wrap_content" 
                        android:layout_width="130dp">
                    <Button android:id="@+id/btn_creature"
                        android:layout_height="wrap_content" 
                        android:layout_width="wrap_content" android:text="Cast">
                    <Spinner android:id="@+id/spinner_noncreature"
                        android:layout_height="wrap_content" 
                        android:layout_width="130dp">
                    <Button android:id="@+id/btn_noncreature"
                        android:layout_height="wrap_content" 
                        android:layout_width="wrap_content" android:text="Cast">
                    <Button android:id="@+id/btn_delete"
                        android:layout_height="wrap_content" 
                        android:layout_width="wrap_content" android:text="Del."></Button>
                </LinearLayout>

                <TableRow android:layout_height="wrap_content" android:layout_width="wrap_content" android:id="@+id/tableRow_cardImage">
                <TableRow android:layout_height="wrap_content" android:layout_width="wrap_content" android:id="@+id/tableRow_cardData">
                <TableRow android:layout_height="wrap_content" android:layout_width="wrap_content" android:id="@+id/tableRow_cardImage2">
                <TableRow android:layout_height="wrap_content" android:layout_width="wrap_content" android:id="@+id/tableRow_cardData2">
            </TableLayout>
            <LinearLayout android:layout_height="wrap_content" android:layout_width="wrap_content"
                android:id="@+id/assistant_cardboard"
                android:orientation="vertical" >
                <ImageView android:src="@drawable/icon" android:layout_height="wrap_content" android:id="@+id/imageView1" android:layout_width="wrap_content"></ImageView>
            </LinearLayout>
        </LinearLayout>
    </ScrollView>
</LinearLayout>

Answer 1

While I was working on it, I think this is the problem of using SurfaceView with ScrollView. Since SurfaceView is a view that can even draw the entire screen(or over the screen), I think android doesn't want to have it in the inside of ScrollView.

Answer 2

You are correct, a SurfaceView is not meant to be placed inside a ScrollView. This confirms and this gives you more advice on what you can do instead.