2016-12-14 61 views
0

我試圖垂直堆疊動態高度ImageView(圖像將得到下載和顯示,因此不知道高度)與RelativeLayout,我需要一個像在以下圖片的右側圖中藍色矩形代表ImageView,紅色代表其他RelativeLayout垂直堆疊動態高度ImageView與RelativeLayout

enter image description here

到目前爲止,我已經試過以下,它給了我左側數字輸出(佈局重疊)。

<?xml version="1.0" encoding="utf-8"?> 
<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="wrap_content" 
    android:layout_height="wrap_content" 
    card_view:cardCornerRadius="2dp" 
    card_view:cardUseCompatPadding="true" 
    card_view:overlay="@drawable/default_selector"> 

    <RelativeLayout 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:orientation="vertical"> 

     <!-- ImageView represented by Blue rectangle --> 
     <ImageView 
      android:id="@+id/thumb_image_view" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:adjustViewBounds="true" 
      android:scaleType="fitXY" /> 

     <!-- RelativeLayout represented by Red rectangle --> 
     <RelativeLayout 
      android:id="@+id/thumb_bottom_view" 
      android:layout_width="match_parent" 
      android:layout_height="@dimen/default_height" 
      android:layout_alignParentBottom="true" 
      android:animateLayoutChanges="true" 
      android:gravity="center_vertical"> 

      <TextView 
       android:id="@+id/thumb_text_resolution" 
       android:layout_width="wrap_content" 
       android:layout_height="match_parent" 
       android:gravity="center_vertical" 
       android:paddingLeft="@dimen/default_gap" 
       android:paddingRight="@dimen/default_gap" 
       android:textColor="@color/Thumb.Text" 
       android:textSize="14sp" /> 

      <ImageButton 
       android:id="@+id/thumb_button_heart" 
       android:layout_width="@dimen/default_press_size" 
       android:layout_height="@dimen/default_press_size" 
       android:layout_alignParentRight="true" 
       android:layout_centerVertical="true" 
       android:background="?heartBackground" 
       android:scaleType="centerInside" 
       android:src="@drawable/ic_action_heart_empty" /> 

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

爲了使它看起來像右側圖,應該怎樣改變?

回答

0

通過刪除android:layout_alignParentEnd="true" 並添加android:layout_below="@+id/thumb_image_view"來解決它。

<RelativeLayout 
    android:id="@+id/thumb_bottom_view" 
    android:layout_width="match_parent" 
    android:layout_height="@dimen/default_height" 
    android:layout_below="@+id/thumb_image_view" 
    android:animateLayoutChanges="true" 
    android:gravity="center_vertical">