How to put caption in an ImageView

8

I would like to know if it is possible to put caption in a ImageView similar to the image below, if possible an explanation or study material.

    
asked by anonymous 25.04.2014 / 14:56

3 answers

7

There are several ways to accomplish this. Here are two:

1 - Draw all elements (image and footer) manually on the canvas, extending the ImageView class and overwriting its onDraw () method

public class ImagemComRodape extends ImageView {
    ...
    @Override
    protected void onDraw(Canvas canvas) {
        //deixa a classe ImageView desenhar a imagem normalmente
        super.onDraw(canvas);

        //desenha o rodapé (que aparecerá em cima da imagem)
        canvas.drawRect(...);
        canvas.drawText(...);
    }
}

2- Instead of using an ImageView, you can create a RelativeLayout, assign the image as the background of that RelativeLayout, set the width and height of the RelativeLayout as desired, and finally add a TextView (with the text from its caption) to the RelativeLayout, aligning it to the bottom of the RelativeLayout.

In my applications I use the first solution, because it involves fewer views.

    
25.04.2014 / 15:12
2

One way to do this is to place the image as the background of a layout and within that layout a textView. It would look like this:

   <LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@drawable/ic_launcher"
    android:gravity="bottom"
    android:orientation="vertical" >

    <TextView
        android:id="@+id/textView1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        android:text="TextView" />

</LinearLayout>

From this you can adjust a background in the text to be similar to the transparency of the image you have placed.

    
25.04.2014 / 15:30
1

Following the tip that @Wakim has put to me on this question , you can do this:

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ImageView
        android:id="@+id/image"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <TextView
        android:id="@+id/name"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        android:text="Legenda da imagem"
        android:textColor="@color/white"
        android:ellipsize="end"
        android:lines="2"
        android:gravity="center_vertical"
        android:fontFamily="sans-serif-light"
        android:background="#99000000" />
</FrameLayout>
    
10.05.2014 / 03:50