2016-07-08 31 views
5

jak mogę umieścić cardview na rodzica cardview w zrzucie ekranu poniżej?Android umieścił Cardview na górze nadrzędnego Cardview w RelativeLayout

enter image description here

kiedy kładę obraz do CardView tę przyczynę uszkodzony mój widok

poprawny pogląd musi być:

enter image description here

Mój układ xml:

<?xml version="1.0" encoding="utf-8"?> 
<FrameLayout 
    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:background="@drawable/content_background"> 

    <android.support.design.widget.CoordinatorLayout 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:orientation="vertical"> 

     <LinearLayout 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:orientation="vertical"> 

      <android.support.design.widget.AppBarLayout 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content"> 

       <android.support.v7.widget.Toolbar 
        android:id="@+id/activity_main_toolbar" 
        android:layout_width="match_parent" 
        android:layout_height="65dp" 
        android:background="@color/colorPrimary" 
        android:titleTextColor="#ffffff"> 

        <LinearLayout 
         android:layout_width="match_parent" 
         android:layout_height="match_parent" 
         android:orientation="horizontal"> 

         <com.joanzapata.iconify.widget.IconTextView 
          android:id="@+id/icon_signal_robot" 
          android:layout_width="wrap_content" 
          android:layout_height="match_parent" 
          android:layout_marginRight="10dp" 
          android:clickable="true" 
          android:gravity="center|right" 
          android:shadowColor="#22000000" 
          android:shadowDx="3" 
          android:shadowDy="3" 
          android:shadowRadius="1" 
          android:text="{fa-android}" 
          android:textColor="@color/quote" 
          android:textSize="30sp"/> 

         <com.joanzapata.iconify.widget.IconTextView 
          android:id="@+id/icon_search_icon" 
          android:layout_width="wrap_content" 
          android:layout_height="match_parent" 
          android:layout_marginRight="10dp" 
          android:clickable="true" 
          android:gravity="center|right" 
          android:shadowColor="#22000000" 
          android:shadowDx="3" 
          android:shadowDy="3" 
          android:shadowRadius="1" 
          android:text="{fa-search}" 
          android:textColor="#ffffff" 
          android:textSize="25sp"/> 

         <com.gigamole.library.ntb.NavigationTabBar 
          android:id="@+id/market_detail_navigation_tab_bar" 
          android:layout_width="90dp" 
          android:layout_height="30dp" 
          android:layout_gravity="center_vertical|left" 
          android:background="@drawable/bg_round_circle" 
          app:ntb_active_color="#4527A0" 
          app:ntb_animation_duration="150" 
          app:ntb_corners_radius="50dp" 
          app:ntb_inactive_color="#dddfec" 
          app:ntb_preview_colors="@array/red_wine"/> 

         <TextView 
          android:id="@+id/signal_application_detail_activity_title" 
          android:layout_width="0dp" 
          android:layout_height="match_parent" 
          android:layout_weight="1" 
          android:clickable="true" 
          android:gravity="center|right" 
          android:text="@string/app_name" 
          android:textColor="#ffffff" 
          android:textSize="19sp"/> 

         <ImageView 
          android:id="@+id/activity_main_hearing_status" 
          android:layout_width="wrap_content" 
          android:layout_height="wrap_content" 
          android:layout_gravity="center" 
          android:layout_marginLeft="5dp" 
          android:layout_marginRight="10dp" 
          android:gravity="center|right" 
          android:src="@drawable/ic_antenna_white"/> 

        </LinearLayout> 
       </android.support.v7.widget.Toolbar> 
      </android.support.design.widget.AppBarLayout> 

      <LinearLayout 
       android:id="@+id/signal_loading_view" 
       android:layout_width="match_parent" 
       android:layout_height="match_parent" 
       android:layout_gravity="center" 
       android:background="@color/colorPrimary" 
       android:gravity="center" 
       android:orientation="vertical" 
       android:visibility="gone"> 

       <TextView 
        android:id="@+id/loading_view_title" 
        android:layout_width="match_parent" 
        android:layout_height="50dp" 
        android:gravity="center" 
        android:text="@string/app_name" 
        android:textColor="#FFF" 
        android:textSize="35sp" 
        /> 

       <TextView 
        android:id="@+id/loading_view_description" 
        android:layout_width="match_parent" 
        android:layout_height="50dp" 
        android:gravity="center" 
        android:text="@string/app_description" 
        android:textColor="#FFF" 
        android:textSize="18dp" 
        /> 

       <com.zl.reik.dilatingdotsprogressbar.DilatingDotsProgressBar 
        android:id="@+id/dots_progressBar" 
        android:layout_width="match_parent" 
        android:layout_height="30dp" 
        android:color="#ffee00" 
        android:radius="4dp" 
        app:dd_animationDuration="300" 
        app:dd_horizontalSpacing="7dp" 
        app:dd_numDots="5" 
        app:dd_scaleMultiplier="1.5" 
        /> 
      </LinearLayout> 

      <RelativeLayout 
       android:id="@+id/frame" 
       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:layout_gravity="center_vertical" 
       android:background="@drawable/content_background"> 

       <android.support.v7.widget.CardView 
        android:id="@+id/malam" 
        android:layout_width="match_parent" 
        android:layout_height="wrap_content"> 

        <ImageView 
         android:id="@+id/imageView2" 
         android:layout_width="match_parent" 
         android:layout_height="230dp" 
         android:scaleType="centerCrop" 
         android:src="@drawable/background"/> 
       </android.support.v7.widget.CardView> 


       <LinearLayout 
        android:id="@+id/linearLayout3" 
        android:layout_width="match_parent" 
        android:layout_height="180dp" 
        android:layout_alignParentTop="true" 
        android:layout_centerHorizontal="true" 
        android:layout_centerVertical="true" 
        android:layout_marginLeft="30dp" 
        android:layout_marginRight="30dp" 
        android:layout_marginTop="120dp" 
        android:fitsSystemWindows="true" 
        android:orientation="vertical"> 

        <android.support.v7.widget.CardView 
         android:layout_width="match_parent" 
         android:layout_height="match_parent" 
         android:layout_alignParentLeft="true" 
         android:layout_alignParentStart="true" 
         android:layout_alignParentTop="true" 
         app:cardCornerRadius="0dp" 
         app:elevation="2dp"> 

        </android.support.v7.widget.CardView> 
       </LinearLayout> 
       <ImageView 
        android:id="@+id/robot_dialog_icon" 
        android:layout_width="65dp" 
        android:layout_height="65dp" 
        android:layout_alignBottom="@+id/malam" 
        android:layout_centerHorizontal="true" 
        android:layout_marginBottom="75dp" 
        android:fitsSystemWindows="true" 
        android:src="@drawable/dialog_robot_dialog" 
        app:layout_collapseMode="parallax"/> 
      </RelativeLayout> 

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

</FrameLayout> 

Odpowiedz

1

Układ ramek i koordynatora działa w ten sam sposób: pierwszy numer View jest najbardziej tłem, następny View znajduje się na górze poprzedniego.

Myślę, że powinieneś po prostu zmienić kolejność swoich CardViews w xml.

Możesz również spróbować użyć android:elevation, aby osiągnąć pożądany rezultat.

Po kilku próbach mam VSD such result:

Moje XML:

<?xml version="1.0" encoding="utf-8"?> 
<android.support.design.widget.CoordinatorLayout 
    android:id="@+id/frame" 
    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:layout_gravity="center_vertical" 
    android:background="@color/colorAccent"> 

    <android.support.v7.widget.CardView 
     android:id="@+id/malam" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content"> 

     <ImageView 
      android:id="@+id/imageView2" 
      android:layout_width="match_parent" 
      android:layout_height="230dp" 
      android:scaleType="centerCrop" 
      android:background="@android:color/holo_blue_dark"/> 
    </android.support.v7.widget.CardView> 

    <android.support.v7.widget.CardView 
     android:id="@+id/white_card" 
     android:layout_width="match_parent" 
     android:layout_height="180dp" 
     android:layout_marginLeft="30dp" 
     android:layout_marginRight="30dp" 
     android:layout_marginTop="120dp" 
     android:layout_centerHorizontal="true" 
     android:layout_centerVertical="true" 
     android:layout_alignParentLeft="true" 
     android:layout_alignParentStart="true" 
     android:layout_alignParentTop="true" 
     app:cardCornerRadius="0dp" 
     app:elevation="10dp"> 
    </android.support.v7.widget.CardView> 

    <android.support.v7.widget.CardView 
     android:layout_width="65dp" 
     android:layout_height="65dp" 
     android:translationY="32dp" 
     app:layout_anchor="@id/white_card" 
     app:layout_anchorGravity="center_horizontal" 
     android:layout_gravity="center_horizontal"> 
    <ImageView 
     android:id="@+id/robot_dialog_icon" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:background="@color/colorPrimary"/> 
    </android.support.v7.widget.CardView> 

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

'android: elevation' nie zmienić mój pogląd –

+0

Co o kolejności CardView w swojej xml? –

+0

Mam wklejony układ xml w moim poście, możesz go przetestować? –

0

ja nie rozumiem, co chcesz, ale myślę chcesz poniżej rzeczy.

Jeśli chcesz tego typu jak obraz

enter image description here

Następnie użyć tego kodu.

kodu 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" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:paddingBottom="@dimen/activity_vertical_margin" 
    android:paddingLeft="@dimen/activity_horizontal_margin" 
    android:paddingRight="@dimen/activity_horizontal_margin" 
    android:paddingTop="@dimen/activity_vertical_margin" 
    app:layout_behavior="@string/appbar_scrolling_view_behavior" 
    tools:context="com.example.softeng.aab.MainActivity" 
    tools:showIn="@layout/activity_main"> 

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

     <RelativeLayout 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_margin="5dp"> 

      <android.support.v7.widget.CardView 
       xmlns:android="http://schemas.android.com/apk/res/android" 
       xmlns:card_view="http://schemas.android.com/apk/res-auto" 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content" 
       android:id="@+id/card_view" 
       card_view:cardCornerRadius="1dp" 
       android:foreground="?android:attr/selectableItemBackground" 
       android:layout_marginTop="5dp"> 

       <RelativeLayout 
        android:layout_width="match_parent" 
        android:layout_height="match_parent" 
        android:layout_gravity="center" 
        > 
        <ProgressBar 
         android:id="@+id/progress" 
         android:visibility="visible" 
         style="?android:attr/progressBarStyleSmall" 
         android:layout_width="wrap_content" 
         android:layout_height="wrap_content" 
         android:layout_centerInParent="true" 
         /> 
       </RelativeLayout> 
       <LinearLayout 
        android:id="@+id/content_loading" 
        android:visibility="invisible" 
        android:layout_width="match_parent" 
        android:layout_height="wrap_content" 
        android:gravity="center_vertical" 
        android:padding="5dp" 
        android:orientation="vertical"> 


        <TextView 
         android:id="@+id/text_description" 
         android:layout_width="wrap_content" 
         android:layout_height="wrap_content" 
         android:textSize="@dimen/abc_text_size_medium_material" 
         android:layout_marginBottom="5dp" /> 

        <TextView 
         android:id="@+id/text_owner" 
         android:layout_width="wrap_content" 
         android:layout_height="wrap_content" 
         android:textSize="@dimen/abc_text_size_small_material" 
         android:layout_marginBottom="5dp" /> 

        <TextView 
         android:id="@+id/text_networks" 
         android:layout_width="wrap_content" 
         android:layout_height="wrap_content" 
         android:textSize="@dimen/abc_text_size_small_material" 
         /> 

        <LinearLayout 
         android:orientation="vertical" 
         android:layout_width="match_parent" 
         android:layout_height="5dp" /> 

       </LinearLayout> 
      </android.support.v7.widget.CardView> 

     </RelativeLayout> 

     <LinearLayout 
      android:orientation="horizontal" 
      android:layout_width="wrap_content" 
      android:layout_height="100dp" 
      app:layout_anchor="@id/card_view" 
      app:layout_anchorGravity="right|end|bottom" 
      android:layout_marginRight="@dimen/fab_margin"> 

     </LinearLayout> 

     <RelativeLayout 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:layout_margin="5dp" 
      > 
      <ImageView 
       android:id="@+id/image_avatar" 
       android:layout_width="20dp" 
       android:layout_height="20dp" 
       android:src="@android:color/holo_red_dark" 
       android:layout_centerHorizontal="true" /> 
     </RelativeLayout> 
    </android.support.design.widget.CoordinatorLayout> 
</RelativeLayout> 

UPDATE:

enter image description here

myślę, że wymagają tego kodu

:

<?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" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:paddingBottom="@dimen/activity_vertical_margin" 
    android:paddingLeft="@dimen/activity_horizontal_margin" 
    android:paddingRight="@dimen/activity_horizontal_margin" 
    android:paddingTop="@dimen/activity_vertical_margin" 
    app:layout_behavior="@string/appbar_scrolling_view_behavior" 
    tools:context="com.example.softeng.aab.MainActivity" 
    tools:showIn="@layout/activity_main"> 

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

     <RelativeLayout 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_margin="5dp" 
      > 

      <android.support.v7.widget.CardView 
       xmlns:android="http://schemas.android.com/apk/res/android" 
       xmlns:card_view="http://schemas.android.com/apk/res-auto" 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content" 
       android:id="@+id/card_view" 
       card_view:cardCornerRadius="1dp" 
       android:foreground="?android:attr/selectableItemBackground" 
       android:layout_marginTop="5dp"> 

       <RelativeLayout 
        android:layout_width="match_parent" 
        android:layout_height="match_parent" 
        android:layout_gravity="center" 
        > 
        <ProgressBar 
         android:id="@+id/progress" 
         android:visibility="visible" 
         style="?android:attr/progressBarStyleSmall" 
         android:layout_width="wrap_content" 
         android:layout_height="wrap_content" 
         android:layout_centerInParent="true" 
         /> 
       </RelativeLayout> 
       <LinearLayout 
        android:id="@+id/content_loading" 
        android:visibility="invisible" 
        android:layout_width="match_parent" 
        android:layout_height="wrap_content" 
        android:gravity="center_vertical" 
        android:padding="5dp" 
        android:orientation="vertical"> 


        <TextView 
         android:id="@+id/text_description" 
         android:layout_width="wrap_content" 
         android:layout_height="wrap_content" 
         android:textSize="@dimen/abc_text_size_medium_material" 
         android:layout_marginBottom="5dp" /> 

        <TextView 
         android:id="@+id/text_owner" 
         android:layout_width="wrap_content" 
         android:layout_height="wrap_content" 
         android:textSize="@dimen/abc_text_size_small_material" 
         android:layout_marginBottom="5dp" /> 

        <TextView 
         android:id="@+id/text_networks" 
         android:layout_width="wrap_content" 
         android:layout_height="wrap_content" 
         android:textSize="@dimen/abc_text_size_small_material" 
         /> 

        <LinearLayout 
         android:orientation="vertical" 
         android:layout_width="match_parent" 
         android:layout_height="5dp" /> 

       </LinearLayout> 
      </android.support.v7.widget.CardView> 

     </RelativeLayout> 

     <LinearLayout 
      android:orientation="horizontal" 
      android:layout_width="wrap_content" 
      android:layout_height="100dp" 
      app:layout_anchor="@id/card_view" 
      app:layout_anchorGravity="right|end|bottom" 
      android:layout_marginRight="@dimen/fab_margin"> 

     </LinearLayout> 

     <RelativeLayout 
      android:layout_width="match_parent" 
      android:layout_height="100dp" 
      android:layout_margin="5dp" 

      > 
      <de.hdodenhof.circleimageview.CircleImageView 
       android:id="@+id/image_avatar" 
       android:layout_width="20dp" 
       android:layout_height="20dp" 
       android:src="@android:color/holo_red_dark" 
       android:layout_centerHorizontal="true" /> 
     </RelativeLayout> 
    </android.support.design.widget.CoordinatorLayout> 
</RelativeLayout> 

Aby zmienić Image w okrągłym kształcie wystarczy zmienić ImageView na de.hdodenhof.circleimageview.CircleImageView rozwiąże problem.

dodaj poniżej zależności w pliku build.gradle, aby utworzyć obraz rundy.

compile 'de.hdodenhof:circleimageview:2.0.0 
+0

Dzięki, ale gdzie jest obraz tła, który był w 'CardView'? –

+0

@ Mahdi.Pishguy Którego "obrazu" mówisz o .. – Ironman

+0

Mam tylko jeden obraz tła, na obu wklejanych obrazach widać, że nie jest to "circularImage" –

1

CardView ma domyślną cardElevation = 4. Z tego powodu wszystkie inne widoki wchodzące w ten sam nadrzędny układ tego widoku będą poniżej tego widoku karty.

W twoim kodzie widok kart z identyfikatorem "malam" będzie powyżej innych widoków z powodu domyślnej wartości karty. Spróbuj ustawić jego wartość cardElevation jako 0dp, aby to zmienić.

<android.support.v7.widget.CardView 
     android:id="@+id/malam" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     app:cardElevation="0dp"> 

UPDATE

Ustawianie 0DP usunie w cień tego cardview. Jeśli wymagana jest cień, następnie albo

  1. Usuń właściwość cardElevation z CardView "Malam" & zestaw "android Wysokość" do poglądów z id "linearLayout3" & "robot_dialog_icon" So ta wartość jest większa niż 4dp.
    (Uwaga: To działa na lizak & wyższych wersjach tylko)

    LUB

  2. wrap "linearLayout3" & "robot_dialog_icon" wewnątrz poszczególnych CardViews.

+0

ustawiona na '0' powoduje usunięcie' CardView' shadow –

+0

Ustawienie 0 spowoduje usunięcie cienia. Jeśli jest to potrzebne, możesz ustawić android: elevation = "5dp" na inne widoki "linearLayout3" i "robot_dialog_icon" i usunąć cardElevation z "malam". Ale właściwość elewacji działa w wersjach Androida => 21. – sJy

+0

Innym rozwiązaniem jest zawijanie "linearLayout3" i "robot_dialog_icon" w poszczególnych CardViews, więc działa we wszystkich wersjach. – sJy