如何在SurfaceView上正确覆盖UI小部件？

Question

我在RelativeLayout，按钮和textview中有一个肖像相机预览。他们在那里，但不可见，他们对触摸动作做出正确反应。如何设置Z顺序或优先级？这是我的main.xml：

<?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"
>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+layout/frame"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">

<SurfaceView android:id="@+id/surface" android:layout_width="fill_parent" android:layout_height="fill_parent"></SurfaceView>
<Button android:layout_height="wrap_content" android:layout_width="match_parent" android:onClick="hablar" android:text="Button" android:id="@+id/button1"></Button>
<EditText android:layout_height="wrap_content" android:layout_width="match_parent" android:text="EditText" android:id="@+id/edita"></EditText>
</RelativeLayout>
</FrameLayout>

Answer 1

ApiDemos中的SurfaceView Overlay示例显示了如何执行此操作。在这里查找“SurfaceView Overlay”部分：http://developer.android.com/resources/samples/ApiDemos/src/com/example/android/apis/graphics/index.html

Answer 2

只需在SurfaceView上放置一个View：

<FrameLayout
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="1">

    <SurfaceView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

    <View
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="lalalalala" />
</FrameLayout>

Answer 3

嗯，我让它在FrameLayout中工作，其中SurfaceView是一个ZoomControl的兄弟。也就是说，这个结构对我有用：

<?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" >

    <SurfaceView
        android:id="@+id/surface"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" />

    <ZoomControls
        android:id="@+id/zoom"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|center_horizontal"
        />
</FrameLayout>

也许RelativeLayout打破了它？

Answer 4

答案根本不直观，但我发现了如何做到这一点。与线性布局不同，声明顺序不会在相对布局中定义Z顺序。通过在XML中声明两个视图，然后以编程方式将它们覆盖在我的Activity的onCreate方法上，我能够在Camera Preview上覆盖textview。

假设您有一个带有TextView的XML，它具有漂亮的透明背景，您想要覆盖在Camera Preview框架布局上，因为为什么不呢？，它看起来很酷！：

<RelativeLayout>
      <TextView
        android:id="@+id/txtnombotiga"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Ola ke ase"
        android:textColor="#000000"
        android:textSize="16sp"    
        android:background="#55ffffff" 
       />
  <FrameLayout
      android:id="@+id/cameraPreview"
      android:layout_width="match_parent"
      android:layout_height="240dp">     
  </FrameLayout>
</RelativeLayout>

如果这样，相机将覆盖你的文字，无论如何:(解决它，让我们去编程，并：1）从其父布局分离TextView 2）将其附加到相机的框架布局后首先连接相机。

继承人的代码

OnCreate（）{... blaa blaaa ...

//Create camera instance and reference to our frame Layout
mPreview = new CameraPreview(this, mCamera, previewCb, autoFocusCB);        
FrameLayout preview = (FrameLayout) findViewById(R.id.cameraPreview);
//Add camera to the Frame Layout
preview.addView(mPreview);
//Get reference to the TextView you want to overlay and type something funny
TextView txt=(TextView)findViewById(R.id.txtnombotiga);     
txt.setText("ola keee aseee!");
//1) Step 1, here comes the magic! dettach the textView from its original Layout
((ViewGroup)txt.getParent()).removeView(txt);
//1) Step 2, voila! attach it to the View, order matters here so it will appear on 
//top of the camera!
preview.addView(txt);

这是一般的方法，如果您需要更多细节，请告诉我。我需要在工作中遇到最后期限，所以我使用了我想到的第一个解决方案，有时候不是最优雅或最有效的，如果你知道更好的方法，请与我们分享！