2012-04-21 26 views
5

我的影片分爲三個獨立的圖像背景圖片:Android應用背景:使用多個圖像

backgroundTop.png 
backgroundMiddle.png 
backgroundBottom.png 

我怎麼會去實現在Android應用背景,其中最上面的圖片是在顯示頂部的應用程序,底部的底部圖像,中間的圖像是平鋪在?這當然取決於屏幕上加載了多少內容 - 就像在網頁中一樣。

換句話說,中間圖像平鋪的總次數取決於屏幕上的內容。

我見過的解決方案來實現貼磚背景在這裏單個圖像的:How to make android app's background image repeat

此,如果您使用的是單一的圖片,但沒有與多個圖像工作正常。

鏈接下面的例子,讓你知道我的意思:

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

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

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

回答

9

認爲你可以嘗試結合layer list drawable(它可以設置圖層插圖)與一個平鋪的位圖可繪製,作爲中間層放置並使用適當的插頁定位。

事情是這樣的:

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

但是這一切都取決於你的佈局確實如此。

+0

不錯,我喜歡這個,如果它作品。 – Blundell 2012-04-21 15:38:15

+0

我正在尋找解決不同問題的解決方案,並且您的答案也對我有所幫助。在許多情況下使用圖層列表是一個好主意,謝謝分享! – Stan 2012-10-18 15:38:09

0

嘗試這樣:

頂部和底部的兩個佈局與android:gravity="TOP""BOTTOM"。這兩個佈局設置與android:background="@drawable/xxx.png"

對於中心,無論是使用您的解決方案或可能使用ScrollView。

1

將背景設置爲中間圖像並將其平鋪。 (如你所示的例子)

創建一個標題視圖,你插入每頁的頂部。

創建一個插入每頁底部的頁腳視圖。

並讓您的內容在中間。

我已經在這裏創建了一個平面文件,但您可以輕鬆想象將它重構爲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> 
  • 紅色=頭
  • 綠色=瓷磚(這會從你的主題被繼承)
  • 藍=頁腳

enter image description here

+0

這幾乎工作。問題是紅色和藍色部分只是在綠色背景的頂部。它不會像預期的那樣合併在一起,您可以清楚地看到背景圖像上方有兩個圖像。例如: http://peecee.dk/uploads/042012/device-2012-04-21-174830_big_thumb.png – 2012-04-21 15:49:48

+0

啊,但它會成爲您的資源問題。如果您修剪頁眉和頁腳以定義可拉伸區域並以正確的圖塊大小平鋪中間,則應該讓它們無縫集成。 ** **理論 – Blundell 2012-04-21 15:58:12