Android 布局中的图层

Question

我有一个带有背景图像的屏幕，底部有两个按钮。我正在使用类似这样的代码：

 <?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent" android:layout_height="fill_parent"
    android:orientation="vertical">
    <LinearLayout android:layout_width="wrap_content"
        android:layout_height="0dip" android:layout_weight="1"
        android:orientation="vertical" android:background="@drawable/mainbg">

    </LinearLayout>

        <ImageButton android:layout_height="wrap_content"
        android:background="#FF000000" android:src="@drawable/button1"
        android:padding="5dp"
        android:id="@+id/ImageButton1" android:layout_width="fill_parent">
    </ImageButton>

    <ImageButton android:src="@drawable/button2" android:background="#FF000000" android:id="@+id/ImageButton2"
        android:layout_width="fill_parent" android:focusable="true" android:saveEnabled="false" android:layout_height="wrap_content">
    </ImageButton>

    <TextView android:text="mywebsite.com" android:id="@+id/textView1" android:layout_width="wrap_content" android:layout_height="wrap_content"></TextView>
</LinearLayout>

在此代码中，背景屏幕被粉碎以适应按钮未使用的剩余屏幕空间。也就是说，两个按钮占用了20%的屏幕空间，然后图片就被砸成了剩下的80%。

我的问题： 有没有办法制作某种分层效果，以便我的按钮位于背景图像上方的图层上？

Answer 1

这我觉得很简单。您可以设置作为主布局的父布局的背景图像。所以主布局是有背景图片，其他什么都没有。

android:layout_height="0dip"

所以这将只占据图像高度的高度。所以你也需要解决这个问题。

Answer 2

使用RelativeLayout 并使用android:background 设置背景。

现在将按钮放在底部，取一个LinearLayout 并在其中取两个图像按钮。在两个按钮上提及 android:width="0dp" 和 android:layout_weight="1dp"。

您想要的确切 XML 布局：

<RelativeLayout 
    android:id="@+id/scrollView1" 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent" 
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:background="@drawable/round_red">

    <LinearLayout 
        android:id="@+id/layout"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true">

           <ImageButton
            android:id="@+id/button1"
            android:layout_width="0dip"
            android:layout_height="wrap_content"
            android:src="@drawable/icon"
            android:layout_weight="1">
           </ImageButton>

            <ImageButton
            android:id="@+id/button2"
            android:layout_width="0dip"
            android:layout_height="wrap_content"
            android:src="@drawable/icon"
            android:layout_weight="1">
           </ImageButton>
    </LinearLayout>

</RelativeLayout>

更新：

为什么我建议使用RelativeLayout？ 我建议您使用 RelativeLayout，因为您可以根据父/子视图的相对位置调整和显示视图。如果你有足够的信心，那么在使用RelativeLayout在android中设计UI时，你不必采取更多的子布局。

Answer 3

也许<RelativeLayout/> 会比<LinearLayout/> 更适合您的设计

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <RelativeLayout
        android:layout_width="fill_parent"
        android:layout_height="0dip"
        android:layout_weight="1"
        android:background="@drawable/mainbg" >

        <ImageButton
            android:id="@+id/ImageButton1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/button1"
            android:layout_above="@id/ImageButton2"
            android:layout_centerHorizontal="true" >
        </ImageButton>

        <ImageButton
            android:id="@+id/ImageButton2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/button2"
            android:layout_alignParentBottom="true"
            android:layout_marginTop="10dp"
            android:layout_centerHorizontal="true" >
        </ImageButton>

    </RelativeLayout>

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="mywebsite.com" >
    </TextView>

</LinearLayout>

Answer 4

我不确定我理解你的问题。但似乎图像“manbg”是按钮的兄弟。如果你想让它成为整个视图的背景，你应该使该图像成为 PARENT 线性布局的可绘制对象。

我认为这会做你想要的：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent" android:layout_height="fill_parent"
    android:orientation="vertical" android:background="@drawable/mainbg">


        <ImageButton android:layout_height="wrap_content"
        android:background="#FF000000" android:src="@drawable/button1"
        android:padding="5dp"
        android:id="@+id/ImageButton1" android:layout_width="fill_parent">
    </ImageButton>

    <ImageButton android:src="@drawable/button2" android:background="#FF000000" android:id="@+id/ImageButton2"
        android:layout_width="fill_parent" android:focusable="true" android:saveEnabled="false" android:layout_height="wrap_content">
    </ImageButton>

    <TextView android:text="mywebsite.com" android:id="@+id/textView1" android:layout_width="wrap_content" android:layout_height="wrap_content"></TextView>
</LinearLayout>

顺便说一句，你是如何设计你的用户界面的。 Netbeans 有一个非常漂亮的 UI GUI。它会让这些问题变得微不足道。

希望这会有所帮助。