Where developers come to connect, share, build and be inspired.

21

How to draw heart shaped ImageView in Android using PorterDuffXfermode and SVG

6508 views


Custom shape ImageView using PorterDuffXfermode and SVGs

Library https://github.com/MostafaGazar/CustomShapeImageView

Gist https://gist.github.com/MostafaGazar/ee345987fa6c8924d61b

Usage:

<com.meg7.widget.SvgImageView
    android:layout_width="64dp"
    android:layout_height="64dp"
    android:src="@drawable/sample"
    app:svg_raw_resource="@raw/shape_heart"
    android:scaleType="centerCrop" />

Picture

Comments

  • 019f89b0d9242ab3497e8b3b8dfc9b28

    How can i create my own shape ? i mean u did it with coding in SVG file !!!! but how can i ? can i directly convert image to svg file or i have to make the shape ???? babulpatel1309@gmail.com

  • User-avatar

    You can use an image as a mask by: 1- Create new class BitmapMaskedImageView extends BaseImageView and load the image mask you want in getBitmap(int width, int height), https://github.com/MostafaGazar/CustomShapeImageView 2- Read the image file in getMask line: 175 in the attached gist, https://gist.github.com/MostafaGazar/ee345987fa6c8924d61b

    The edges would look rougher most probably so svg or simple canvas draw methods might be a better option.

    You can use Inkscape which is an opensource software for desktops to create/edit svg files.

  • 0_9nf_3q3090maolcuqkhr3l-gqy2a-liuzrrp3ll2ig43dtqrst0775lgv9ualggbcbdgacfjus3n

    hi how can i select single shape just for single imageView not in gridView for example if user want to select start shape then in application just only show star shape imageView no others shape will show can u help me out with this please m waiting for ur suggestions

Add a comment