2017-07-19 45 views
0

我在TextView的另一個TextViewConstraintLayout的位置上發現問題,但它沒有重疊底部元素。我已經嘗試將paddingBottommarginBottom的值添加到TextView,但它似乎沒有預算。任何見解?在ConstraintLayout中合併位置TextView

預期渲染

+---------------------------------+ 
| 7/12/2017     | 
|_______ ________________   | 
||  | |    |   | 
||Image| | Text Bubble |   | 
||_____| |______________|   | 
|_________________________________| 

實際呈現

overlapping TextViews

佈局

 <android.support.constraint.ConstraintLayout 
     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="wrap_content" 
     android:paddingTop="8dp"> 
     <CustomComponent.CircleImageView 
      android:id="@+id/rec_image_message_profile" 
      android:layout_width="36dp" 
      android:layout_height="36dp" 
      app:layout_constraintTop_toTopOf="parent" 
      android:layout_marginLeft="8dp" 
      app:layout_constraintLeft_toLeftOf="parent" /> 
     <TextView 
      android:id="@+id/rec_message_body" 
      android:background="@drawable/message_bubble_gray" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:maxWidth="240dp" 
      android:padding="8dp" 
      android:textColor="#39454C" 
      android:layout_marginTop="4dp"  
      app:layout_constraintLeft_toRightOf="@+id/rec_image_message_profile" 
      android:layout_marginLeft="8dp" /> 
     <TextView 
     android:id="@+id/rec_message_time" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:textSize="10sp" 
     app:layout_constraintTop_toTopOf="@+id/rec_message_body" 
     android:layout_marginLeft="8dp" 
     android:gravity="center" 
     android:paddingBottom="20dp"/> 
</android.support.constraint.ConstraintLayout> 
+0

你能解釋一下你想要的佈局應該是什麼樣子? –

+0

用原始文本渲染更新。基本上,日期應該在圓形圖像和文本視圖之上,並且中間有空格。 –

回答

2

當CREA設計一個佈局,我想我的每個視圖都依賴於哪些視圖,然後首先展示不依賴任何東西的視圖。

這聽起來像你的時間戳不依賴於除父母以外的任何東西。你的形象取決於父母和時間戳。你的泡泡取決於圖像。

下面是我爲此編寫的XML。當然,您可以根據需要調整邊距/襯墊。

<android.support.constraint.ConstraintLayout 
    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="wrap_content"> 

    <TextView 
     android:id="@+id/rec_message_time" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_marginTop="12dp" 
     android:layout_marginLeft="16dp" 
     android:textSize="10sp" 
     android:text="7/19/2017 11:05 AM" 
     app:layout_constraintTop_toTopOf="parent" 
     app:layout_constraintLeft_toLeftOf="parent"/> 

    <ImageView 
     android:id="@+id/rec_image_message_profile" 
     android:layout_width="36dp" 
     android:layout_height="36dp" 
     android:layout_marginTop="4dp" 
     android:src="@drawable/circle" 
     app:layout_constraintTop_toBottomOf="@+id/rec_message_time" 
     app:layout_constraintLeft_toLeftOf="@+id/rec_message_time"/> 

    <TextView 
     android:id="@+id/rec_message_body" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_marginLeft="8dp" 
     android:maxWidth="240dp" 
     android:padding="8dp" 
     android:textColor="#39454C" 
     android:text="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua." 
     android:background="@drawable/oval" 
     app:layout_constraintTop_toTopOf="@id/rec_image_message_profile" 
     app:layout_constraintLeft_toRightOf="@id/rec_image_message_profile"/> 

</android.support.constraint.ConstraintLayout> 

enter image description here

+0

做到了。謝謝! –