如何在Android中将多个文本视图放置在图像视图上？

Question

我希望我的安卓应用程序能够实现以下效果： 我使用了一个九宫格png图片作为背景。我尝试过只使用一个文本视图来实现这个效果。

<ImageView
    android:id="@+id/myImageView"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@drawable/rowimage" />

<TextView
    android:id="@+id/myImageViewText"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignLeft="@+id/myImageView"
    android:layout_alignTop="@+id/myImageView"
    android:layout_alignRight="@+id/myImageView"
    android:layout_alignBottom="@+id/myImageView"
    android:layout_margin="1dp"
    android:gravity="center"
    android:text="Hello"
    android:textColor="#000000" />

但是这是我得到的结果。

任何想法出了什么问题？我怎样才能实现第一张图片的效果？

编辑：

我将我的xml更新为相对布局，现在我得到以下结果。

为什么九宫格图像不随文本缩放？

- DarkLeafyGreen

---

使用相对布局作为父视图。 - Pinki

你是否尝试将@drawable/rowimage作为布局的背景，然后将TextView放入此布局中： - Camille R

@ArtWorkAD，请显示指示您选择的布局的布局。 - Nikunj Patel

如果文本被整合到图像中，则使用NinePatch缩放。在您的情况下，有两种解决方案：添加RelativeLayout并将其设置为fill_parent宽度属性；或尝试使用NinePatch图像创建自定义TextViews。 - Houcine

我应该把相对布局放在哪里？ - DarkLeafyGreen

作为您的TextView的父布局，请参考我的答案，我将给出一个示例，这将有助于您。 - Houcine

Answer 1

第一个解决方案是添加一个宽度设置为“fill_parent”的RelativeLayout，将您的NinePatch图像设置为其背景，然后像这样将您的TextViews添加到其中：

<RelativeLayout 
  android:id="@+id/layoutTextViews"  
  android:layout_width="fill_parent"
  android:layout_height = "wrap_content"
  android:background="@drawable/rowimage" 
>

<TextView
    android:id="@+id/txtView1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentLeft="true"
    android:layout_margin="1dp"
    android:gravity="center"
    android:text="Hello"
    android:textColor="#000000" />

<TextView
    android:id="@+id/txtView2"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentRight="true"
    android:layout_margin="1dp"
    android:gravity="center"
    android:text="Right"
    android:textColor="#000000" />

</RelativeLayout>

- Houcine

---

完美，谢谢，但它必须是layout_alignParentRight/left，你忘记了layout_前缀。 - DarkLeafyGreen

是的，我知道，因为我刚刚在Eclipse中编写了它而没有测试它。很高兴听到这个 :)。 - Houcine

Answer 2

使用这个布局

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:orientation="vertical"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent">
    <ImageView android:src="@drawable/icon" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_alignParentTop="true"/>
    <LinearLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_alignParentTop="true">
    <TextView android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="Left Text" android:layout_weight="1.0" />
    <TextView android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="Right Text" android:layout_weight="1.0" />
    </LinearLayout>
</RelativeLayout>

- Vishal Pawar

Answer 3

已经有答案发布了，但这是我会做的方式：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:gravity="center_vertical"
    android:padding="1dp"
    android:background="@drawable/tile">
    <TextView
        style="@style/textstyle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello1"/>
    <View 
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_weight="1"/>
    <TextView
        style="@style/textstyle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello2"/>
</LinearLayout>

LinearLayout使用九宫格作为背景，以便随着内容进行拉伸，中间的视图会被拉伸以创建文本1和文本2之间的间隙。

- Jave

Answer 4

          <?xml version="1.0" encoding="utf-8"?>

          <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
             android:orientation="horizontal" 
             android:layout_width="fill_parent"
             android:layout_height="50dp"
             android:background="@drawable/your background image">


        <LinearLayout 
            android:layout_height="fill_parent"
            android:layout_width="fill_parent" 
            android:layout_weight="1"
            android:gravity="center" 
            android:orientation="vertical">

            <TextView 
                android:layout_width="wrap_content"
                android:layout_height="wrap_content" 
                android:textColor="@color/white"
                android:textSize="18sp" 
                android:textStyle="bold"
                android:singleLine="true" 
                android:text="Subject1"/>
            <TextView 
                android:layout_width="wrap_content"
                android:layout_height="wrap_content" 
                android:textColor="@color/white"
                android:textSize="18sp" 
                android:textStyle="bold"
                android:singleLine="true" 
                android:text="Subject2"/>
             <TextView 
                android:layout_width="wrap_content"
                android:layout_height="wrap_content" 
                android:textColor="@color/white"
                android:textSize="18sp" 
                android:textStyle="bold"
                android:singleLine="true" 
                android:text="Subject3"/>

        </LinearLayout>

    </LinearLayout>

- selvaiyyamperumal

Answer 5

<RelativeLayout
 xmlns:android="http://schemas.android.com/apk/res/android"
 android:orientation="vertical"
 android:layout_width="fill_parent"
 android:layout_height="fill_parent">

<ImageView android:src="@drawable/icon" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_alignParentTop="true"/>
<LinearLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_alignParentTop="true">
<TextView android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="Left Text" android:layout_weight="1.0" />
<TextView android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="Right Text" android:layout_weight="1.0" />

</Linear Layout >

- Ranjit Mishra