簡體   English   中英

在android中的imageview之上放置一個textview

[英]Placing a textview on top of imageview in android

  • 我有一個listview ,它有一個可垂直滾動的imageview listview
  • 我正在嘗試在Imageview之上放置一個textview
  • 兩個視圖都必須可見

  1. 有可能嗎?
  2. 如果是,如何以編程方式進行?
  3. 我需要做哪些改變?

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>

它提供如下輸出

在此處輸入圖片說明

如何做類似下面的事情

在此處輸入圖片說明

注意 :: 菜 1 和 2 是文本視圖

這應該為您提供所需的布局:

<?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值。

由於RelativeLayout 堆疊其子項,因此在ImageView 將其置於ImageView 之上之后定義TextView。

注意:使用FrameLayout作為父級可以獲得類似的結果,並且比使用任何其他 android 容器效率更高。 感謝Igor Ganapolsky (見下面的評論)指出這個答案需要更新。

試試這個:

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

希望這可以幫助你。

您可以使用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>

參考: 教程點

正如您在 OP 中提到的,您需要以編程方式在ImageView上疊加Text 您可以獲得ImageView drawable 並在將其放在CanvasPaint上的幫助下進行書寫。

 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);
 }

只需將 TextView 拖放到 Eclipse 中的 ImageView 上

<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的輸出在此處輸入圖片說明

你也可以試試這個。 我只使用框架布局。

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

您必須確保將ImageView放在FrameLayoutTextView上。 這很簡單,但我希望它可以幫助某人。 :)

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM