是否可以在同一屏幕上拥有相机预览和 TextView？

Question

我想知道是否有某种方法可以让相机预览填充屏幕的一部分，并且在底部有一个文本视图框，我可以稍后在其中添加文本。 我还没有任何代码，因为在继续编写代码之前，我的团队仍在评估这是否可行。

编辑 2：现在我在玩了 android:gravity 之后终于可以在屏幕上看到文字了。但是TextView总是显示在屏幕的顶部，有什么办法可以把它移到底部吗？

编辑 3：将 android:layout_height 更改为 fill_parent 而不是 wrap_content 修复了定位问题

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
         android:layout_width="fill_parent"
         android:layout_height="fill_parent">
      <SurfaceView android:id="@+id/preview_view"
           android:layout_width="fill_parent"
           android:layout_height="fill_parent"
           android:layout_centerInParent="true"/>
      <com.google.zxing.client.android.ViewfinderView
           android:id="@+id/viewfinder_view"
           android:layout_width="fill_parent"
           android:layout_height="fill_parent"
           android:background="@color/transparent"/>
      ........
      ........
      <TextView android:layout_width="fill_parent"
           android:layout_height="fill_parent"
           android:gravity="bottom" 
           android:text="Header text"/>

</FrameLayout>

Answer 1

是的，这是可能的。您应该为此使用FrameLayout。这是一个例子：

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
             android:layout_width="fill_parent"
             android:layout_height="fill_parent">

  <SurfaceView android:id="@+id/preview_view"
               android:layout_width="fill_parent"
               android:layout_height="fill_parent"
               android:layout_centerInParent="true"/>

  <TextView android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:gravity="top|center_horizontal" 
            android:text="Header text"/>

</FrameLayout>

Answer 2

是的，可以这样：

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

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

<TextView
    android:id = "@+id/txtview"
    android:layout_width = "wrap_content"
    android:layout_height = "wrap_content"
    android:text = "TextView"
    android:padding = "7dp"
    android:gravity = "bottom" />

</FrameLayout>

Answer 3

感谢此线程上的帖子，这是一个使用简单 LinearLayout 的变体，它限制了相机显示的尺寸。

这减小了“扫描方块”的大小

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center_horizontal"
    android:background="@color/sea_blue_green_dark"
    android:orientation="vertical">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="30dp"
        android:padding="10dp"
        android:textColor="@color/white"
        android:textSize="28sp"
        android:text="Scan Code Now"/>

    <me.dm7.barcodescanner.zxing.ZXingScannerView
        android:id="@+id/scanner"
        android:layout_width="match_parent"
        android:layout_height="200dp"
        android:background="@color/white"/>

    <!--
    Add this view to prevent camera from taking up remaining vertical space

    Although seems to be better UX when user can still see camera outside of "Scanner Box Target". 
    Leaving here for reference
    -->
    <View
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#8BC34A"/>

</LinearLayout>

=======

这将生成以下布局，其中白色块成为相机区域：