Как правильно наложить виджеты пользовательского интерфейса поверх SurfaceView?

Question

У меня есть предварительный просмотр портретной камеры внутри RelativeLayout, кнопки и просмотра текста. Они есть, но не видны, они правильно реагируют на действия касания. Как настроить 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

просто поместите вид поверх SurfaceView:

<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 2

Образец SurfaceView Overlay в ApiDemos показывает, как это сделать. Ищите раздел «Наложение SurfaceView» здесь: http://developer.android.com/resources/samples/ApiDemos/src/com/example/android/apis/graphics/index.html

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 и, и накладывая их программно на метод onCreate моей деятельности.

Предположим, у вас есть XML с TextView с красивым прозрачным фоном, который вы хотите наложить поверх макета фрейма предварительного просмотра камеры, потому что почему бы и нет, это выглядит круто!:

<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 () { ... бла блааа ...

//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);

Это общий способ сделать это, если вам нужно больше деталей, дайте мне знать. Мне нужно уложиться в сроки, поэтому я использую первое решение, которое приходит мне в голову, иногда не самое элегантное или эффективное, если вы знаете лучший способ сделать это, пожалуйста, поделитесь им с нами!