java - 我怎样才能做出如下图所示的布局？

Question

我实际上正在尝试创建这样的布局，但它似乎分散在整个地方。

任何优化它的帮助或想法将不胜感激。

xml

<RelativeLayout
    android:id="@+id/header"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentLeft="true" >

    <ImageView
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/menu_normal"
        android:onClick="onClickContentButton" />

    <ImageView
        android:id="@+id/new_chat"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_alignParentTop="true"
        android:onClick="actionPerformed"
        android:src="@drawable/invite_friends_normal" />

    <TextView
        android:id="@+id/headerText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:text="Profile"
        android:textAppearance="?android:attr/textAppearanceMedium" />
</RelativeLayout>

<TextView
    android:id="@+id/textView1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentLeft="true"
    android:layout_alignParentRight="true"
    android:layout_below="@+id/header"
    android:background="#049080"
    android:gravity="center_horizontal"
    android:padding="10dp"
    android:text="My profile"
    android:textColor="#FFFFFF"
    android:textSize="15sp" />

<LinearLayout
    android:id="@+id/linearLayout1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:layout_alignParentLeft="true"
    android:layout_alignParentRight="true"
    android:layout_below="@+id/textView1"
    android:orientation="vertical"
    android:weightSum="2" >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:background="@android:color/darker_gray"
        android:orientation="vertical">

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent" >

            <ImageView
                android:id="@+id/imageView1"
                android:layout_width="100dp"
                android:layout_height="100dp"
                android:layout_margin="20dp"
                android:layout_alignParentLeft="true"
                android:layout_alignParentTop="true"
                android:src="@drawable/com_facebook_profile_picture_blank_square" />

            <ImageView
                android:id="@+id/imageView2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentRight="true"
                android:layout_marginTop="10dp"
                android:layout_alignTop="@+id/imageView1"
                android:src="@drawable/bang_selected" />

            <TextView
                android:id="@+id/textView2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignBottom="@+id/imageView1"
                android:layout_toRightOf="@+id/imageView1"
                android:text="John smith"
                android:textColor="#2D2D2D"
                android:textAppearance="?android:attr/textAppearanceMedium" />

            <TextView
                android:id="@+id/textView3"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignLeft="@+id/textView2"
                android:layout_below="@+id/textView2"
                android:text="latitude:"
                android:textColor="#2d2d2d"
                android:textAppearance="?android:attr/textAppearanceSmall" />

            <TextView
                android:id="@+id/textView4"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerVertical="true"
                android:layout_toRightOf="@+id/textView2"
                android:text="longitude:"
                android:textAppearance="?android:attr/textAppearanceSmall" />

        </RelativeLayout>

    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:orientation="vertical" >
    </LinearLayout>
</LinearLayout>

图形布局

Answer 1

我会让主布局成为一个相对布局。

• “我的个人资料”按钮将是布局中的第一个对象
• 它下面的段可以是另一个相对布局，您可以在其中指定所有元素的关联。
• 底部地图部分将是地图视图

在第二部分中，使用垂直和水平线性布局的混合来获得您想要的外观