Tweak the design of comments.

app/src/main/java/ml/docilealligator/infinityforreddit/adapters/CommentAndPostRecyclerViewAdapter.java

@@ -111,6 +111,7 @@ import ml.docilealligator.infinityforreddit.comment.Comment;
 import ml.docilealligator.infinityforreddit.comment.FetchComment;
 import ml.docilealligator.infinityforreddit.customtheme.CustomThemeWrapper;
 import ml.docilealligator.infinityforreddit.customviews.AspectRatioGifImageView;
+import ml.docilealligator.infinityforreddit.customviews.CommentIndentationView;
 import ml.docilealligator.infinityforreddit.customviews.MarkwonLinearLayoutManager;
 import ml.docilealligator.infinityforreddit.fragments.ViewPostDetailFragment;
 import ml.docilealligator.infinityforreddit.post.Post;
@@ -237,6 +238,7 @@ public class CommentAndPostRecyclerViewAdapter extends RecyclerView.Adapter<Recy
     private int mCommentIconAndInfoColor;
     private int mFullyCollapsedCommentBackgroundColor;
     private int mAwardedCommentBackgroundColor;
+    private int[] verticalBlockColors;
 
     private Drawable mCommentIcon;
     private float mScale;
@@ -569,6 +571,16 @@ public class CommentAndPostRecyclerViewAdapter extends RecyclerView.Adapter<Recy
         mFullyCollapsedCommentBackgroundColor = customThemeWrapper.getFullyCollapsedCommentBackgroundColor();
         mAwardedCommentBackgroundColor = customThemeWrapper.getAwardedCommentBackgroundColor();
 
+        verticalBlockColors = new int[] {
+                customThemeWrapper.getCommentVerticalBarColor1(),
+                customThemeWrapper.getCommentVerticalBarColor2(),
+                customThemeWrapper.getCommentVerticalBarColor3(),
+                customThemeWrapper.getCommentVerticalBarColor4(),
+                customThemeWrapper.getCommentVerticalBarColor5(),
+                customThemeWrapper.getCommentVerticalBarColor6(),
+                customThemeWrapper.getCommentVerticalBarColor7(),
+        };
+
         mCommentIcon = activity.getDrawable(R.drawable.ic_comment_grey_24dp);
         if (mCommentIcon != null) {
             DrawableCompat.setTint(mCommentIcon, mPostIconAndInfoColor);
@@ -1104,42 +1116,7 @@ public class CommentAndPostRecyclerViewAdapter extends RecyclerView.Adapter<Recy
                     Utils.getNVotes(mShowAbsoluteNumberOfVotes,
                     comment.getScore() + comment.getVoteType())));
 
-            ((CommentViewHolder) holder).linearLayout.setPadding(comment.getDepth() * 24, 0, 0, 0);
+            ((CommentViewHolder) holder).commentIndentationView.setLevelAndColors(comment.getDepth(), verticalBlockColors);
-            if (comment.getDepth() > 0) {
-                switch (comment.getDepth() % 7) {
-                    case 0:
-                        ((CommentViewHolder) holder).verticalBlock
-                                .setBackgroundColor(mCommentVerticalBarColor7);
-                        break;
-                    case 1:
-                        ((CommentViewHolder) holder).verticalBlock
-                                .setBackgroundColor(mCommentVerticalBarColor1);
-                        break;
-                    case 2:
-                        ((CommentViewHolder) holder).verticalBlock
-                                .setBackgroundColor(mCommentVerticalBarColor2);
-                        break;
-                    case 3:
-                        ((CommentViewHolder) holder).verticalBlock
-                                .setBackgroundColor(mCommentVerticalBarColor3);
-                        break;
-                    case 4:
-                        ((CommentViewHolder) holder).verticalBlock
-                                .setBackgroundColor(mCommentVerticalBarColor4);
-                        break;
-                    case 5:
-                        ((CommentViewHolder) holder).verticalBlock
-                                .setBackgroundColor(mCommentVerticalBarColor5);
-                        break;
-                    case 6:
-                        ((CommentViewHolder) holder).verticalBlock
-                                .setBackgroundColor(mCommentVerticalBarColor6);
-                        break;
-                }
-                ViewGroup.LayoutParams params = ((CommentViewHolder) holder).verticalBlock.getLayoutParams();
-                params.width = 12;
-                ((CommentViewHolder) holder).verticalBlock.setLayoutParams(params);
-            }
 
             if (comment.hasReply()) {
                 if (comment.isExpanded()) {
@@ -1205,85 +1182,13 @@ public class CommentAndPostRecyclerViewAdapter extends RecyclerView.Adapter<Recy
             }
             ((CommentFullyCollapsedViewHolder) holder).scoreTextView.setText(mActivity.getString(R.string.top_score,
                     Utils.getNVotes(mShowAbsoluteNumberOfVotes, comment.getScore() + comment.getVoteType())));
-
+            ((CommentFullyCollapsedViewHolder) holder).commentIndentationView.setLevelAndColors(comment.getDepth(), verticalBlockColors);
-            ((CommentFullyCollapsedViewHolder) holder).itemView.setPadding(comment.getDepth() * 24, 0, 0, 0);
-            if (comment.getDepth() > 0) {
-                switch (comment.getDepth() % 7) {
-                    case 0:
-                        ((CommentFullyCollapsedViewHolder) holder).verticalBlock
-                                .setBackgroundColor(mCommentVerticalBarColor7);
-                        break;
-                    case 1:
-                        ((CommentFullyCollapsedViewHolder) holder).verticalBlock
-                                .setBackgroundColor(mCommentVerticalBarColor1);
-                        break;
-                    case 2:
-                        ((CommentFullyCollapsedViewHolder) holder).verticalBlock
-                                .setBackgroundColor(mCommentVerticalBarColor2);
-                        break;
-                    case 3:
-                        ((CommentFullyCollapsedViewHolder) holder).verticalBlock
-                                .setBackgroundColor(mCommentVerticalBarColor3);
-                        break;
-                    case 4:
-                        ((CommentFullyCollapsedViewHolder) holder).verticalBlock
-                                .setBackgroundColor(mCommentVerticalBarColor4);
-                        break;
-                    case 5:
-                        ((CommentFullyCollapsedViewHolder) holder).verticalBlock
-                                .setBackgroundColor(mCommentVerticalBarColor5);
-                        break;
-                    case 6:
-                        ((CommentFullyCollapsedViewHolder) holder).verticalBlock
-                                .setBackgroundColor(mCommentVerticalBarColor6);
-                        break;
-                }
-                ViewGroup.LayoutParams params = ((CommentFullyCollapsedViewHolder) holder).verticalBlock.getLayoutParams();
-                params.width = 12;
-                ((CommentFullyCollapsedViewHolder) holder).verticalBlock.setLayoutParams(params);
-            }
         } else if (holder instanceof LoadMoreChildCommentsViewHolder) {
             Comment placeholder;
             placeholder = mIsSingleCommentThreadMode ? mVisibleComments.get(holder.getBindingAdapterPosition() - 2)
                     : mVisibleComments.get(holder.getBindingAdapterPosition() - 1);
 
-            ((LoadMoreChildCommentsViewHolder) holder).itemView.setPadding(placeholder.getDepth() * 24, 0, 0, 0);
+            ((LoadMoreChildCommentsViewHolder) holder).commentIndentationView.setLevelAndColors(placeholder.getDepth(), verticalBlockColors);
-            if (placeholder.getDepth() > 0) {
-                switch (placeholder.getDepth() % 7) {
-                    case 0:
-                        ((LoadMoreChildCommentsViewHolder) holder).verticalBlock
-                                .setBackgroundColor(mCommentVerticalBarColor7);
-                        break;
-                    case 1:
-                        ((LoadMoreChildCommentsViewHolder) holder).verticalBlock
-                                .setBackgroundColor(mCommentVerticalBarColor1);
-                        break;
-                    case 2:
-                        ((LoadMoreChildCommentsViewHolder) holder).verticalBlock
-                                .setBackgroundColor(mCommentVerticalBarColor2);
-                        break;
-                    case 3:
-                        ((LoadMoreChildCommentsViewHolder) holder).verticalBlock
-                                .setBackgroundColor(mCommentVerticalBarColor3);
-                        break;
-                    case 4:
-                        ((LoadMoreChildCommentsViewHolder) holder).verticalBlock
-                                .setBackgroundColor(mCommentVerticalBarColor4);
-                        break;
-                    case 5:
-                        ((LoadMoreChildCommentsViewHolder) holder).verticalBlock
-                                .setBackgroundColor(mCommentVerticalBarColor5);
-                        break;
-                    case 6:
-                        ((LoadMoreChildCommentsViewHolder) holder).verticalBlock
-                                .setBackgroundColor(mCommentVerticalBarColor6);
-                        break;
-                }
-
-                ViewGroup.LayoutParams params = ((LoadMoreChildCommentsViewHolder) holder).verticalBlock.getLayoutParams();
-                params.width = 12;
-                ((LoadMoreChildCommentsViewHolder) holder).verticalBlock.setLayoutParams(params);
-            }
 
             if (placeholder.isLoadingMoreChildren()) {
                 ((LoadMoreChildCommentsViewHolder) holder).placeholderTextView.setText(R.string.loading);
@@ -1989,16 +1894,12 @@ public class CommentAndPostRecyclerViewAdapter extends RecyclerView.Adapter<Recy
             ((CommentViewHolder) holder).scoreTextView.setTextColor(mCommentIconAndInfoColor);
             ((CommentViewHolder) holder).downvoteButton.setColorFilter(mCommentIconAndInfoColor, android.graphics.PorterDuff.Mode.SRC_IN);
             ((CommentViewHolder) holder).replyButton.setColorFilter(mCommentIconAndInfoColor, android.graphics.PorterDuff.Mode.SRC_IN);
-            ViewGroup.LayoutParams params = ((CommentViewHolder) holder).verticalBlock.getLayoutParams();
-            params.width = 0;
-            ((CommentViewHolder) holder).verticalBlock.setLayoutParams(params);
-            ((CommentViewHolder) holder).linearLayout.setPadding(0, 0, 0, 0);
             ((CommentViewHolder) holder).itemView.setBackgroundColor(mCommentBackgroundColor);
+            ((CommentViewHolder) holder).commentIndentationView.setLevelAndColors(0, verticalBlockColors);
         } else if (holder instanceof CommentFullyCollapsedViewHolder) {
-            ViewGroup.LayoutParams params = ((CommentFullyCollapsedViewHolder) holder).verticalBlock.getLayoutParams();
+            ((CommentFullyCollapsedViewHolder) holder).commentIndentationView.setLevelAndColors(0, verticalBlockColors);
-            params.width = 0;
+        } else if (holder instanceof LoadMoreChildCommentsViewHolder) {
-            ((CommentFullyCollapsedViewHolder) holder).verticalBlock.setLayoutParams(params);
+            ((LoadMoreChildCommentsViewHolder) holder).commentIndentationView.setLevelAndColors(0, verticalBlockColors);
-            ((CommentFullyCollapsedViewHolder) holder).itemView.setPadding(0, 0, 0, 0);
         } else if (holder instanceof PostDetailBaseViewHolder) {
             ((PostDetailBaseViewHolder) holder).mUpvoteButton.setColorFilter(mPostIconAndInfoColor, android.graphics.PorterDuff.Mode.SRC_IN);
             ((PostDetailBaseViewHolder) holder).mScoreTextView.setTextColor(mPostIconAndInfoColor);
@@ -2023,11 +1924,6 @@ public class CommentAndPostRecyclerViewAdapter extends RecyclerView.Adapter<Recy
             } else if (holder instanceof PostDetailLinkViewHolder) {
                 mGlide.clear(((PostDetailLinkViewHolder) holder).mImageView);
             }
-        } else if (holder instanceof LoadMoreChildCommentsViewHolder) {
-            ((LoadMoreChildCommentsViewHolder) holder).itemView.setPadding(0, 0, 0, 0);
-            ViewGroup.LayoutParams params = ((LoadMoreChildCommentsViewHolder) holder).verticalBlock.getLayoutParams();
-            params.width = 0;
-            ((LoadMoreChildCommentsViewHolder) holder).verticalBlock.setLayoutParams(params);
         }
     }
 
@@ -3376,8 +3272,6 @@ public class CommentAndPostRecyclerViewAdapter extends RecyclerView.Adapter<Recy
     }
 
     public class CommentViewHolder extends RecyclerView.ViewHolder {
-        @BindView(R.id.linear_layout_item_comment)
-        LinearLayout linearLayout;
         @BindView(R.id.author_text_view_item_post_comment)
         TextView authorTextView;
         @BindView(R.id.author_flair_text_view_item_post_comment)
@@ -3406,8 +3300,8 @@ public class CommentAndPostRecyclerViewAdapter extends RecyclerView.Adapter<Recy
         ImageView expandButton;
         @BindView(R.id.reply_button_item_post_comment)
         ImageView replyButton;
-        @BindView(R.id.vertical_block_item_post_comment)
+        @BindView(R.id.vertical_block_indentation_item_comment)
-        View verticalBlock;
+        CommentIndentationView commentIndentationView;
         @BindView(R.id.divider_item_comment)
         View commentDivider;
 
@@ -3838,8 +3732,8 @@ public class CommentAndPostRecyclerViewAdapter extends RecyclerView.Adapter<Recy
     }
 
     class CommentFullyCollapsedViewHolder extends RecyclerView.ViewHolder {
-        @BindView(R.id.vertical_block_item_comment_fully_collapsed)
+        @BindView(R.id.vertical_block_indentation_item_comment_fully_collapsed)
-        View verticalBlock;
+        CommentIndentationView commentIndentationView;
         @BindView(R.id.user_name_text_view_item_comment_fully_collapsed)
         TextView usernameTextView;
         @BindView(R.id.score_text_view_item_comment_fully_collapsed)
@@ -3893,8 +3787,8 @@ public class CommentAndPostRecyclerViewAdapter extends RecyclerView.Adapter<Recy
     }
 
     class LoadMoreChildCommentsViewHolder extends RecyclerView.ViewHolder {
-        @BindView(R.id.vertical_block_item_load_more_comments)
+        @BindView(R.id.vertical_block_indentation_item_load_more_comments_placeholder)
-        View verticalBlock;
+        CommentIndentationView commentIndentationView;
         @BindView(R.id.placeholder_text_view_item_load_more_comments)
         TextView placeholderTextView;
         @BindView(R.id.divider_item_load_more_comments_placeholder)

app/src/main/java/ml/docilealligator/infinityforreddit/adapters/CommentsListingRecyclerViewAdapter.java

@@ -10,14 +10,12 @@ import android.text.SpannableStringBuilder;
 import android.text.Spanned;
 import android.text.TextPaint;
 import android.text.style.ClickableSpan;
-import android.text.style.SuperscriptSpan;
 import android.text.util.Linkify;
 import android.view.LayoutInflater;
 import android.view.View;
 import android.view.ViewGroup;
 import android.widget.Button;
 import android.widget.ImageView;
-import android.widget.LinearLayout;
 import android.widget.ProgressBar;
 import android.widget.TextView;
 import android.widget.Toast;
@@ -45,7 +43,6 @@ import io.noties.markwon.ext.strikethrough.StrikethroughPlugin;
 import io.noties.markwon.html.HtmlPlugin;
 import io.noties.markwon.linkify.LinkifyPlugin;
 import io.noties.markwon.movement.MovementMethodPlugin;
-import io.noties.markwon.simple.ext.SimpleExtPlugin;
 import me.saket.bettermovementmethod.BetterLinkMovementMethod;
 import ml.docilealligator.infinityforreddit.NetworkState;
 import ml.docilealligator.infinityforreddit.R;
@@ -59,6 +56,7 @@ import ml.docilealligator.infinityforreddit.bottomsheetfragments.CommentMoreBott
 import ml.docilealligator.infinityforreddit.bottomsheetfragments.UrlMenuBottomSheetFragment;
 import ml.docilealligator.infinityforreddit.comment.Comment;
 import ml.docilealligator.infinityforreddit.customtheme.CustomThemeWrapper;
+import ml.docilealligator.infinityforreddit.customviews.CommentIndentationView;
 import ml.docilealligator.infinityforreddit.utils.APIUtils;
 import ml.docilealligator.infinityforreddit.utils.SharedPreferencesUtils;
 import ml.docilealligator.infinityforreddit.utils.Utils;
@@ -295,8 +293,6 @@ public class CommentsListingRecyclerViewAdapter extends PagedListAdapter<Comment
                         break;
                 }
 
-                ((CommentViewHolder) holder).verticalBlock.setVisibility(View.GONE);
-
                 if (comment.isSaved()) {
                     ((CommentViewHolder) holder).saveButton.setImageResource(R.drawable.ic_bookmark_grey_24dp);
                 } else {
@@ -402,10 +398,8 @@ public class CommentsListingRecyclerViewAdapter extends PagedListAdapter<Comment
     }
 
     public class CommentViewHolder extends RecyclerView.ViewHolder {
-        @BindView(R.id.linear_layout_item_comment)
+        @BindView(R.id.vertical_block_indentation_item_comment)
-        LinearLayout linearLayout;
+        CommentIndentationView commentIndentationView;
-        @BindView(R.id.vertical_block_item_post_comment)
-        View verticalBlock;
         @BindView(R.id.author_text_view_item_post_comment)
         TextView authorTextView;
         @BindView(R.id.author_flair_text_view_item_post_comment)
@@ -461,6 +455,8 @@ public class CommentsListingRecyclerViewAdapter extends PagedListAdapter<Comment
                 constraintSet.applyTo(bottomConstraintLayout);
             }
 
+            commentIndentationView.setVisibility(View.GONE);
+
             if (mShowCommentDivider) {
                 commentDivider.setVisibility(View.VISIBLE);
             }
@@ -520,7 +516,7 @@ public class CommentsListingRecyclerViewAdapter extends PagedListAdapter<Comment
                 }
             });
 
-            linearLayout.setOnClickListener(view -> {
+            itemView.setOnClickListener(view -> {
                 int position = getAdapterPosition();
                 if (position < 0) {
                     return;
@@ -536,7 +532,7 @@ public class CommentsListingRecyclerViewAdapter extends PagedListAdapter<Comment
 
             commentMarkdownView.setOnClickListener(view -> {
                 if (commentMarkdownView.getSelectionStart() == -1 && commentMarkdownView.getSelectionEnd() == -1) {
-                    linearLayout.callOnClick();
+                    itemView.callOnClick();
                 }
             });
 

app/src/main/java/ml/docilealligator/infinityforreddit/customviews/CommentIndentationView.java

@@ -0,0 +1,68 @@
+package ml.docilealligator.infinityforreddit.customviews;
+
+import android.content.Context;
+import android.graphics.Canvas;
+import android.graphics.DashPathEffect;
+import android.graphics.Paint;
+import android.graphics.Path;
+import android.util.AttributeSet;
+import android.widget.LinearLayout;
+
+import androidx.annotation.Nullable;
+
+import java.util.ArrayList;
+
+import ml.docilealligator.infinityforreddit.utils.Utils;
+
+public class CommentIndentationView extends LinearLayout {
+
+    private final Paint paint;
+    private int level;
+    private int[] colors;
+    private ArrayList<Path> paths;
+    private final int spacing;
+    private final int pathWidth;
+
+    public CommentIndentationView(Context context, @Nullable AttributeSet attrs) {
+        super(context, attrs);
+        setWillNotDraw(false);
+        paint = new Paint(Paint.ANTI_ALIAS_FLAG);
+        pathWidth = (int) Utils.convertDpToPixel(2, context);
+        spacing = pathWidth * 6;
+        paint.setStrokeWidth(pathWidth);
+        paint.setStyle(Paint.Style.FILL_AND_STROKE);
+        paint.setPathEffect(new DashPathEffect(new float[] { pathWidth * 2, pathWidth * 2 }, 0));
+        paths = new ArrayList<>();
+    }
+
+    @Override
+    protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
+        super.onLayout(changed, left, top, right, bottom);
+
+        for (int i = 0; i < level; i++) {
+            float startX = spacing * (i + 1) + pathWidth;
+            Path path = new Path();
+            path.moveTo(startX, 0);
+            path.lineTo(startX, getHeight());
+            paths.add(path);
+        }
+    }
+
+    @Override
+    protected void onDraw(Canvas canvas) {
+        super.onDraw(canvas);
+
+        for (int i = 0; i < paths.size(); i++) {
+            paint.setColor(colors[i % 7]);
+            canvas.drawPath(paths.get(i), paint);
+        }
+    }
+
+    public void setLevelAndColors(int level, int[] colors) {
+        paths.clear();
+        this.colors = colors;
+        this.level = level;
+        int indentationSpacing = (int) (level * spacing + pathWidth);
+        setPaddingRelative(indentationSpacing, 0, pathWidth, 0);
+    }
+}

app/src/main/res/layout/item_comment.xml

@@ -8,45 +8,14 @@
     android:background="?attr/cardViewBackgroundColor">
 
     <LinearLayout
-        android:id="@+id/linear_layout_item_comment"
         android:layout_width="match_parent"
         android:layout_height="wrap_content">
 
-        <View
+        <ml.docilealligator.infinityforreddit.customviews.CommentIndentationView
-            android:id="@+id/vertical_block_item_post_comment"
+            android:id="@+id/vertical_block_indentation_item_comment"
-            android:layout_width="0dp"
+            android:layout_width="wrap_content"
             android:layout_height="match_parent" />
 
-        <!--<View
-            android:id="@+id/vertical_block_item_post_comment"
-            android:layout_width="0dp"
-            android:layout_height="match_parent" />
-
-        <View
-            android:id="@+id/vertical_block_item_post_comment"
-            android:layout_width="0dp"
-            android:layout_height="match_parent" />
-
-        <View
-            android:id="@+id/vertical_block_item_post_comment"
-            android:layout_width="0dp"
-            android:layout_height="match_parent" />
-
-        <View
-            android:id="@+id/vertical_block_item_post_comment"
-            android:layout_width="0dp"
-            android:layout_height="match_parent" />
-
-        <View
-            android:id="@+id/vertical_block_item_post_comment"
-            android:layout_width="0dp"
-            android:layout_height="match_parent" />
-
-        <View
-            android:id="@+id/vertical_block_item_post_comment"
-            android:layout_width="0dp"
-            android:layout_height="match_parent" />-->
-
         <LinearLayout
             android:layout_width="match_parent"
             android:layout_height="wrap_content"

app/src/main/res/layout/item_comment_fully_collapsed.xml

@@ -8,9 +8,9 @@
         android:layout_width="match_parent"
         android:layout_height="wrap_content">
 
-        <View
+        <ml.docilealligator.infinityforreddit.customviews.CommentIndentationView
-            android:id="@+id/vertical_block_item_comment_fully_collapsed"
+            android:id="@+id/vertical_block_indentation_item_comment_fully_collapsed"
-            android:layout_width="0dp"
+            android:layout_width="wrap_content"
             android:layout_height="match_parent" />
 
         <TextView

app/src/main/res/layout/item_load_more_comments_placeholder.xml

@@ -9,8 +9,8 @@
         android:layout_width="match_parent"
         android:layout_height="wrap_content">
 
-        <View
+        <ml.docilealligator.infinityforreddit.customviews.CommentIndentationView
-            android:id="@+id/vertical_block_item_load_more_comments"
+            android:id="@+id/vertical_block_indentation_item_load_more_comments_placeholder"
             android:layout_width="wrap_content"
             android:layout_height="match_parent" />