web-dev-qa-db-fra.com

Comment mettre RelativeLayout dans CoordinatorLayout

J'essaie de recréer le champ de recherche tel qu'il est dans Airbnb Android. J'utilise donc CoorinatorLayout avec Barre d'outils et RecyclerView .

Mais lorsque j'insère quelque chose à l'intérieur du coordinateur en plus de ces deux choses, cela n'apparaît pas. Voici mon code:

<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" />

Mais en fait, si cela fonctionnait, j'aurais du mal à placer le champ de recherche au-dessus de RecyclerView.

J'ai essayé de tout mettre à l'intérieur du RelativeLayout mais cela n'a pas fonctionné.

Voici également l'image de ce que j'essaie de faire enter image description here

ÉDITER:

Voici le code avec 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>
18
Nikola Milutinovic

J'essayais de faire quelque chose d'un peu similaire, mais avec une bannière publicitaire en bas de l'écran. Ma solution était d'envelopper le RelativeLayout en dehors du CoordinatorLayout comme suit:

<?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>

La barre d'outils se cache correctement lors du défilement à l'intérieur de RecyclerView et tout semble fonctionner correctement. J'imagine que si vous suiviez un principe similaire, vous devriez être bon.

26
themanatuf

Si vous souhaitez supprimer la barre d'état de couleur blanche, vous devez supprimer la ligne suivante

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

dans v21/styles.xml

Merci par exemple.

0
Jorge Novo
<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>

Vérifiez si cela fonctionne pour vous.

0
Apurva Kolapkar