Question

我想为该帧的顶部，底部，左侧和右侧使用4 ImageView设计一个框架，如下例所示：

enter image description here

看起来很简单，但我真的很难做到这一点。我尝试使用FrameLayout和layout_alignParentLeft|Right|Top|Bottom，如下所示：

<?xml version="1.0" encoding="utf-8"?>
 <FrameLayout
     xmlns:android="http://schemas.android.com/apk/res/android"
     android:id="@+id/camera_masque"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:background="#FFFFFF"
     >
        <ImageView
            android:id="@+id/camera_top_masque"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:src="@drawable/ic_top_masque_photo"
            android:layout_alignParentTop="true"
        />

        <ImageView
            android:id="@+id/camera_left_masque"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:src="@drawable/ic_left_masque_photo"
            android:layout_alignParentLeft="true"
        />

        <ImageView
            android:id="@+id/camera_right_masque"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:src="@drawable/ic_right_masque_photo"
            android:layout_alignParentRight="true"
        />

         <ImageView
            android:id="@+id/camera_bottom_masque"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:src="@drawable/ic_bottom_masque_photo"
            android:layout_alignParentBottom="true"
        />
</FrameLayout>

它适用于顶部和左侧，但不适用于其他部分（就像它将右侧和底部放在顶部......）。

我也尝试使用这样的RelativeLayout：

<?xml version="1.0" encoding="utf-8"?>
 <RelativeLayout
     xmlns:android="http://schemas.android.com/apk/res/android"
     android:id="@+id/camera_masque"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:background="#FFFFFF"
     >
        <ImageView
            android:id="@+id/camera_top_masque"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:src="@drawable/ic_top_masque_photo"
            android:layout_alignParentTop="true"
        />

        <ImageView
            android:id="@+id/camera_left_masque"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_marginLeft="-2dp"
            android:src="@drawable/ic_left_masque_photo"
            android:layout_below="@id/camera_top_masque"
        />

        <ImageView
            android:id="@+id/camera_right_masque"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:src="@drawable/ic_right_masque_photo"
            android:layout_marginRight="-2dp"
            android:layout_below="@id/camera_top_masque"
            android:layout_alignParentRight="true"
        />

         <ImageView
            android:id="@+id/camera_bottom_masque"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:src="@drawable/ic_bottom_masque_photo"
            android:layout_alignParentBottom="true"
        />
</RelativeLayout>

但同样的事情，并没有像预期的那样发挥作用。

知道我的布局有什么问题吗？我怎么能做到这一点？

注意：图像尺寸为：640 * 114px（上，下）和34 * 572（左，右）。

谢谢！

Answer 1

我通常使用linearlayout来做这样的事情并使用layout_weight参数控制填充。你可能会在这里找到很多类似的问题。

只需创建一个垂直线性布局，在中间部分创建一个水平线性布局。

如果您在Eclipse ADT中使用WYSIWYG布局设计器，那么这将变得更加简单......。tools.android.com了解详细信息

有很多可用于Android布局的教程，这是一个更有用的资源，因为Stack Overflow倾向于处理编程问题而不是布局。

Answer 2

我将回答我自己的问题，以突出我所犯的错误。事实证明，我几乎就在那里，我只需要在左右alignParentTop和ImageView的{{1}}添加alignParentLeft。

但是，我不明白这背后的逻辑！（如果有人可以解释......）

Answer 3

如果框架是由相同的图像构建的。您可以尝试9-patch drawable或带边框和透明中心的形状。

如何在Android中设计框架？

3 个答案: