bitmap - Android - Fill Path with color partially -


i trying draw heart shaped canvas using path in android. code follows :

 @override     protected void ondraw(canvas canvas) {         super.ondraw(canvas);           // fill canvas background color         canvas.drawcolor(color.white);        // paint.setshader(null);          // defining of  heart path starts         path.moveto(left + width / 2, top + height / 4); // starting point         // create cubic bezier cubic left path         path.cubicto(left+width/5,top,                 left+width/4,top+4*height/5,                 left+width/2, top+height);         // right bezier cubic path         path.cubicto(left + 3 * width / 4, top + 4 * height / 5,                 left + 4 * width / 5, top,                 left + width / 2, top + height / 4);           paint.setshader(new lineargradient(0, canvas.getheight()/4, canvas.getwidth(), canvas.getheight()/4, new int[]{color.red, color.yellow, color.green}, new float[]{0, 0.6f, 1}, shader.tilemode.clamp));          canvas.drawpath(path, paint);          heart_outline_paint.setcolor(getresources().getcolor(r.color.heart_outline_color)); // change boundary color         heart_outline_paint.setstrokewidth(4);         heart_outline_paint.setstyle(paint.style.stroke);         canvas.drawpath(path, heart_outline_paint);        } 

i able draw heart without issue , able fill color inside heart using fill option in paint. should able fill heart dynamically according data , cannot filled time. have achieved far follows :

heart shape filled color

i have made extensive search , came across lot of things similar this. of includes :

  1. android fill in part of path?
  2. filling circle gradually bottom top android

i came across concept of converting canvas bitmap , filling color inside bitmap using flood fill algorithm lets users fill colors inside bitmap. however, not want bitmap fill color while touching inside heart fill while button click action.

i thought filling circle gradually bottom top android give me makes use of circle , not well-versed in canvas makes me weak in adapting circle code such shape.

if has ideas or insights on how achieve this, helpful. cheers. in advance.

p.s : tried tricks using setshader in paint nothing give me want.

edit :

i stumbled upon idea of drawing rectangle on heart color same background of canvas half filled !! still working on idea , not sure how accurate gonna me. if has better idea, you're welcome.

enter image description here

you use bitmap masking partially filled heart. ideally here use 1 bitmap mask other.

in case have filled rectangle in canvas , have have heart shape in new bitmap act mask. dynamically change filling of heart changing height of background rectangle.

refer this: https://stackoverflow.com/a/33483600/4747587. contains implementation of partially filling star. idea same.


Comments

Popular posts from this blog

java - Date formats difference between yyyy-MM-dd'T'HH:mm:ss and yyyy-MM-dd'T'HH:mm:ssXXX -

c# - Get rid of xmlns attribute when adding node to existing xml -