Question

我浪费了整个周末试图做本应该是一项非常简单的任务。我只想要一个ImageView和两个EditText元素覆盖它 - 一个在顶部居中，一个在底部（像字幕一样）。当编辑任一框中的文本时，它应该在到达图像末尾时换行（标题不应该溢出图像本身）。我发现了一百万个例子，但每个例子都在根视图上设置android:layout_width="fill_parent"意味着图像绝对必须完全适合视图（这是恕我直言，这是一个荒谬的假设），否则标题将出现在图像之外。在我的情况下，由于动态选择图像，我不知道图像的大小。

这是我到目前为止所做的：

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

    <ImageView
        android:id="@+id/selectedImage"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"

        android:scaleType="center" />

    <EditText
        android:id="@+id/caption_top"

        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal|top"

        android:text="Top caption" />

    <EditText
        android:id="@+id/caption_bottom"

        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal|bottom"

        android:text="Bottom caption" />

</FrameLayout>

正如预期的那样，这会显示屏幕顶部和底部的标题，而不是ImageView。我已经尝试动态调整FrameLayout的大小：

final View frame = findViewById(R.id.frame);
        frame.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
            @Override
            public void onGlobalLayout() {
                frame.getLayoutParams().width = editedImage.getWidth();
                frame.getLayoutParams().height = editedImage.getHeight();
                frame.requestLayout();
            }
        });

这会强制字幕到图像的内部，但会破坏很多其他的东西（没有元素再次居中）并且不知何故输入的文本仍然不会换行，即使它设置为fill_parent并且设置了父级的宽度明确地匹配图像...

Answer 1

尝试将ImageView和两个TextView放在RelativeLayout中（基本上是您现在拥有的XML结构，但<FrameLayout>元素已更改为<RelativeLayout>）。

RelativeLayout：
- android:layout_gravity center_horizontal。
ImageView：
顶部TextView：
- android:layout_width 0dp
- android:layout_height WRAP_CONTENT
- android:layout_alignTop @id/selectedImage
- android:layout_alignLeft @id/selectedImage
- android:layout_alignRight @id/selectedImage
- android:gravity center_horizontal|top
底部TextView与顶部TextView相同，除了对齐和重力图像底部。
删除ViewTreeObserver。

您可能必须将整个事物放在FrameLayout中以使RelativeLayout水平居中。

在包含文本的图像上覆盖顶部和底部可编辑标题

1 个答案: