Maher Ismaail
Maher Ismaail

Reputation: 1663

android.support.v4.widget.CircleImageView does not work

when I try to use : android.support.v4.widget.CircleImageView

        <android.support.v4.widget.CircleImageView
                android:id="@+id/picture"
                android:layout_width="100dp"
                android:layout_height="100dp"
                android:layout_gravity="center_vertical"
                android:src="@drawable/ic_bg" />

it makes my app crash

how to support new Material Design Widget CircleImageView

is there any example use this new widget

Logcat

  java.lang.RuntimeException: Unable to start activity ComponentInfo{com.vogella.android.recyclerview/com.vogella.android.recyclerview.MainActivity}: android.view.InflateException: Binary XML file line #9: Error inflating class android.support.v4.widget.CircleImageView
        at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2255)
        at android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:2309)
        at android.app.ActivityThread.access$700(ActivityThread.java:157)
        at android.app.ActivityThread$H.handleMessage(ActivityThread.java:1289)
        at android.os.Handler.dispatchMessage(Handler.java:99)
        at android.os.Looper.loop(Looper.java:176)
        at android.app.ActivityThread.main(ActivityThread.java:5317)
        at java.lang.reflect.Method.invokeNative(Native Method)
        at java.lang.reflect.Method.invoke(Method.java:511)
        at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:1102)
        at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:869)
        at dalvik.system.NativeStart.main(Native Method)
 Caused by: android.view.InflateException: Binary XML file line #9: Error inflating class android.support.v4.widget.CircleImageView
        at

Upvotes: 49

Views: 87966

Answers (8)

Samer Kasseb
Samer Kasseb

Reputation: 192

Just Rebuild the project

  • Build ===> Clear Project
  • Build ===> Rebuild Project

and if not works
File ===> Invaildate Cahses / Restart



Then it will Work.

Upvotes: 3

Yamini
Yamini

Reputation: 802

dependency:

compile 'de.hdodenhof:circleimageview:2.0.0'

code:

<de.hdodenhof.circleimageview.CircleImageView
               android:id="@+id/iv_circle"
               android:layout_width="96dp"
               android:layout_height="96dp"
               android:layout_alignParentLeft="true"
               android:layout_alignParentTop="true"
               android:src="@drawable/thumb"
               app:border_color="@color/white"
               app:border_width="2dp" />

Upvotes: 1

Chirag Patel
Chirag Patel

Reputation: 569

Simple add: Here Change latest Library version 2.0.0 to 2.2.0

dependencies {

 implementation 'de.hdodenhof:circleimageview:2.2.0'

}

Upvotes: 6

Maher Ismaail
Maher Ismaail

Reputation: 1663

I found a replacement for android.support.v4.widget.CircleImageView.

<de.hdodenhof.circleimageview.CircleImageView
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/meal_image_order"
android:layout_width="96dp"
android:layout_height="96dp"
android:src="@drawable/menu1"
app:civ_border_width="2dp"
app:civ_border_color="@color/white"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true" />

Library link: https://github.com/hdodenhof/CircleImageView

Upvotes: 49

Vikash Sharma
Vikash Sharma

Reputation: 539

If you want to do it in a native style just use this snippet

            <android.support.v7.widget.CardView
                android:id="@+id/view2"
                android:layout_width="45dp"
                android:layout_height="45dp"
                android:background="#ffffff"
                android:shape="ring"
                app:cardCornerRadius="23dp">

                <ImageView
                    android:id="@+id/profile_img_post"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:layout_alignParentTop="true"
                    android:layout_centerHorizontal="true"
                    android:scaleType="centerCrop"
                    android:src="@drawable/test_img"></ImageView>
            </android.support.v7.widget.CardView>

Upvotes: 10

ozma
ozma

Reputation: 1803

This is what worked for me

xml layout:

  <de.hdodenhof.circleimageview.CircleImageView
            android:id="@+id/picid"
            android:layout_width="270dp"
            android:layout_height="270dp"
            android:src="@drawable/avatar_small"
            android:layout_marginTop="25dp"
            />

Java code:

CircleImageView pic = (de.hdodenhof.circleimageview.CircleImageView)rootView.findViewById(R.id.picid);

Upvotes: 5

Xaver Kapeller
Xaver Kapeller

Reputation: 49817

The CircleImageView is a private class of the support library and cannot be used. But it is easy to create this effect yourself without the CircleImageView. You just need to define a <shape /> drawable with a transparent circle in the middle similar to this:

<shape
    android:innerRadius="0dp"
    android:shape="ring"
    android:thicknessRatio="1"
    android:useLevel="false" >

    <solid android:color="@android:color/transparent" />

    <stroke
        android:width="100dp"
        android:color="#FFFFFFFF" />
</shape>

After that just combine the image you want to display in the ImageView with the <shape /> drawable from above in a LayerList like this:

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/your_image" />
    <item android:drawable="@drawable/circle" />
</layer-list>

If the image you want to display is dynamic then you can create the LayerList programmatically!

Upvotes: 55

natario
natario

Reputation: 25194

CircleImageView is a private class from v4, so basically you can't use it. It is used internally for rendering the progress circle in a SwipeRefreshLayout, but is not meant to be inflated by yourself.

See here for reference.

Upvotes: 19

Related Questions