Replace CircleImageView with ShapeableImageView

app/build.gradle

@@ -246,8 +246,6 @@ dependencies {
     implementation "com.github.lisawray.groupie:groupie:${groupieVersion}"
     implementation "com.github.lisawray.groupie:groupie-viewbinding:${groupieVersion}"
 
-    // Circular ImageView
-    implementation "de.hdodenhof:circleimageview:3.1.0"
     // Image loading
     //noinspection GradleDependency --> 2.8 is the last version, not 2.71828!
     implementation "com.squareup.picasso:picasso:2.8"

app/src/main/java/org/schabi/newpipe/about/AboutActivity.kt

@@ -117,10 +117,6 @@ class AboutActivity : AppCompatActivity() {
                 "AndroidX", "2005 - 2011", "The Android Open Source Project",
                 "https://developer.android.com/jetpack", StandardLicenses.APACHE2
             ),
-            SoftwareComponent(
-                "CircleImageView", "2014 - 2020", "Henning Dodenhof",
-                "https://github.com/hdodenhof/CircleImageView", StandardLicenses.APACHE2
-            ),
             SoftwareComponent(
                 "ExoPlayer", "2014 - 2020", "Google, Inc.",
                 "https://github.com/google/ExoPlayer", StandardLicenses.APACHE2

app/src/main/java/org/schabi/newpipe/fragments/list/playlist/PlaylistFragment.java

@@ -6,6 +6,7 @@ import static org.schabi.newpipe.ktx.ViewUtils.animateHideRecyclerViewAllowingSc
 
 import android.app.Activity;
 import android.content.Context;
+import android.content.res.ColorStateList;
 import android.os.Bundle;
 import android.text.TextUtils;
 import android.util.Log;
@@ -19,6 +20,10 @@ import android.view.ViewGroup;
 import androidx.annotation.NonNull;
 import androidx.annotation.Nullable;
 import androidx.appcompat.content.res.AppCompatResources;
+import androidx.core.content.ContextCompat;
+
+import com.google.android.material.shape.CornerFamily;
+import com.google.android.material.shape.ShapeAppearanceModel;
 
 import org.reactivestreams.Subscriber;
 import org.reactivestreams.Subscription;
@@ -328,9 +333,14 @@ public class PlaylistFragment extends BaseListInfoFragment<PlaylistInfo> {
                 && (YoutubeParsingHelper.isYoutubeMixId(result.getId())
                 || YoutubeParsingHelper.isYoutubeMusicMixId(result.getId()))) {
             // this is an auto-generated playlist (e.g. Youtube mix), so a radio is shown
-            headerBinding.uploaderAvatarView.setDisableCircularTransformation(true);
+            final ShapeAppearanceModel model = ShapeAppearanceModel.builder()
-            headerBinding.uploaderAvatarView.setBorderColor(
+                    .setAllCorners(CornerFamily.ROUNDED, 0f)
-                    getResources().getColor(R.color.transparent_background_color));
+                    .build(); // this turns the image back into a square
+            headerBinding.uploaderAvatarView.setShapeAppearanceModel(model);
+            headerBinding.uploaderAvatarView.setStrokeColor(
+                    ColorStateList.valueOf(ContextCompat.getColor(
+                            requireContext(), R.color.transparent_background_color))
+            );
             headerBinding.uploaderAvatarView.setImageDrawable(
                     AppCompatResources.getDrawable(requireContext(),
                     R.drawable.ic_radio)

app/src/main/java/org/schabi/newpipe/info_list/holder/ChannelMiniInfoItemHolder.java

@@ -1,6 +1,7 @@
 package org.schabi.newpipe.info_list.holder;
 
 import android.view.ViewGroup;
+import android.widget.ImageView;
 import android.widget.TextView;
 
 import org.schabi.newpipe.R;
@@ -11,10 +12,8 @@ import org.schabi.newpipe.local.history.HistoryRecordManager;
 import org.schabi.newpipe.util.PicassoHelper;
 import org.schabi.newpipe.util.Localization;
 
-import de.hdodenhof.circleimageview.CircleImageView;
-
 public class ChannelMiniInfoItemHolder extends InfoItemHolder {
-    public final CircleImageView itemThumbnailView;
+    public final ImageView itemThumbnailView;
     public final TextView itemTitleView;
     private final TextView itemAdditionalDetailView;
 

app/src/main/java/org/schabi/newpipe/info_list/holder/CommentsMiniInfoItemHolder.java

@@ -7,6 +7,7 @@ import android.text.util.Linkify;
 import android.util.Log;
 import android.view.View;
 import android.view.ViewGroup;
+import android.widget.ImageView;
 import android.widget.RelativeLayout;
 import android.widget.TextView;
 
@@ -28,8 +29,6 @@ import org.schabi.newpipe.util.PicassoHelper;
 
 import java.util.regex.Matcher;
 
-import de.hdodenhof.circleimageview.CircleImageView;
-
 public class CommentsMiniInfoItemHolder extends InfoItemHolder {
     private static final String TAG = "CommentsMiniIIHolder";
 
@@ -40,7 +39,7 @@ public class CommentsMiniInfoItemHolder extends InfoItemHolder {
     private final int commentVerticalPadding;
 
     private final RelativeLayout itemRoot;
-    public final CircleImageView itemThumbnailView;
+    public final ImageView itemThumbnailView;
     private final TextView itemContentView;
     private final TextView itemLikesCountView;
     private final TextView itemPublishedTime;

app/src/main/java/org/schabi/newpipe/settings/SelectChannelFragment.java

@@ -5,6 +5,7 @@ import android.os.Bundle;
 import android.view.LayoutInflater;
 import android.view.View;
 import android.view.ViewGroup;
+import android.widget.ImageView;
 import android.widget.ProgressBar;
 import android.widget.TextView;
 
@@ -24,7 +25,6 @@ import org.schabi.newpipe.util.ThemeHelper;
 import java.util.List;
 import java.util.Vector;
 
-import de.hdodenhof.circleimageview.CircleImageView;
 import io.reactivex.rxjava3.android.schedulers.AndroidSchedulers;
 import io.reactivex.rxjava3.core.Observer;
 import io.reactivex.rxjava3.disposables.Disposable;
@@ -200,7 +200,7 @@ public class SelectChannelFragment extends DialogFragment {
 
         public class SelectChannelItemHolder extends RecyclerView.ViewHolder {
             public final View view;
-            final CircleImageView thumbnailView;
+            final ImageView thumbnailView;
             final TextView titleView;
             SelectChannelItemHolder(final View v) {
                 super(v);

app/src/main/res/layout-large-land/fragment_video_detail.xml

@@ -266,14 +266,15 @@
                                     android:layout_width="wrap_content"
                                     android:layout_height="wrap_content">
 
-                                    <de.hdodenhof.circleimageview.CircleImageView
+                                    <com.google.android.material.imageview.ShapeableImageView
                                         android:id="@+id/detail_uploader_thumbnail_view"
                                         android:layout_width="@dimen/video_item_detail_uploader_image_size"
                                         android:layout_height="@dimen/video_item_detail_uploader_image_size"
                                         android:contentDescription="@string/detail_uploader_thumbnail_view_description"
-                                        android:src="@drawable/buddy" />
+                                        android:src="@drawable/buddy"
+                                        app:shapeAppearance="@style/CircularImageView" />
 
-                                    <de.hdodenhof.circleimageview.CircleImageView
+                                    <com.google.android.material.imageview.ShapeableImageView
                                         android:id="@+id/detail_sub_channel_thumbnail_view"
                                         android:layout_width="@dimen/video_item_detail_sub_channel_image_size"
                                         android:layout_height="@dimen/video_item_detail_sub_channel_image_size"
@@ -281,6 +282,7 @@
                                         android:contentDescription="@string/detail_sub_channel_thumbnail_view_description"
                                         android:src="@drawable/buddy"
                                         android:visibility="gone"
+                                        app:shapeAppearance="@style/CircularImageView"
                                         tools:visibility="visible" />
 
                                 </FrameLayout>

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

@@ -28,23 +28,27 @@
             android:layout_marginLeft="8dp"
             android:layout_marginTop="50dp">
 
-            <de.hdodenhof.circleimageview.CircleImageView
+            <com.google.android.material.imageview.ShapeableImageView
                 android:id="@+id/channel_avatar_view"
                 android:layout_width="@dimen/channel_avatar_size"
                 android:layout_height="@dimen/channel_avatar_size"
+                android:padding="1dp"
                 android:src="@drawable/buddy"
-                app:civ_border_color="#ffffff"
+                app:shapeAppearance="@style/CircularImageView"
-                app:civ_border_width="2dp" />
+                app:strokeColor="#ffffff"
+                app:strokeWidth="2dp" />
 
-            <de.hdodenhof.circleimageview.CircleImageView
+            <com.google.android.material.imageview.ShapeableImageView
                 android:id="@+id/sub_channel_avatar_view"
                 android:layout_width="@dimen/sub_channel_avatar_size"
                 android:layout_height="@dimen/sub_channel_avatar_size"
                 android:layout_gravity="bottom|right"
+                android:padding="1dp"
                 android:src="@drawable/buddy"
                 android:visibility="gone"
-                app:civ_border_color="#ffffff"
+                app:shapeAppearance="@style/CircularImageView"
-                app:civ_border_width="2dp"
+                app:strokeColor="#ffffff"
+                app:strokeWidth="2dp"
                 tools:ignore="RtlHardcoded"
                 tools:visibility="visible" />
         </FrameLayout>

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

@@ -253,14 +253,15 @@
                                 android:layout_width="wrap_content"
                                 android:layout_height="wrap_content">
 
-                                <de.hdodenhof.circleimageview.CircleImageView
+                                <com.google.android.material.imageview.ShapeableImageView
                                     android:id="@+id/detail_uploader_thumbnail_view"
                                     android:layout_width="@dimen/video_item_detail_uploader_image_size"
                                     android:layout_height="@dimen/video_item_detail_uploader_image_size"
                                     android:contentDescription="@string/detail_uploader_thumbnail_view_description"
-                                    android:src="@drawable/buddy" />
+                                    android:src="@drawable/buddy"
+                                    app:shapeAppearance="@style/CircularImageView" />
 
-                                <de.hdodenhof.circleimageview.CircleImageView
+                                <com.google.android.material.imageview.ShapeableImageView
                                     android:id="@+id/detail_sub_channel_thumbnail_view"
                                     android:layout_width="@dimen/video_item_detail_sub_channel_image_size"
                                     android:layout_height="@dimen/video_item_detail_sub_channel_image_size"
@@ -268,6 +269,7 @@
                                     android:contentDescription="@string/detail_sub_channel_thumbnail_view_description"
                                     android:src="@drawable/buddy"
                                     android:visibility="gone"
+                                    app:shapeAppearance="@style/CircularImageView"
                                     tools:ignore="RtlHardcoded"
                                     tools:visibility="visible" />
 

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

@@ -1,5 +1,6 @@
 <?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:id="@+id/itemRoot"
     android:layout_width="match_parent"
@@ -10,7 +11,7 @@
     android:minWidth="@dimen/channel_item_grid_min_width"
     android:padding="@dimen/channel_item_grid_padding">
 
-    <de.hdodenhof.circleimageview.CircleImageView
+    <com.google.android.material.imageview.ShapeableImageView
         android:id="@+id/itemThumbnailView"
         android:layout_width="@dimen/channel_item_grid_thumbnail_image_size"
         android:layout_height="@dimen/channel_item_grid_thumbnail_image_size"
@@ -18,6 +19,7 @@
         android:layout_margin="2dp"
         android:contentDescription="@string/detail_uploader_thumbnail_view_description"
         android:src="@drawable/buddy_channel_item"
+        app:shapeAppearance="@style/CircularImageView"
         tools:ignore="RtlHardcoded" />
 
     <TextView

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

@@ -58,17 +58,19 @@
         app:layout_constraintTop_toBottomOf="@+id/itemChannelDescriptionView"
         tools:text="10M subscribers • 1000 videos" />
 
-    <de.hdodenhof.circleimageview.CircleImageView
+    <com.google.android.material.imageview.ShapeableImageView
         android:id="@+id/itemThumbnailView"
-        android:layout_width="@dimen/video_item_search_thumbnail_image_width"
+        android:layout_width="@dimen/video_item_search_avatar_image_width"
-        android:layout_height="@dimen/video_item_search_thumbnail_image_height"
+        android:layout_height="@dimen/video_item_search_avatar_image_height"
-        android:layout_marginRight="@dimen/video_item_search_image_right_margin"
+        android:layout_marginLeft="@dimen/video_item_search_avatar_left_margin"
+        android:layout_marginRight="@dimen/video_item_search_avatar_right_margin"
         android:src="@drawable/buddy"
         app:layout_constraintBottom_toBottomOf="parent"
         app:layout_constraintEnd_toStartOf="@+id/itemTitleView"
         app:layout_constraintHorizontal_bias="0.5"
         app:layout_constraintStart_toStartOf="parent"
         app:layout_constraintTop_toTopOf="parent"
+        app:shapeAppearance="@style/CircularImageView"
         tools:ignore="RtlHardcoded" />
 
 </androidx.constraintlayout.widget.ConstraintLayout>

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

@@ -1,5 +1,6 @@
 <?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:id="@+id/itemRoot"
     android:layout_width="match_parent"
@@ -9,13 +10,15 @@
     android:focusable="true"
     android:padding="@dimen/video_item_search_padding">
 
-    <de.hdodenhof.circleimageview.CircleImageView
+    <com.google.android.material.imageview.ShapeableImageView
         android:id="@+id/itemThumbnailView"
-        android:layout_width="48dp"
+        android:layout_width="42dp"
         android:layout_height="42dp"
         android:layout_centerVertical="true"
-        android:layout_marginRight="12dp"
+        android:layout_marginStart="3dp"
+        android:layout_marginRight="15dp"
         android:src="@drawable/buddy_channel_item"
+        app:shapeAppearance="@style/CircularImageView"
         tools:ignore="RtlHardcoded" />
 
     <TextView

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

@@ -10,16 +10,18 @@
     android:focusable="true"
     android:padding="@dimen/comments_vertical_padding">
 
-    <de.hdodenhof.circleimageview.CircleImageView
+    <com.google.android.material.imageview.ShapeableImageView
         android:id="@+id/itemThumbnailView"
-        android:layout_width="48dp"
+        android:layout_width="42dp"
         android:layout_height="42dp"
         android:layout_alignParentStart="true"
         android:layout_alignParentLeft="true"
         android:layout_alignParentTop="true"
-        android:layout_marginRight="@dimen/video_item_search_image_right_margin"
+        android:layout_marginLeft="3dp"
+        android:layout_marginRight="@dimen/comment_item_avatar_right_margin"
         android:focusable="false"
         android:src="@drawable/buddy"
+        app:shapeAppearance="@style/CircularImageView"
         tools:ignore="RtlHardcoded" />
 
     <ImageView

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

@@ -10,13 +10,15 @@
     android:focusable="true"
     android:padding="@dimen/video_item_search_padding">
 
-    <de.hdodenhof.circleimageview.CircleImageView
+    <com.google.android.material.imageview.ShapeableImageView
         android:id="@+id/itemThumbnailView"
-        android:layout_width="48dp"
+        android:layout_width="42dp"
         android:layout_height="42dp"
         android:layout_centerVertical="true"
-        android:layout_marginRight="12dp"
+        android:layout_marginStart="3dp"
+        android:layout_marginRight="15dp"
         android:src="@drawable/buddy_channel_item"
+        app:shapeAppearance="@style/CircularImageView"
         tools:ignore="RtlHardcoded" />
 
 

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

@@ -17,10 +17,11 @@
         android:orientation="vertical"
         android:padding="4dp">
 
-        <de.hdodenhof.circleimageview.CircleImageView
+        <com.google.android.material.imageview.ShapeableImageView
             android:id="@+id/thumbnail_view"
             android:layout_width="48dp"
             android:layout_height="48dp"
+            app:shapeAppearance="@style/CircularImageView"
             tools:src="@drawable/buddy_channel_item" />
 
         <org.schabi.newpipe.views.NewPipeTextView

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

@@ -38,15 +38,17 @@
             tools:ignore="RtlHardcoded"
             tools:visibility="visible">
 
-            <de.hdodenhof.circleimageview.CircleImageView
+            <com.google.android.material.imageview.ShapeableImageView
                 android:id="@+id/uploader_avatar_view"
                 android:layout_width="@dimen/playlist_detail_uploader_image_size"
                 android:layout_height="@dimen/playlist_detail_uploader_image_size"
                 android:layout_alignParentLeft="true"
                 android:layout_centerVertical="true"
+                android:padding="0.7dp"
                 android:src="@drawable/buddy"
-                app:civ_border_color="#ffffff"
+                app:shapeAppearance="@style/CircularImageView"
-                app:civ_border_width="1dp" />
+                app:strokeColor="#ffffff"
+                app:strokeWidth="1dp" />
 
             <org.schabi.newpipe.views.NewPipeTextView
                 android:id="@+id/uploader_name"

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

@@ -1,5 +1,6 @@
 <?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="wrap_content"
@@ -9,15 +10,17 @@
     android:orientation="vertical"
     android:padding="5dp">
 
-    <de.hdodenhof.circleimageview.CircleImageView
+    <com.google.android.material.imageview.ShapeableImageView
         android:id="@+id/itemThumbnailView"
-        android:layout_width="48dp"
+        android:layout_width="42dp"
         android:layout_height="42dp"
         android:layout_alignParentStart="true"
         android:layout_alignParentLeft="true"
         android:layout_alignParentTop="true"
-        android:layout_marginRight="5dp"
+        android:layout_marginStart="3dp"
+        android:layout_marginRight="8dp"
         android:src="@drawable/buddy"
+        app:shapeAppearance="@style/CircularImageView"
         tools:ignore="RtlHardcoded" />
 
     <org.schabi.newpipe.views.NewPipeTextView

app/src/main/res/values-land/dimens.xml

@@ -12,6 +12,10 @@
     <!-- 16 / 9 ratio-->
     <dimen name="video_item_search_thumbnail_image_width">142dp</dimen>
     <dimen name="video_item_search_thumbnail_image_height">80dp</dimen>
+    <dimen name="video_item_search_avatar_image_width">80dp</dimen>
+    <dimen name="video_item_search_avatar_image_height">80dp</dimen>
+    <dimen name="video_item_search_avatar_left_margin">31dp</dimen>
+    <dimen name="video_item_search_avatar_right_margin">41dp</dimen>
     <!-- Calculated: 2*video_item_search_padding + video_item_search_thumbnail_image_height -->
     <dimen name="video_item_search_height">106dp</dimen>
     <!-- Paddings & Margins -->
@@ -50,4 +54,6 @@
     <dimen name="file_picker_items_text_size">16sp</dimen>
 
     <dimen name="search_suggestion_text_size">14sp</dimen>
+
+    <dimen name="comment_item_avatar_right_margin">13dp</dimen>
 </resources>

app/src/main/res/values-sw600dp-land/dimens.xml

@@ -10,8 +10,9 @@
     <dimen name="video_item_search_upload_date_text_size">12sp</dimen>
     <!-- Paddings & Margins -->
     <dimen name="video_item_search_image_right_margin">6dp</dimen>
+    <dimen name="video_item_search_avatar_right_margin">33dp</dimen>
     <dimen name="video_item_search_duration_vertical_padding">1sp</dimen>
     <dimen name="video_item_search_duration_horizontal_padding">5sp</dimen>
     <!-- Miscellaneous -->
-
+    <dimen name="comment_item_avatar_right_margin">9dp</dimen>
 </resources>

app/src/main/res/values/dimens.xml

@@ -23,6 +23,10 @@
     <!-- 16 / 9 ratio-->
     <dimen name="video_item_search_thumbnail_image_width">124dp</dimen>
     <dimen name="video_item_search_thumbnail_image_height">70dp</dimen>
+    <dimen name="video_item_search_avatar_image_width">70dp</dimen>
+    <dimen name="video_item_search_avatar_image_height">70dp</dimen>
+    <dimen name="video_item_search_avatar_left_margin">27dp</dimen>
+    <dimen name="video_item_search_avatar_right_margin">33dp</dimen>
     <dimen name="video_item_grid_thumbnail_image_width">164dp</dimen>
     <dimen name="video_item_grid_thumbnail_image_height">92dp</dimen>
 
@@ -52,6 +56,7 @@
     <!-- Miscellaneous -->
     <dimen name="popup_default_width">180dp</dimen>
     <dimen name="popup_minimum_width">150dp</dimen>
+    <dimen name="comment_item_avatar_right_margin">9dp</dimen>
 
     <dimen name="subscription_import_export_title_height">32dp</dimen>
     <dimen name="subscription_import_export_item_height">42dp</dimen>

app/src/main/res/values/styles_misc.xml

@@ -102,4 +102,9 @@
         <item name="colorAccent">?attr/toolbarSearchColor</item>
     </style>
 
+    <style name="CircularImageView">
+        <item name="cornerFamily">rounded</item>
+        <item name="cornerSize">50%</item>
+    </style>
+
 </resources>