Масштабировать фоновое изображение для обертывания содержимого макета

У меня есть макет, который содержит некоторые текстовые поля и имеет фоновое изображение, отображаемое в верхней части моей активности. Я хотел бы, чтобы фоновое изображение масштабировалось для обертывания содержимого (не важно, как его соотносить). Однако изображение больше содержимого, поэтому макет вместо этого обертывает фоновое изображение. Здесь мой оригинальный код:

<RelativeLayout 
    android:layout_width="fill_parent"
    android:id="@+id/HeaderList" 
    android:layout_gravity="top"
    android:layout_height="wrap_content" 
    android:background="@drawable/header">
    <TextView 
        android:layout_height="wrap_content"
        android:layout_width="wrap_content" 
        android:id="@+id/NameText"
        android:text="Jhn Doe" 
        android:textColor="#FFFFFF"
        android:textSize="30sp" 
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true" 
        android:paddingLeft="4dp"
        android:paddingTop="4dp" 
    />
    <TextView 
        android:layout_height="wrap_content"
        android:layout_width="wrap_content" 
        android:textColor="#FFFFFF"
        android:layout_alignParentLeft="true"
        android:id="@+id/HoursText"
        android:text="170 hours" 
        android:textSize="23sp"
        android:layout_below="@+id/NameText" 
        android:paddingLeft="4dp" 
    />
</RelativeLayout>

После поиска некоторых других вопросов я нашел следующие два:

Как обернуть просмотры контента, а не фоновые рисунки?

Масштабировать рисованное или фоновое изображение?

Основываясь на этом, я создал FrameLayout с ImageView, отображающим фон. К сожалению, я все еще не могу заставить его работать. Я хочу, чтобы высота фонового изображения уменьшалась/расширялась до размера текстовых представлений, но с помощью FrameLayout ImageView подходит к размеру его родительского элемента, и я не могу найти способ заставить родителя соответствовать размер макета текста. Здесь мой обновленный код:

<FrameLayout 
    android:layout_width="fill_parent"
    android:layout_height="wrap_content" >

    <ImageView android:src="@drawable/header"
        android:layout_width="fill_parent" 
        android:scaleType="fitXY"
        android:layout_height="fill_parent" 
        />
    <RelativeLayout 
        android:layout_width="fill_parent"
        android:id="@+id/HeaderList" 
        android:layout_gravity="top"
        android:layout_height="wrap_content"
        >
        <TextView 
            android:layout_height="wrap_content"
            android:layout_width="wrap_content" 
            android:id="@+id/NameText"
            android:text="John Doe" 
            android:textColor="#FFFFFF"
            android:textSize="30sp" 
            android:layout_alignParentLeft="true"
            android:layout_alignParentTop="true" 
            android:paddingLeft="4dp"
            android:paddingTop="4dp" 
            />
        <TextView 
            android:layout_height="wrap_content"
            android:layout_width="wrap_content" 
            android:textColor="#FFFFFF"
            android:layout_alignParentLeft="true" 
            android:id="@+id/HoursText"
            android:text="170 hours" 
            android:textSize="23sp"
            android:layout_below="@+id/NameText" 
            android:paddingLeft="4dp" 
            />
    </RelativeLayout>
</FrameLayout>

Есть ли у кого-нибудь какие-либо предложения о том, как лучше всего сделать масштаб изображения до размера содержимого какого-либо макета? Меня не интересует соотношение сторон изображения, так как это не имеет значения, я просто хочу, чтобы он заполнил фон.

Спасибо!

Ответ 1

У меня была такая же проблема (я думаю), и единственным решением, которое я смог найти, было следующее:

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    >

    <View
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/some_image"
        android:layout_alignTop="@+id/actual_content"
        android:layout_alignBottom="@id/actual_content"
        android:layout_alignLeft="@id/actual_content"
        android:layout_alignRight="@id/actual_content"
        />

    <LinearLayout
        android:id="@id/actual_content"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        >

       <!-- more stuff ... -->

    </LinearLayout>

</RelativeLayout>

Ответ 2

Вы можете попробовать этот трюк,

FrameLayout (wrapcontent, wrapcontent)
- ImageView (совпадение с родителем, совпадение с родителем)//его фон
- LinearLayout (wrapcontent, wrapcontent)
- - Все содержимое находится внутри этого линейного макета или любого другого типа, что бы вы хотели.

Ответ 3

Работа с RealtiveLayout (не обязательная, но вместо FrameLayout и использование андроида: scaleType = "fitXY". Переместите изображение в RealtiveLayout, которое содержит текстовые андроиды: id = "@+ id/HeaderList", и отключите фон android: background = "@drawable/header" на этом уровне.

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout 
         android:id="@+id/principal"
         android:layout_width="fill_parent"
         android:layout_height="fill_parent"
         android:background="@drawable/header" >

     <RelativeLayout 
         android:layout_width="fill_parent"
         android:id="@+id/HeaderList" 
         android:layout_gravity="top"
         android:layout_height="wrap_content" >  


         <ImageView
             android:id="@+id/backImg"
             android:layout_width="fill_parent"
             android:layout_height="fill_parent"
             android:layout_centerInParent="true"
             android:adjustViewBounds="true"
             android:background="@color/blancotransless"
             android:src="@drawable/header"
             android:scaleType="fitXY" >
         </ImageView>

             <TextView 
                 android:layout_height="wrap_content"
                 android:layout_width="wrap_content" 
                 android:id="@+id/NameText"
                 android:text="John Doe" 
                 android:textColor="#FFFFFF"
                 android:textSize="30sp" 
                 android:layout_alignParentLeft="true"
                 android:layout_alignParentTop="true" 
                 android:paddingLeft="4dp"
                 android:paddingTop="4dp" 
                 />
             <TextView 
                 android:layout_height="wrap_content"
                 android:layout_width="wrap_content" 
                 android:textColor="#FFFFFF"
                 android:layout_alignParentLeft="true" 
                 android:id="@+id/HoursText"
                 android:text="170 hours" 
                 android:textSize="23sp"
                 android:layout_below="@+id/NameText" 
                 android:paddingLeft="4dp" 
                 />
         </RelativeLayout> 
      </RelativeLayout>

Более или менее это должно сработать!

Ответ 4

Создайте гибкий xml, скажем, mybackground.xml

<?xml version="1.0" encoding="utf-8"?>
<bitmap xmlns:android="http://schemas.android.com/apk/res/android"
    android:src="@drawable/header"
    android:gravity="fill" />

Затем в вашем RelativeLayout в первом фрагменте кода используйте

android:background="@drawable/mybackground"

Ответ 5

Я думаю, что в прошлом я сделал что-то похожее на это, попробуйте сыграть с настройкой силы тяжести в вашем представлении изображения, я думаю, что один из них должен делать то, что вам нужно.

Ответ 6

Я не пробовал, но если вы установите фоновое изображение динамически на onCreate, который может работать. Размер макета должен быть уже установлен.

Ответ 7

Вы можете использовать это:

<ImageView
...
android:scaleType="fitXY"
>

Надеюсь, что это помогло)))

Ответ 8

Попробуйте этот код.....

<LinearLayout 
   android:layout_width="fill_parent"
   android:id="@+id/HeaderList" 
   android:orientation="vertical"
   android:layout_gravity="top"
   android:layout_height="wrap_content" 
   android:background="@drawable/header">
<TextView 
    android:layout_height="wrap_content"
    android:layout_width="wrap_content" 
    android:id="@+id/NameText"
    android:text="Jhn Doe" 
    android:textColor="#FFFFFF"
    android:textSize="30sp" 
    android:paddingLeft="4dp"
    android:paddingTop="4dp" 
/>
<TextView 
    android:layout_height="wrap_content"
    android:layout_width="wrap_content" 
    android:textColor="#FFFFFF"
    android:id="@+id/HoursText"
    android:text="170 hours" 
    android:textSize="23sp" 
    android:paddingLeft="4dp" 
/>
</LinearLayout>