Как поместить несколько видов текста и изображения в Android?

Question

Я хочу добиться следующего эффекта в своем приложении для Android:

В качестве фона я использую 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 до относительного макета, теперь я получаю следующий результат

Почему изображение из девяти пятен не масштабируется с текстом ??

Answer 1

В первом решении попробуйте добавить RelativeLayout, ширина которого равна fill_parent, и установить для вашего изображения ninePatch значение background, а затем добавить в него свой 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>

Answer 2

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

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 использует Ninepatch в качестве фона, чтобы он растягивался вместе с содержимым, Представление в середине растягивается, чтобы создать разрыв между text1 и text2.

Answer 4

использовать этот макет

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

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 >