Android 레이아웃은 다른 두 레이아웃의 중간에 레이아웃을 배치합니다

Question

안녕하세요 저는 Android 레이아웃을 사용하여 벨로우즈 (그림 첨부)와 같은 UI를 만들어야합니다. 머리글, 바닥 글 및 중간 영역이 이미지보기와 함께 표시됩니다. 영역 A와 영역 C 유사한 높이 (화면 20 %)이고, 이미지보기

나의 현재 XML 코드는 다음과 같이 인 영역 B 및 영역 (C)의 중앙에 반드시 배치되어야한다 화상에있어서

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

 
    <LinearLayout 
 
     android:id="@+id/show_contact_bottomArea" 
 
     android:layout_width="match_parent" 
 
     android:layout_height="120dp" 
 
     android:orientation="vertical" 
 
     android:layout_alignParentBottom="true" 
 
     android:layout_alignParentLeft="true" 
 
     android:layout_alignParentStart="true"> 
 

 
    </LinearLayout> 
 

 
    <LinearLayout 
 
     android:id="@+id/show_contact_middleArea" 
 
     android:layout_width="match_parent" 
 
     android:layout_height="150dp" 
 
     android:orientation="vertical" 
 
     android:background="@color/grayContact" 
 
     android:layout_below="@+id/show_contact_headerArea" 
 
     android:layout_alignParentLeft="true" 
 
     android:layout_alignParentStart="true" 
 
     android:layout_above="@+id/show_contact_bottomArea"> 
 
     
 
    </LinearLayout> 
 

 
    <LinearLayout 
 
     android:id="@+id/show_contact_headerArea" 
 
     android:layout_width="match_parent" 
 
     android:layout_height="120dp" 
 
     android:orientation="vertical" 
 
     android:layout_alignParentTop="true" 
 
     android:layout_alignParentLeft="true" 
 
     android:layout_alignParentStart="true"></LinearLayout> 
 

 
    <ImageView 
 
     android:layout_width="150dp" 
 
     android:layout_height="150dp" 
 
     app:srcCompat="@drawable/common_google_signin_btn_icon_dark_focused" 
 
     android:id="@+id/imageView2" 
 
     android:layout_marginBottom="40dp" 
 
     android:layout_alignParentBottom="true" 
 
     android:layout_centerHorizontal="true" /> 
 

 
</RelativeLayout>

나는

marginBot했다 tom = "40dp"

이미지 뷰는 위쪽으로 밀어내는 것이 좋지 않습니다. 영역 B와 영역 C의 경계 중앙에 이미지보기를 배치하는 가장 좋은 방법은 무엇입니까? A 지역 & 지역 B의 높이 layout_height = "120dp"

하지만 이상적으로 모두 방법 화면의 20 % (각)해야한다 :

또한 현재 나는

안드로이드를 준 그것도 달성할까요? 예에 대한 정확한 영역의 부분과 프레임 레이아웃 를주는

Answer 1

당신이 및 C 각 에 무게를 20 %를 줄 수있다 (당신이 B의 부분에 표시 할 높이) - 지역 B 후 상단에 이미지보기를 추가합니다. 이 방법으로 각각 상단 및 하단의 20 %를 차지합니다. 높이의 60 %를 B에 할당하십시오.

imageView의 경우 전체 레이아웃을 좌표 레이아웃에 배치하고 앵커를 바닥 글에 지정할 수 있습니다.

그녀는 코드를

<?xml version="1.0" encoding="utf-8"?> 
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent"> 


    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
     xmlns:app="http://schemas.android.com/apk/res-auto" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:orientation="vertical" 
     android:weightSum="10"> 

     <LinearLayout 

      android:id="@+id/show_contact_bottomArea" 
      android:layout_width="match_parent" 
      android:layout_height="0dp" 
      android:layout_alignParentBottom="true" 
      android:layout_alignParentLeft="true" 
      android:layout_alignParentStart="true" 
      android:layout_weight="2" 
      android:background="@color/primary_light" 
      android:orientation="vertical"> 

     </LinearLayout> 

     <LinearLayout 
      android:id="@+id/show_contact_middleArea" 
      android:layout_width="match_parent" 
      android:layout_height="0dp" 
      android:layout_above="@+id/show_contact_bottomArea" 
      android:layout_alignParentLeft="true" 
      android:layout_alignParentStart="true" 
      android:layout_below="@+id/show_contact_headerArea" 
      android:layout_weight="6" 
      android:background="@color/holo_blue_light" 
      android:orientation="vertical"> 

     </LinearLayout> 

     <LinearLayout 
      android:id="@+id/show_contact_headerArea" 
      android:layout_width="match_parent" 
      android:layout_height="0dp" 
      android:layout_alignParentLeft="true" 
      android:layout_alignParentStart="true" 
      android:layout_alignParentTop="true" 
      android:layout_weight="2" 
      android:background="@color/primary" 
      android:orientation="vertical"></LinearLayout> 


    </LinearLayout> 

    <ImageView 
     android:id="@+id/imageView2" 
     android:layout_width="150dp" 
     android:layout_height="150dp" 
     android:layout_alignParentBottom="true" 
     android:layout_centerHorizontal="true" 
     android:layout_marginBottom="40dp" 
     app:layout_anchor="@+id/show_contact_headerArea" 
     app:layout_anchorGravity="center_horizontal|top" 
     app:srcCompat="@drawable/header_record" /> 


</android.support.design.widget.CoordinatorLayout> 

결과입니다 : - 나는 다른 색상 코드와 다른 부분을 착색했다.

Answer 2

사용 중량 : 중량 합 = 4 영역 A는 1 영역 (B)이 수득 수득 상위 선형 레이아웃 줘야 2 영역 1

수득 c는