para - manual de programacion android pdf

Colocar una vista de texto encima de la vista de imagen en Android

Question

• Tengo una vista de lista, que tiene una vista de imagen única que se puede desplazar verticalmente
• Estoy tratando de colocar una textview de textview sobre Imageview
• Ambas vistas deben ser visibles.

1. Es posible ?
2. En caso afirmativo, ¿cómo hacerlo programáticamente?
3. ¿Qué cambios debo hacer?

list_view_item_for_images.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<ImageView
android:id="@+id/flag"
android:layout_width="fill_parent"
android:layout_height="250dp"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:scaleType="fitXY"
android:src="@drawable/ic_launcher" />
</RelativeLayout>

Da una salida como la de abajo.

Cómo hacer algo como abajo

nota :: Plato 1 y 2 son vistas de texto

Answer 1

Como mencionó en OP, necesita superponer Text en ImageView manera programática. Puede obtener ImageView drawable y escribir en él con la ayuda de ponerlo en Canvas and Paint .

 private BitmapDrawable writeTextOnDrawable(int drawableId, String text)
{
Bitmap bm = BitmapFactory.decodeResource(getResources(), drawableId).copy(Bitmap.Config.ARGB_8888, true);
Typeface tf = Typeface.create("Helvetica", Typeface.BOLD);
Paint paint = new Paint();
paint.setStyle(Style.FILL);
paint.setColor(Color.WHITE);
paint.setTypeface(tf);
paint.setTextAlign(Align.CENTER);
paint.setTextSize(11);
Rect textRect = new Rect();
paint.getTextBounds(text, 0, text.length(), textRect);
Canvas canvas = new Canvas(bm);
canvas.drawText(text, xPos, yPos, paint);
return new BitmapDrawable(getResources(), bm);
}

Answer 2

Esto debería darle el diseño requerido:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<ImageView
android:id="@+id/flag"
android:layout_width="fill_parent"
android:layout_height="250dp"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:scaleType="fitXY"
android:src="@drawable/ic_launcher" />
<TextView
android:id="@+id/textview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_marginTop="20dp"
android:layout_centerHorizontal="true" />
</RelativeLayout>

Juega con el android:layout_marginTop="20dp" para ver cuál se adapta mejor a ti. Utilice la vista de texto id para establecer dinámicamente el valor de android:text .

Dado que un RelativeLayout apila a sus hijos, la definición de TextView después de que ImageView lo pone sobre la ImageView.

NOTA: Se pueden obtener resultados similares utilizando un FrameLayout como padre, junto con la ganancia de eficiencia sobre el uso de cualquier otro contenedor de Android. Gracias a Igor Ganapolsky (ver comentario más abajo) por señalar que esta respuesta necesita una actualización.

Answer 3

Prueba esto:

<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/rel_layout"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<ImageView
android:id="@+id/ImageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src=//source of image />
<TextView
android:id="@+id/ImageViewText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="@id/ImageView"
android:layout_alignTop="@id/ImageView"
android:layout_alignRight="@id/ImageView"
android:layout_alignBottom="@id/ImageView"
android:text=//u r text here
android:gravity="center"
/>

Espero que esto pueda ayudarte.

Answer 4

Puedes usar framelayout para lograr esto.

cómo usar framelayout

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ImageView
android:src="@drawable/ic_launcher"
android:scaleType="fitCenter"
android:layout_height="250px"
android:layout_width="250px"/>
<TextView
android:text="Frame Demo"
android:textSize="30px"
android:textStyle="bold"
android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:gravity="center"/>
</FrameLayout>

ref: tutorialspoint

Answer 5

Quizás deberías escribir primero el ImageView y luego el TextView. Eso puede ayudar a veces. Eso es simple pero espero que ayude a alguien. :)

Answer 6

También puedes probar esto. Yo uso sólo framelayout.

 <FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/cover"
android:gravity="bottom">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Hello !"
android:id="@+id/welcomeTV"
android:textColor="@color/textColor"
android:layout_gravity="left|bottom" />
</FrameLayout>

Answer 7

simplemente arrastre y suelte el TextView sobre ImageView en eclipse

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context=".MainActivity" >
<ImageView
android:id="@+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="48dp"
android:layout_marginTop="114dp"
android:src="@drawable/bluehills" />
<TextView
android:id="@+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="@+id/imageView1"
android:layout_centerVertical="true"
android:layout_marginLeft="85dp"
android:text="TextView" />
</RelativeLayout>

Y esta la salida del anterior xml.