Question

The app I am developing have a background image which I would like to have scaling to the different device sizes, most important it should fit the width. The background fades into black, so I can have a permanent black background on the main view and that looks just fine.

I have made a background.xml file, and at the moment I have only the xlarge background image of 800×1280 px graphic in the res folder. When I run my app on a AVD with the settings of the Samsung Galaxy S3 the background width do not fill the entire screen, yet the rest of the controls scales just fine to the screen.

This is the start of my view:

<ScrollView android:id="@+id/MainScrollView"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:background="#000000" 
    android:orientation="vertical"
    android:fillViewport="true">

<LinearLayout
    android:id="@+id/lineLayout1"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content" android:background="@drawable/background"
    android:orientation="vertical"> 

My background.xml looks like this:

<bitmap xmlns:android="http://schemas.android.com/apk/res/android" 
android:src="@drawable/mainappbg" 
android:gravity="top|left" android:filter="true" android:dither="true" />

Hope someone can help.

Thanks

I have tried this, there is an image inserted as background but only the TasksButton and ServiceRapportButton are visible, the rest of the content disapears.

<ScrollView android:id="@+id/MainScrollView"
android:layout_width="fill_parent"
android:layout_height="fill_parent" 
xmlns:android="http://schemas.android.com/apk/res/android" 
android:background="#000000" 
android:orientation="vertical"
android:fillViewport="true">

<RelativeLayout 
   android:layout_width="fill_parent" 
   android:layout_height="fill_parent">
  <ImageView 
      android:id="@+id/imageView1" 
      android:layout_width="fill_parent" 
      android:layout_height="fill_parent" 
      android:src="@drawable/mainappbg"/>

<LinearLayout
android:id="@+id/lineLayout1"
android:layout_width="fill_parent"
android:layout_height="fill_parent">

<RelativeLayout
    android:id="@+id/RelativeLayout1"
    android:layout_width="fill_parent"
     android:layout_height="85dp">
   <Button android:id="@+id/TasksButton" android:layout_width="wrap_content"      android:layout_height="wrap_content" android:layout_alignParentRight="true" android:layout_alignParentTop="true" android:layout_marginRight="5dp" android:layout_marginTop="5dp" android:background="@drawable/opgaver" android:onClick="TasksClickHandler" android:textSize="12sp"/>
   <Button android:id="@+id/ServiceRapportButton" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentRight="true" android:layout_alignParentTop="true" android:layout_marginRight="15dp" android:layout_marginTop="40dp" android:background="@drawable/rapport" android:onClick="ServiceRapportClickHandler" android:textSize="12sp"/>       
</RelativeLayout>
<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:id="@+id/tableLayout1">
      <Button android:id="@+id/LineButton" android:layout_weight="1" android:layout_width="0dp" android:layout_height="match_parent" android:background="@drawable/lines" android:onClick="LineClickHandler" android:textSize="12dp"/>        
      <Button android:id="@+id/ServiceButton" android:layout_weight="1" android:layout_width="0dp" android:layout_height="match_parent" android:background="@drawable/service" android:textSize="12dp" android:onClick="ServiceClickHandler"></Button>
      <Button android:id="@+id/NavigationButton" android:layout_weight="1" android:layout_width="0dp" android:layout_height="match_parent" android:background="@drawable/navigate" android:textSize="12dp" android:onClick="NavigateClickHandler"></Button>         
</LinearLayout>

Edit, added screenshot, I want to place a background behind these controls:

Answer 1

If the only purpose of LinearLayout (@id/lineLayout1) is to serve as bg container, then replace it with ImageView set android:scaleType to match scaling results you want to achieve.

EDIT

Wrap it in RelativeLayout layout and put ImageView as BG container:

<ScrollView
   xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/MainScrollView"
   android:layout_width="fill_parent"
   android:layout_height="fill_parent" 
   android:background="#000000" 
   android:orientation="vertical"
   android:fillViewport="true">

   <RelativeLayout 
       android:layout_width="fill_parent" 
       android:layout_height="fill_parent">
      <ImageView 
          android:id="@+id/imageView1" 
          android:layout_width="fill_parent" 
          android:layout_height="fill_parent" 
          android:src="@drawable/beta_bg_drawable"/>

        <LinearLayout 
            android:layout_width="fill_parent" 
            android:layout_height="fill_parent" 
            android:background="#5500ff00" 
            android:orientation="vertical">
        </LinearLayout>

   </RelativeLayout>

</ScrollView>