Skip to content

Add Padding between border and the image #133

New issue
New issue
Closed
Closed
Add Padding between border and the image#133
Labels
question
@b-runo

Description

@b-runo
b-runo
opened on Jun 8, 2016 · edited by b-runo

How to create a padding between the border and the image?
Like this image

Activity

b-runo
changed the title [-]Padding[/-] [+]Add Padding between border and the image[/+] on Jun 8, 2016
iamtodor

iamtodor commented on Jun 12, 2016

@iamtodor
iamtodor
on Jun 12, 2016

It could be useful
+1

hdodenhof
added
question
on Jun 12, 2016
hdodenhof

hdodenhof commented on Jun 12, 2016

@hdodenhof
hdodenhof
on Jun 12, 2016
Owner

There is no native support for this, but you should be able to achieve it by subclassing CircleImageView and overriding onDraw with some custom behavior while still calling super.onDraw(). An easier way would probably be wrapping the CircleImageView in a FrameLayout which draws the border and has some padding.

b-runo

b-runo commented on Jun 13, 2016

@b-runo
b-runo
on Jun 13, 2016
Author

I know I'm already asking a lot but have a sample code 😅.

hdodenhof

hdodenhof commented on Jun 20, 2016

@hdodenhof
hdodenhof
on Jun 20, 2016
Owner

In your layout:

<FrameLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:padding="4dp"
    android:background="@drawable/circle_background">

    <de.hdodenhof.circleimageview.CircleImageView
        android:layout_width="96dp"
        android:layout_height="96dp"
        android:src="@drawable/foobar"/>

</FrameLayout>

And drawable/circle_background.xml:

<?xml version="1.0" encoding="utf-8"?>
<shape
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">

    <stroke
        android:width="1dp"
        android:color="#FFFFFF"/>

</shape>
samitparadedocs

samitparadedocs commented on Jun 22, 2016

@samitparadedocs
samitparadedocs
on Jun 22, 2016

Great work.
Thank you.

b-runo

b-runo commented on Jun 23, 2016

@b-runo
b-runo
on Jun 23, 2016
Author

Thanks.

b-runo
closed this as completedon Jun 23, 2016
hdodenhof
mentioned this on Aug 29, 2017
hdodenhof
mentioned this on Sep 29, 2017
hdodenhof
mentioned this on Aug 14, 2018
nastyanick
added a commit that references this issue on Sep 21, 2018

Updated CircularImageView to have gap between image and border (hdode…

86d5943
hdodenhof
mentioned this on Mar 10, 2020
JagadishaIncture
mentioned this on Apr 12, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    question

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

      Development

      No branches or pull requests

        Participants

        @hdodenhof@iamtodor@b-runo@samitparadedocs

        Issue actions
          Add Padding between border and the image · Issue #133 · hdodenhof/CircleImageView