[TIMOB-28367] TiAPI: Ti.UI.ProgressBar should smoothly animate value changes
GitHub Issue | n/a |
---|---|
Type | Improvement |
Priority | Low |
Status | Closed |
Resolution | Fixed |
Resolution Date | 2021-06-10T17:17:39.000+0000 |
Affected Version/s | n/a |
Fix Version/s | Release 10.0.1 |
Components | Android, iOS, Mac |
Labels | android, animate, iOS, progressbar |
Reporter | Michael Gangolf |
Assignee | Joshua Quick |
Created | 2020-12-22T17:28:26.000+0000 |
Updated | 2021-06-10T17:17:39.000+0000 |
Description
*Summary:*
Our [Ti.UI.ProgressBar](https://docs.appcelerator.com/platform/latest/#!/api/Titanium.UI.ProgressBar) should animate by default when changing the progress value. This will make the UI widget look more modern.
We should provide a new "animated" property which allows developers to enable/disable the animation. By default it should be
true
.
*To-Do on iOS:*
iOS (/iphone/Classes/TiUIProgressBar.m): *animated:YES*
- (void)setValue_:(id)value
{
CGFloat newValue = ([TiUtils floatValue:value] - min) / (max - min);
[[self progress] setProgress:newValue animated:YES];
}
*To-Do on Android:*
When we switch over to the material [LinearProgressIndicator](https://developer.android.com/reference/com/google/android/material/progressindicator/LinearProgressIndicator), we can easily animate progress value changes via its [setProgressCompat()](https://developer.android.com/reference/com/google/android/material/progressindicator/BaseProgressIndicator#setProgressCompat(int,%20boolean)) method. We can do this once ticket [TIMOB-28351] is implemented.
Note that the way to do this with the old Android [ProgressBar](https://developer.android.com/reference/android/widget/ProgressBar) class is to do the below.
ObjectAnimator.ofInt(progressBar, "progress", progressValue)
.setDuration(300)
.start();
Attachments
File | Date | Size |
---|---|---|
ProgressBarAnimatedTest.js | 2021-02-24T05:28:12.000+0000 | 1661 |
The material
LinearProgressIndicator
makes this easy to add on Android and looks nice and smooth. I'm thinking progress should be animated by default and we should add an "animated" property (like you were thinking) so you can turn it on or off. What do you think?PR (master): https://github.com/appcelerator/titanium_mobile/pull/12353
FR Passed, Waiting on Jenkins build and backport (as well as FR on related on tickets)
merged to master and 10_0_X for 10.0.0 release target.
This change didn't get back-ported and is missing in the 10_0_X branch. We'll have to back-port the following commit. https://github.com/appcelerator/titanium_mobile/pull/12353/commits/243810833dff6f199e9cc414a58440153b1e0a72
PR (10_0_X): https://github.com/appcelerator/titanium_mobile/pull/12876