Плагин Android размещает макет в середине еще двух макетов

Question

Здравствуйте, я должен создать пользовательский интерфейс, похожий ниже, (рисунок прилагается), используя обычные макеты Android. Я получаю заголовок, нижний колонтитул и средние области вместе с изображением. Согласно изображению: Зона A и зона С аналогична высоте (20% от экрана) и просматривать изображения должны быть размещены всегда в центре района B и C. Площадь

Мой текущий код XML, как это

<?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 и Area C.

Также в настоящее время я дал

Android: layout_height = "120dp"

по высоте Область A & Зона B, но в идеале оба должны быть на 20% (каждый) экрана, Как добиться этого также?

Answer 1

вы можете дать взвешивает 20% к каждому и C. Таким образом, они будут занимать соответственно 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

использование веса для придания точной части площади и рама Layout для например: суммарных веса = 4 должно дать в родительской линейной компоновке Область A дает 1 Площадь б дают 2 область С, получая 1

После того, как зона B добавить изображение Вид с верхней - (высота вы хотите, чтобы появиться в части Б)