I am trying to show a gridview of the canvas images that were drawn in the previous screen. I have a set of different views which is drawn in the first screen and those views are subjected to change, those canvas will be re drawn according to the user's actions. I have 5 heart shaped canvas views and I am using different views for every heart meaning that I am not using a same class to draw the five hearts, rather I am using 5 different class for 5 different hearts. These hearts will be filled with color on user click. In the next page, I am trying to just view the hearts that were drawn in the previous page and there is no action involved here, in the sense that this page is solely for the purpose of viewing. THIS PAGE CAN CONTAIN N NUMBER OF HEARTS BUT THE PREVIOUS PAGE WILL HAVE ONLY 5 HEARTS AT ANY INSTANT. For this purpose, I am using a single view in the display page to display all the hearts. But all I get is the last drawn heart and all other previous hearts are just getting overriden.
My idea of filling the heart is drawing a rectangle over it and clipping the path.
My onDraw is :
path.moveTo(left_x_moveto, left_y_moveto);
path.cubicTo(left_x1,left_y1,left_x2,left_y2,left_x3,left_y3);
path.moveTo(left_x_moveto, left_y_moveto);
path.cubicTo(right_x1,right_y1,right_x2,right_y2,right_x3,right_y3);
this.setDrawingCacheEnabled(true);
rect = new Rect((int)(canvas.getWidth()*.10),(int)(canvas.getHeight()*filled_amount),(int) canvas.getWidth(), (int) canvas.getHeight());
canvas.clipPath(path);
paint.setColor(Color.WHITE);
paint.setStyle(Paint.Style.FILL);
canvas.drawPath(path, paint);
canvas.drawRect(rect, rect_paint);
heart_outline_paint.setColor(getResources().getColor(R.color.heart_outline_color)); // Change the boundary color
heart_outline_paint.setStrokeWidth(15);
heart_outline_paint.setStyle(Paint.Style.STROKE);
canvas.drawPath(path, heart_outline_paint);
The part where I add my views into an arraylist of views :
public static ArrayList<View> heart_views = new ArrayList<View>();
for(int i=0;i<dbHelper.getHeartPercentagesForSummary().size();i++)
{
SummaryHeartShape.filled_amount = .90 - (dbHelper.getHeartPercentagesForSummary().get(i)*0.008);
SummaryHeartShape summary_heart_shape = new SummaryHeartShape(getActivity());
summary_heart_shape.invalidate();
heart_views.add(summary_heart_shape);
}
I presume that onDraw()
will be called when I create an instance of the SummaryHeartShape
class.
So as you can see, everytime I am filling the rectangle to a different height which is given by SummaryHeartShape.filled_amount
and this static variable is assigned in the onDraw of the rect as
rect = new Rect((int)(canvas.getWidth()*.10),(int)(canvas.getHeight()*filled_amount),(int) canvas.getWidth(), (int) canvas.getHeight());
So this basically means that the rect will be drawn according to the height that I give and as it differs every time, I should be receiving a canvas view with that rectangle height but every time I am getting the same rectangle with same height.
My Screen where user can fill the heart - Filling Heart
My Screen where user can view the filled heart - Summary of Hearts
As you can clearly see that the hearts in the first page are filled right but the hearts in the second page are just showing the last filled hearts.
I have checked the values that gets passed to SummaryHeartShape.filled_amount
, it is different all the time but even though my hearts are broken !!!!
Can someone please help me in fixing my heart ? Please feel free to ask any doubts or if I want to make this more clear.