Maduro
Maduro

Reputation: 725

How to display full image in CircleImageView?

I tried so many different thing such as scaleType and it is not supported by this library. implementation 'de.hdodenhof:circleimageview:3.1.0'

There are other solutions but at the end say that is not supported by this library.

Any idea?

enter image description here

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="wrap_content"
android:orientation="vertical"
android:layout_marginTop="4dp"
android:layout_height="wrap_content">


<de.hdodenhof.circleimageview.CircleImageView
    android:id="@+id/category_image"
    android:layout_width="65dp"
    android:layout_height="65dp"
    android:layout_gravity="center"
    android:src="@drawable/noticias"
    app:civ_border_color="@color/black"
    app:civ_border_width="1dp"
    app:civ_circle_background_color="@color/white"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

Upvotes: 1

Views: 305

Answers (1)

Zeero0
Zeero0

Reputation: 2790

From the developer of CircleImageView

While I do understand the requirement for supporting FIT_CENTER in case of e.g. company logos, I don't think the result is actually desirable. You would have to know the background color of each logo and set that as the background color for the circle to not have a hard visual break inside the circle. If you still want to go down that road, you can always wrap your BitmapDrawable inside a LayerDrawable with a ColorDrawable as base layer and proper insets on the BitmapDrawable on top.

Discussion on this issue - here

BTW scaleType is supported in official ShapeableImageView

Add Material Dependency

implementation 'com.google.android.material:material:1.2.0'

Add below to your XML layout:

<com.google.android.material.imageview.ShapeableImageView
    android:id="@+id/circle"
    android:layout_width="300dp"
    android:layout_height="300dp"
    android:layout_gravity="center"
    android:layout_margin="10dp"
    android:background="#000"
    android:padding="8dp"
    android:scaleType="centerInside"
    app:shapeAppearanceOverlay="@style/circle"
    app:srcCompat="@drawable/image_loading"
    app:strokeColor="#00BA00"
    app:strokeWidth="5dp" />

and this to your styles.xml

<style name="circle">
    <item name="cornerSize">50%</item>
    <item name="cornerFamily">rounded</item>
</style>

enter image description here

Upvotes: 1

Related Questions