13

Я пытаюсь воссоздать окно поиска, как в приложении для Android Airbnb. Итак, я использую CoorinatorLayout с Панель инструментов и RecyclerView.Как установить RelativeLayout внутри CoordinatorLayout

Но когда я вставляю что-то внутри Координатора помимо этих двух вещей, он не появляется. Вот мой код:

<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" 
xmlns:app="http://schemas.android.com/apk/res-auto" 
android:id="@+id/slidingLayout" 
android:layout_width="match_parent" 
android:layout_height="match_parent"> 

<android.support.design.widget.AppBarLayout 
    android:id="@+id/appbar" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content"> 

    <android.support.v7.widget.Toolbar 
     android:id="@+id/toolbar" 
     android:layout_width="match_parent" 
     android:layout_height="?attr/actionBarSize" 
     android:background="@color/red" 
     app:layout_scrollFlags="scroll|enterAlways" /> 

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

<LinearLayout 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:layout_marginLeft="50dp" 
    android:layout_marginRight="50dp" 
    android:layout_marginTop="20dp" 
    android:background="@drawable/rounded_background" 
    android:orientation="horizontal" 
    android:padding="6dp" 
    app:layout_scrollFlags="scroll|enterAlways"> 

    <EditText 
     android:id="@+id/search" 
     android:layout_width="0dp" 
     android:layout_height="fill_parent" 
     android:layout_weight="6" 
     android:background="@null" 
     android:fontFamily="sans-serif-light" 
     android:hint="Unesite grad" 
     android:paddingLeft="16dp" 
     android:paddingStart="16dp" /> 

    <ImageView 
     android:id="@+id/cancelSearch" 
     android:layout_width="0dp" 
     android:layout_height="40dp" 
     android:layout_weight="1" 
     android:padding="10dp" 
     android:src="@drawable/ic_cancel" /> 
</LinearLayout> 

<android.support.v7.widget.RecyclerView 
    android:id="@+id/recyclerView" 
    android:layout_width="match_parent" 
    android:layout_height="fill_parent" 
    android:layout_below="@id/appbar" 
    android:background="#ffffff" 
    app:layout_behavior="@string/appbar_scrolling_view_behavior" /> 

Но на самом деле, если это даже работал, я бы неприятностей положить форму поиска выше RecyclerView.

Я попытался поместить все в RelativeLayout, но это не сработало.

Здесь также картина того, что я пытаюсь сделать enter image description here

EDIT:

Вот код с RelativeLayout

<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    android:id="@+id/slidingLayout" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent"> 

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

     <android.support.design.widget.AppBarLayout 
      android:id="@+id/appbar" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" 
      android:background="#00000000"> 

      <android.support.v7.widget.Toolbar 
       android:id="@+id/toolbar" 
       android:layout_width="match_parent" 
       android:layout_height="?attr/actionBarSize" 
       android:background="@color/red" 
       app:layout_scrollFlags="scroll|enterAlways"/> 
    </android.support.design.widget.AppBarLayout> 

    <RelativeLayout 
     android:layout_width="fill_parent" 
     android:layout_height="fill_parent"> 
     <LinearLayout 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:layout_marginLeft="50dp" 
    android:layout_marginRight="50dp" 
    android:layout_marginTop="20dp" 
    android:background="@drawable/rounded_background" 
    android:orientation="horizontal" 
    android:padding="6dp" 
    app:layout_scrollFlags="scroll|enterAlways"> 

    <EditText 
     android:id="@+id/search" 
     android:layout_width="0dp" 
     android:layout_height="fill_parent" 
     android:layout_weight="6" 
     android:background="@null" 
     android:fontFamily="sans-serif-light" 
     android:hint="Unesite grad" 
     android:paddingLeft="16dp" 
     android:paddingStart="16dp" /> 

    <ImageView 
     android:id="@+id/cancelSearch" 
     android:layout_width="0dp" 
     android:layout_height="40dp" 
     android:layout_weight="1" 
     android:padding="10dp" 
     android:src="@drawable/ic_cancel" /> 
</LinearLayout> 
     <android.support.v7.widget.RecyclerView 
      android:id="@+id/recyclerView" 
      android:layout_width="match_parent" 
      android:layout_height="fill_parent" 
      android:layout_below="@id/appbar" 
      android:background="#ffffff" 
      app:layout_behavior="@string/appbar_scrolling_view_behavior" /> 
    </RelativeLayout> 

+0

Где код, в котором вы * пробовали *, чтобы поставить 'RelativeLayout' в' CoordinatorLayout'? –

+0

Я попробовал 2 способа. Сначала я обволакивал все взгляды внутри координатораLayout, поэтому Relative был первым и единственным ребенком. Это привело к потере поведения прокрутки для всех элементов. А другой находится в EDIT, где я завернул RecyclerView и это поле поиска внутри Relative. –

+0

@NikolaMilutinovic Поведение прокрутки будет работать для всех дочерних элементов, которые являются прямым дочерним элементом 'CoordinatorLayout', поэтому, если вы установите поведение макета в' RelativeLayout', вложенная прокрутка будет работать. –

ответ

21

Я пытался сделать что-то немного похожее, но с рекламным баннером в нижней части экрана. Мое решение было обернуть RelativeLayout вне CoordinatorLayout, как так:

<?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:id="@+id/main_layout" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent"> 

    <android.support.design.widget.CoordinatorLayout 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:layout_above="@+id/ad_view"> 

    <android.support.design.widget.AppBarLayout 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"> 

     <android.support.v7.widget.Toolbar 
      android:id="@+id/toolbar" 
      android:layout_width="match_parent" 
      android:layout_height="?attr/actionBarSize" 
      android:background="?attr/colorPrimary" 
      app:layout_scrollFlags="scroll|enterAlways" 
      app:popupTheme="@style/ThemeOverlay.AppCompat.Light" /> 

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

    <android.support.v7.widget.RecyclerView 
     android:id="@+id/my_list_view" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     app:layout_behavior="@string/appbar_scrolling_view_behavior" /> 

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

    <com.google.android.gms.ads.AdView 
     android:id="@+id/ad_view" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_centerHorizontal="true" 
     android:layout_alignParentBottom="true" 
     android:layout_gravity="center|bottom" 
     app:adSize="SMART_BANNER" 
     app:adUnitId="@string/admob_id" /> 

</RelativeLayout> 

Панель правильно скрывает при прокрутке внутри RecyclerView и все, кажется, работает нормально. Я бы предположил, что если вы будете следовать аналогичному принципу, вы должны быть добрыми.

+0

То, что мне нужно (после нескольких часов поиска!). Благодарю. – sidiabale

0

Если вы хотите удалить строку состояния белого цвета, вы должны удалить следующую строку

<item name="android:statusBarColor">@android:color/transparent</item>` 

в v21/styles.xml

Спасибо, например.

0
<android.support.design.widget.CoordinatorLayout 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    android:id="@+id/slidingLayout" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent"> 

    <android.support.design.widget.AppBarLayout 
     android:id="@+id/appbar" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content"> 

     <android.support.v7.widget.Toolbar 
      android:id="@+id/toolbar" 
      android:layout_width="match_parent" 
      android:layout_height="?attr/actionBarSize" 
      android:background="@color/red" 
      app:layout_scrollFlags="scroll|enterAlways"/> 

     <LinearLayout 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:layout_marginLeft="50dp" 
      android:layout_marginRight="50dp" 
      android:layout_marginTop="20dp" 
      android:background="@drawable/rounded_background" 
      android:orientation="horizontal" 
      android:padding="6dp" 
      app:layout_scrollFlags="scroll|enterAlways"> 

      <EditText 
       android:id="@+id/search" 
       android:layout_width="0dp" 
       android:layout_height="fill_parent" 
       android:layout_weight="6" 
       android:background="@null" 
       android:fontFamily="sans-serif-light" 
       android:hint="Unesite grad" 
       android:paddingLeft="16dp" 
       android:paddingStart="16dp"/> 

      <ImageView 
       android:id="@+id/cancelSearch" 
       android:layout_width="0dp" 
       android:layout_height="40dp" 
       android:layout_weight="1" 
       android:padding="10dp" 
       android:src="@drawable/ic_cancel" /> 
     </LinearLayout> 
    </android.support.design.widget.AppBarLayout> 

    <android.support.v7.widget.RecyclerView 
     android:id="@+id/recyclerView" 
     android:layout_width="match_parent" 
     android:layout_height="fill_parent" 
     android:layout_below="@id/appbar" 
     android:background="#ffffff" 
     app:layout_behavior="@string/appbar_scrolling_view_behavior"/> 
</android.support.design.widget.CoordinatorLayout> 

Проверьте, подходит ли это для вас.