Размещение текстового поля поверх изображения в андроиде
- У меня есть
listview
, у которого есть один imageview
, который
прокручиваемое вертикально
- Я пытаюсь разместить
textview
поверх imageview
- Оба вида должны быть видны
- Возможно ли это?
- Если да, как это сделать программно?
- Какие изменения мне нужно сделать?
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>
Он выводит результат, как показано ниже
![enter image description here]()
Как сделать что-то вроде ниже
![enter image description here]()
примечание:: Блюдо 1 и 2 - это текстовые изображения
Ответы
Ответ 1
Это должно предоставить требуемый макет:
<?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>
Играйте с android:layout_marginTop="20dp"
, чтобы узнать, какой из них вам подходит. Используйте id textview
для динамического задания значения android:text
.
Так как RealactiveLayout ставит свои дочерние элементы, определение TextView после ImageView ставит его поверх ImageView.
ПРИМЕЧАНИЕ. Аналогичные результаты могут быть достигнуты с помощью FrameLayout
в качестве родителя, а также с коэффициентом усиления эффективности с использованием любого другого контейнера для Android. Благодаря Igor Ganapolsky
(см. Комментарий ниже), указав, что для этого ответа требуется обновление.
Ответ 2
Попробуйте следующее:
<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"
/>
Надеюсь, это поможет вам.
Ответ 3
вы можете использовать framelayout, чтобы достичь этого.
как использовать 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
Ответ 4
просто перетащите TextView поверх ImageView в 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>
И это выводит выше xml ![enter image description here]()
Ответ 5
Как вы упомянули в OP, вам необходимо программно овертеть Text
на ImageView
. Вы можете вытащить ImageView
и записать на нем с помощью наложения на Canvas
и 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);
}
Ответ 6
вы тоже можете попробовать. Я использую только 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>
Ответ 7
Возможно, вам стоит просто написать ImageView сначала и TextView второй.
Иногда это может помочь. Это просто, но я надеюсь, что это поможет кому-то.:)