Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Series line width is changed if animation is cut off #8

Closed
bogdanzurac opened this issue Nov 11, 2015 · 6 comments
Closed

Series line width is changed if animation is cut off #8

bogdanzurac opened this issue Nov 11, 2015 · 6 comments

Comments

@bogdanzurac
Copy link

So there are 2 Series that I'm using with the DecoView, one as the background with light gray, which represents the total amount, and a 2nd one with blue, which overlaps the first one, which represents a partial amount. I've set the line width on both as follows:

.setLineWidth(32f)

Then I animate them as follows:

mDecoView.addEvent(new DecoEvent.Builder(DecoEvent.EventType.EVENT_SHOW, true) .setDelay(500) .setDuration(500) .build()); // reveal the background series mDecoView.addEvent(new DecoEvent.Builder(percentage).setIndex(seriesIndex).setDelay(1000).setDuration(2000).build()); // animate the blue series

Now, most of the times, this works like a charm, the blue series overlaps the gray one perfectly, as you'd expect. However, when the animation (2nd one) is cut off (for example, hitting the home button as soon as the animation starts), when coming back to the app, the blue series line width is changed and is not the same as the grey series anymore, like you can see in the attached screenshot.

Any idea what can be causing this?

screenshot_20151111-164534

@bogdanzurac
Copy link
Author

@bmarrdev Do you have any feedback on this matter?

@bmarrdev
Copy link
Owner

I was unable to reproduce this issue. I will take another look at this when I get a chance. It would be helpful if you could share a gist of an activity that exhibits the behaviour.

@bogdanzurac
Copy link
Author

I'll post the entire DecoView related code, because the rest is pretty much the default project in AS. You can copy paste this inside an empty project and it's the same thing. I've even increased the animation durations in order to make it easier to spot.

double total = 3500;
double partial = 2570;
int percentage = (int) (partial * 100 / total);

mDecoView = (DecoView) findViewById(R.id.activity_main_decoview);

mDecoView.addSeries(new SeriesItem.Builder(ContextCompat.getColor(MainActivity.this, R.color.color_gray))
                .setSeriesLabel(new SeriesLabel.Builder(total + " USD")
                        .setColorBack(ContextCompat.getColor(MainActivity.this, R.color.color_gray_darker))
                        .setColorText(ContextCompat.getColor(MainActivity.this, R.color.color_gray))
                        .setTypeface(Typeface.create("sans-serif-light", Typeface.NORMAL))
                        .build())
                .setRange(0, 100, 100)
                .setInitialVisibility(false)
                .setLineWidth(32f)
                .build());

final SeriesItem seriesItem = new SeriesItem.Builder(ContextCompat.getColor(MainActivity.this, R.color.colorPrimary))
                .setSeriesLabel(new SeriesLabel.Builder(partial + " USD")
                        .setColorBack(ContextCompat.getColor(MainActivity.this, R.color.color_gray_darker))
                        .setColorText(ContextCompat.getColor(MainActivity.this, R.color.color_gray))
                        .setTypeface(Typeface.create("sans-serif-light", Typeface.NORMAL))
                        .build())
                .setRange(0, 100, 0)
                .setInitialVisibility(false)
                .setLineWidth(32f)
                .setCapRounded(true)
                .setShowPointWhenEmpty(true)
                .build();

int seriesIndex = mDecoView.addSeries(seriesItem);

mDecoView.executeReset();
mDecoView.addEvent(new DecoEvent.Builder(DecoEvent.EventType.EVENT_SHOW, true)
                .setDelay(1000)
                .setDuration(3000)
                .build());
mDecoView.addEvent(new DecoEvent.Builder(percentage).setIndex(seriesIndex).setDelay(4000).setDuration(2000).build());

Now then, the test case is the following:

  1. Cold start MainActivity, so that onCreate() is called with the code above.
  2. As soon as you see the series with the colorPrimary color appear and start growing as part of the show animation, immediately tap the Home button.
  3. Wait for the remaining of the animation to complete (~4s).
  4. Enter the app again (not cold start).

If you tap the Home button before the animation starts or after it ends, then everything will look fine, so if you don't get it right the first try, try some more. However, if you got the timing right, the result should look pretty similar to the initial screenshot. I presume the grow animation incorrectly sets the second series line width if the animation is interrupted, which isn't good.

@bmarrdev
Copy link
Owner

Thanks for that info. I will investigate it this weekend and report back.

@bmarrdev
Copy link
Owner

I have reproduced the issue. I couldn't see an immediate reason for it, but as soon as I get some free time I will find and post a fix. An option for you to work around this issue for now recreate the DecoView and set the positions or events required in your Activity onResume()

@bmarrdev
Copy link
Owner

I have included a fix for this issue in a new build, v0.9.6.

To access this fix update your gradle dependencies:
compile 'com.github.bmarrdev:android-DecoView-charting:v0.9.6'

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants