feat: Some comment design tweaks
This commit is contained in:
parent
ba1725224a
commit
47b1940ace
4 changed files with 214 additions and 175 deletions
|
@ -5,30 +5,39 @@
|
|||
android:id="@+id/commentsCardView"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_marginStart="8dp"
|
||||
android:layout_marginHorizontal="8dp"
|
||||
android:layout_marginTop="8dp"
|
||||
android:layout_marginBottom="4dp">
|
||||
|
||||
|
||||
<LinearLayout
|
||||
android:id="@+id/linearLayout5"
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="wrap_content"
|
||||
android:orientation="vertical"
|
||||
android:paddingStart="0dp"
|
||||
android:paddingEnd="8dp"
|
||||
app:layout_constraintStart_toStartOf="parent"
|
||||
app:layout_constraintTop_toTopOf="parent">
|
||||
|
||||
<com.google.android.material.imageview.ShapeableImageView
|
||||
android:id="@+id/commentUserAvatar"
|
||||
style="@style/CircularImageView"
|
||||
android:layout_width="42dp"
|
||||
android:layout_height="42dp"
|
||||
android:layout_gravity="center_horizontal"
|
||||
<com.google.android.material.card.MaterialCardView
|
||||
android:id="@+id/commentUserAvatarContainer"
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_gravity="center"
|
||||
android:layout_marginTop="12dp"
|
||||
android:scaleType="center"
|
||||
app:srcCompat="@drawable/ic_round_add_circle_24"
|
||||
tools:ignore="ContentDescription,ImageContrastCheck" />
|
||||
android:backgroundTint="@color/transparent"
|
||||
app:cardCornerRadius="64dp"
|
||||
app:strokeColor="@color/transparent">
|
||||
|
||||
<com.google.android.material.imageview.ShapeableImageView
|
||||
android:id="@+id/commentUserAvatar"
|
||||
android:layout_width="42dp"
|
||||
android:layout_height="42dp"
|
||||
android:layout_gravity="center"
|
||||
app:srcCompat="@drawable/ic_round_add_circle_24"
|
||||
tools:ignore="ContentDescription,ImageContrastCheck"
|
||||
tools:tint="@color/bg_black_50" />
|
||||
</com.google.android.material.card.MaterialCardView>
|
||||
|
||||
|
||||
<LinearLayout
|
||||
|
@ -80,7 +89,7 @@
|
|||
android:layout_height="wrap_content"
|
||||
android:layout_marginEnd="4dp"
|
||||
android:ellipsize="end"
|
||||
android:fontFamily="@font/poppins_semi_bold"
|
||||
android:fontFamily="@font/poppins_bold"
|
||||
android:paddingTop="1dp"
|
||||
android:paddingBottom="0dp"
|
||||
android:singleLine="true"
|
||||
|
@ -160,86 +169,116 @@
|
|||
android:textSize="12sp"
|
||||
app:layout_constrainedWidth="true"
|
||||
app:layout_constraintEnd_toStartOf="@+id/linearLayout7"
|
||||
|
||||
app:layout_constraintHeight_max="200dp"
|
||||
app:layout_constraintHorizontal_bias="0.0"
|
||||
app:layout_constraintStart_toEndOf="@+id/linearLayout5"
|
||||
app:layout_constraintTop_toBottomOf="@+id/commentUserDetailsLayout" />
|
||||
|
||||
<TextView
|
||||
android:id="@+id/commentReply"
|
||||
android:layout_width="wrap_content"
|
||||
<LinearLayout
|
||||
android:id="@+id/linearLayout6"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_marginStart="10dp"
|
||||
android:layout_marginEnd="12dp"
|
||||
android:alpha="0.6"
|
||||
android:fontFamily="@font/poppins_semi_bold"
|
||||
android:paddingTop="1dp"
|
||||
android:paddingEnd="12dp"
|
||||
android:text="Reply"
|
||||
android:textSize="12sp"
|
||||
android:layout_marginStart="52dp"
|
||||
android:orientation="horizontal"
|
||||
app:layout_constraintStart_toEndOf="@+id/linearLayout5"
|
||||
app:layout_constraintTop_toBottomOf="@+id/commentText"
|
||||
tools:ignore="HardcodedText" />
|
||||
app:layout_constraintTop_toBottomOf="@+id/commentText">
|
||||
|
||||
<TextView
|
||||
android:id="@+id/commentEdit"
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_marginEnd="12dp"
|
||||
android:alpha="0.6"
|
||||
android:fontFamily="@font/poppins_semi_bold"
|
||||
android:paddingTop="1dp"
|
||||
android:paddingEnd="12dp"
|
||||
android:text="Edit"
|
||||
android:textSize="12sp"
|
||||
app:layout_constraintBottom_toBottomOf="@+id/commentReply"
|
||||
app:layout_constraintStart_toEndOf="@+id/commentReply"
|
||||
tools:ignore="HardcodedText" />
|
||||
<View
|
||||
android:id="@+id/commentRepliesDivider"
|
||||
android:layout_width="24dp"
|
||||
android:layout_height="3dp"
|
||||
android:layout_gravity="center"
|
||||
android:layout_marginStart="4dp"
|
||||
android:background="@color/nav_tab" />
|
||||
|
||||
<TextView
|
||||
android:id="@+id/commentDelete"
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_marginEnd="12dp"
|
||||
android:alpha="0.6"
|
||||
android:fontFamily="@font/poppins_semi_bold"
|
||||
android:paddingTop="1dp"
|
||||
android:paddingEnd="12dp"
|
||||
android:text="Delete"
|
||||
android:textSize="12sp"
|
||||
app:layout_constraintBottom_toBottomOf="@+id/commentEdit"
|
||||
app:layout_constraintStart_toEndOf="@+id/commentEdit"
|
||||
tools:ignore="HardcodedText" />
|
||||
<TextView
|
||||
android:id="@+id/commentTotalReplies"
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="match_parent"
|
||||
android:gravity="center"
|
||||
android:layout_marginStart="4dp"
|
||||
android:alpha="0.6"
|
||||
android:fontFamily="@font/poppins_semi_bold"
|
||||
android:text="View replies"
|
||||
android:textSize="12sp"
|
||||
tools:ignore="HardcodedText" />
|
||||
<Space
|
||||
android:layout_width="0dp"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_weight="1"/>
|
||||
|
||||
<TextView
|
||||
android:id="@+id/commentReport"
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_marginEnd="12dp"
|
||||
android:alpha="0.6"
|
||||
android:fontFamily="@font/poppins_semi_bold"
|
||||
android:paddingTop="1dp"
|
||||
android:paddingEnd="12dp"
|
||||
android:text="Report"
|
||||
android:textSize="12sp"
|
||||
app:layout_constraintBottom_toBottomOf="@+id/commentDelete"
|
||||
app:layout_constraintStart_toEndOf="@+id/commentDelete"
|
||||
tools:ignore="HardcodedText" />
|
||||
<ImageView
|
||||
android:id="@+id/commentInfo"
|
||||
android:layout_width="24dp"
|
||||
android:layout_height="24dp"
|
||||
android:alpha="0.6"
|
||||
android:layout_marginEnd="16dp"
|
||||
app:srcCompat="@drawable/ic_round_dots_vertical_24"
|
||||
tools:ignore="ContentDescription" />
|
||||
|
||||
<TextView
|
||||
android:id="@+id/commentBanUser"
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="wrap_content"
|
||||
android:alpha="0.6"
|
||||
android:fontFamily="@font/poppins_semi_bold"
|
||||
android:paddingTop="1dp"
|
||||
android:text="Ban User"
|
||||
android:textSize="12sp"
|
||||
app:layout_constraintBottom_toBottomOf="@+id/commentReport"
|
||||
app:layout_constraintStart_toEndOf="@+id/commentReport"
|
||||
tools:ignore="HardcodedText" />
|
||||
<TextView
|
||||
android:id="@+id/commentReply"
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="match_parent"
|
||||
android:alpha="0.6"
|
||||
android:fontFamily="@font/poppins_semi_bold"
|
||||
android:gravity="center"
|
||||
android:text="Reply"
|
||||
android:textSize="12sp"
|
||||
app:layout_constraintStart_toEndOf="@+id/commentDownVote"
|
||||
app:layout_constraintTop_toBottomOf="@+id/commentText"
|
||||
tools:ignore="HardcodedText" />
|
||||
|
||||
<TextView
|
||||
android:id="@+id/commentEdit"
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="match_parent"
|
||||
android:layout_marginStart="12dp"
|
||||
android:alpha="0.6"
|
||||
android:gravity="center"
|
||||
android:fontFamily="@font/poppins_semi_bold"
|
||||
android:text="Edit"
|
||||
android:textSize="12sp"
|
||||
app:layout_constraintBottom_toBottomOf="@+id/commentReply"
|
||||
app:layout_constraintStart_toEndOf="@+id/commentReply"
|
||||
tools:ignore="HardcodedText" />
|
||||
<ImageView
|
||||
android:id="@+id/commentUpVote"
|
||||
android:layout_width="24dp"
|
||||
android:layout_height="24dp"
|
||||
android:layout_marginStart="12dp"
|
||||
android:alpha="0.6"
|
||||
android:padding="2dp"
|
||||
app:srcCompat="@drawable/ic_round_upvote_inactive_24"
|
||||
tools:ignore="ContentDescription" />
|
||||
|
||||
<TextView
|
||||
android:id="@+id/commentTotalVotes"
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="match_parent"
|
||||
android:layout_marginStart="4dp"
|
||||
android:alpha="0.6"
|
||||
android:fontFamily="@font/poppins_semi_bold"
|
||||
android:gravity="center"
|
||||
android:text="100"
|
||||
android:textSize="12sp"
|
||||
app:layout_constraintStart_toEndOf="@+id/commentUpVote"
|
||||
app:layout_constraintTop_toBottomOf="@+id/commentText"
|
||||
tools:ignore="HardcodedText" />
|
||||
|
||||
<ImageView
|
||||
android:id="@+id/commentDownVote"
|
||||
android:layout_width="24dp"
|
||||
android:layout_height="24dp"
|
||||
android:layout_marginStart="4dp"
|
||||
android:alpha="0.6"
|
||||
android:padding="2dp"
|
||||
android:rotation="180"
|
||||
app:layout_constraintStart_toEndOf="@+id/commentTotalVotes"
|
||||
app:layout_constraintTop_toBottomOf="@+id/commentText"
|
||||
app:srcCompat="@drawable/ic_round_upvote_inactive_24"
|
||||
tools:ignore="ContentDescription" />
|
||||
</LinearLayout>
|
||||
|
||||
<LinearLayout
|
||||
android:id="@+id/linearLayout7"
|
||||
|
@ -251,60 +290,10 @@
|
|||
app:layout_constraintEnd_toEndOf="parent"
|
||||
app:layout_constraintTop_toTopOf="parent">
|
||||
|
||||
<ImageView
|
||||
android:id="@+id/commentUpVote"
|
||||
android:layout_width="24dp"
|
||||
android:layout_height="24dp"
|
||||
android:alpha="0.4"
|
||||
app:srcCompat="@drawable/ic_round_upvote_inactive_24"
|
||||
tools:ignore="ContentDescription" />
|
||||
|
||||
<TextView
|
||||
android:id="@+id/commentTotalVotes"
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_gravity="center"
|
||||
android:alpha="0.6"
|
||||
android:fontFamily="@font/poppins_semi_bold"
|
||||
android:text="100"
|
||||
android:textSize="12sp"
|
||||
tools:ignore="HardcodedText" />
|
||||
|
||||
<ImageView
|
||||
android:id="@+id/commentDownVote"
|
||||
android:layout_width="24dp"
|
||||
android:layout_height="24dp"
|
||||
android:alpha="0.4"
|
||||
android:rotation="180"
|
||||
app:srcCompat="@drawable/ic_round_upvote_inactive_24"
|
||||
tools:ignore="ContentDescription" />
|
||||
</LinearLayout>
|
||||
|
||||
|
||||
<View
|
||||
android:id="@+id/commentRepliesDivider"
|
||||
android:layout_width="32dp"
|
||||
android:layout_height="3dp"
|
||||
android:layout_gravity="center"
|
||||
android:layout_marginStart="4dp"
|
||||
android:layout_marginTop="8dp"
|
||||
android:background="@color/nav_tab"
|
||||
app:layout_constraintStart_toEndOf="@+id/linearLayout5"
|
||||
app:layout_constraintTop_toBottomOf="@+id/commentReply" />
|
||||
|
||||
<TextView
|
||||
android:id="@+id/commentTotalReplies"
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_marginStart="4dp"
|
||||
android:alpha="0.8"
|
||||
android:fontFamily="@font/poppins_semi_bold"
|
||||
android:text="View replies"
|
||||
android:textSize="12sp"
|
||||
app:layout_constraintBottom_toBottomOf="@+id/commentRepliesDivider"
|
||||
app:layout_constraintStart_toEndOf="@+id/commentRepliesDivider"
|
||||
app:layout_constraintTop_toTopOf="@+id/commentRepliesDivider"
|
||||
tools:ignore="HardcodedText" />
|
||||
|
||||
|
||||
<androidx.recyclerview.widget.RecyclerView
|
||||
|
@ -314,8 +303,8 @@
|
|||
android:nestedScrollingEnabled="false"
|
||||
android:paddingStart="16dp"
|
||||
android:visibility="visible"
|
||||
app:layout_constraintTop_toBottomOf="@+id/commentRepliesDivider"
|
||||
app:layout_constraintTop_toBottomOf="@+id/linearLayout6"
|
||||
tools:ignore="RtlSymmetry"
|
||||
tools:visibility="visible" />
|
||||
tools:visibility="gone" />
|
||||
|
||||
</androidx.constraintlayout.widget.ConstraintLayout>
|
Loading…
Add table
Add a link
Reference in a new issue