Android App Background: Using Multiple Images

I have a background image broken into three separate images:

backgroundTop.png
backgroundMiddle.png
backgroundBottom.png

What should I do in the background in an Android application in which the top image is displayed at the top of the application, and the bottom image is at the bottom, and the middle image is alternated between them? Of course, this depends on how much content is uploaded to the screen - like on web pages.

In other words, the total number of times the average image is tiled will depend on what is on the screen.

I saw a solution for implementing a cladding background from a single image here: How to make a background image of an Android application with a profile

This works great if you are using a single image, but not with multiple images.

Links to examples below so you know what I mean:

http://rockfreaks.net/images/reviewPageTop.png

http://rockfreaks.net/images/reviewPageMiddle.png

http://rockfreaks.net/images/reviewPageBottom.png

+5
source share
3 answers

Think about it, you can try combining the list of layers with the possibility of drawing (it is possible to set inserts for layers) with an engraved fragmented raster drawing, which is placed as the middle layer and arranged with the corresponding inserts.

Something like that:

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
  <item android:drawable="@drawable/page_top" />
  <item 
     android:insetTop="@dimen/page_top_height"
     android:insetBottom="@dimen/page_bottom_height"
     >
    <bitmap
        android:src="@drawable/page_middle_tile"
        android:tileMode="repeat"
        />
  </item>
  <item android:drawable="@drawable/page_bottom" />
</layer-list>

But it all depends on your layout.

+9
source

Set the background as the middle image and draw it. (as in the example you are showing)

, .

, .

.

, includes .

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#00FF00" >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="100dip"
        android:layout_alignParentTop="true"
        android:background="#FF0000" />

    <!-- Your content -->

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="100dip"
        android:layout_alignParentBottom="true"
        android:background="#0000FF" />

</RelativeLayout>
  • =
  • Green = ( )
  • =

enter image description here

+1

- :

android:gravity="TOP" "BOTTOM". android:background="@drawable/xxx.png"

, , ScrollView.

0

All Articles