I've created a line chart by making a custom view....

# android

[Paul Dhaliwal]

I've created a line chart by making a custom view. I want to be able to animate the line in the chart and the axis lines and value labels seperately. Does this require creating a custom viewgroup which contains custom views for the plotted line, axis lines, and value labels seperately? Or is it better to do this all in one custom view? As an example of how I'd like to be able to control animations I'm looking at the Google Fit App, which has custom animations for the different elements in its graphs. Thanks!!

[Pablichjenkov]

I would do it in a CustomView. Taking the ViewGroup route with each axis as a View can consume RAM considerably, considering View is a big Class.
In regards to animation you can use a ValueAnimator as a time engine and call CustomView.invalidate() on each animationFrame. It will invoke View.onDraw later where you will repaint accordingly to the new state values.
Similar principle if you need to update/repaint the View when onTouch event.

[Paul Dhaliwal]

Thanks! Currently the view is being animated over time with a runnable. There is one list of “entries” and the runnable updates everything in the view according to the new list and the old list. So in increments the runnable changes the entries from the old value to the new value, while calling customView.invalidate() at each step. I guess the issue here is how to animate the different elements that were drawn to the canvas seperately, if at every frame in the animation the view is invalidated.

Should I have separate lists and animators for each “view component”? I feel like I’m missing something crucial.

[Pablichjenkov]

If I understand correctly it is working for the axis because you control the Axis’s State. However, those commands that has been painted already in the Canvas are the ones causing issues, because you don’t have/control their state.
That scenario is a bit more complex, there is always the possibility to apply transformations over an existing Canvas Bitmap. Anyways transforming something that you don’t know how it looks might change the original shape, aspect ratio an so on.
Other alternative as you said could be creating a custom ViewComponent class that contains the properties and data of the different objects that painted into this Canvas. You can keep a list of them internally. Let the class have 3 open methods .onMeasure(…) .onLayout(…) and .onDraw(…) and propagate them from CustomView accordingly.