titanium-sdk icon indicating copy to clipboard operation
titanium-sdk copied to clipboard

feat(android): add stopAnimation() to View

Open m1ga opened this issue 6 years ago • 10 comments

JIRA: https://jira.appcelerator.org/browse/AC-5931

Optional Description:

Android has no possibility to cancel/stop animations like moving an object from left to right before the duration is over. This PR adds a stopAnimation() method to Ti.UI.View

const win = Ti.UI.createWindow();

const lbl = Ti.UI.createLabel({
	text: "-",
	width: Ti.UI.SIZE,
	height: Ti.UI.SIZE
});

const view = Ti.UI.createView({
	backgroundColor: 'red',
	height: 100,
	width: 100,
	top: 0,
	left: 0
});

const btn1 = Ti.UI.createButton({
	title: 'Animate',
	width: 100,
	height: 40,
	bottom: 20,
	left: 10
});
btn1.addEventListener('click', function() {
	view.left = 0;
	view.animate(ani);
});

const btn2 = Ti.UI.createButton({
	title: 'Cancel',
	width: 100,
	height: 40,
	bottom: 20,
	right: 10
});
btn2.addEventListener('click', function() {
	view.stopAnimation();
	view.left = 0;
});

const ani = Ti.UI.createAnimation({
	left: 100,
	duration: 3000
})

ani.addEventListener("start", function() {
	lbl.text = "start";
});

ani.addEventListener("complete", function() {
	lbl.text = "complete";
})

ani.addEventListener("cancel", function() {
	lbl.text = "cancel";
})

win.add([view, btn1, btn2, lbl]);
win.open();

m1ga avatar Jun 24 '18 19:06 m1ga

Fails
:no_entry_sign:

:microscope: There are library changes, but no changes to the unit tests. That's OK as long as you're refactoring existing code, but will require an admin to merge this PR. Please see README.md#unit-tests for docs on unit testing.

:no_entry_sign:

:disappointed_relieved: npm test failed. See below for details.

Warnings
:warning:

:mag: Can't find junit reports at ./junit.*.xml, skipping generating JUnit Report.

Messages
:book: :tada: Another contribution from our awesome community member, m1ga! Thanks again for helping us make Titanium SDK better. :thumbsup:
:book:
> [email protected] test /Users/build/jenkins/workspace/ium-sdk_titanium_mobile_PR-10130
> grunt

Running "appcJs:src:lintOnly" (appcJs) task

Running "eslint:src" (eslint) task

/Users/build/jenkins/workspace/ium-sdk_titanium_mobile_PR-10130/build/packager.js
316:17  warning  Avoid calling back inside of a promise  promise/no-callback-in-promise
317:19  warning  Avoid calling back inside of a promise  promise/no-callback-in-promise

/Users/build/jenkins/workspace/ium-sdk_titanium_mobile_PR-10130/build/scons-xcode-test.js
27:3  warning  Each then() should return a value or throw  promise/always-return

/Users/build/jenkins/workspace/ium-sdk_titanium_mobile_PR-10130/build/utils.js
154:3   warning  Avoid using promises inside of callbacks    promise/no-promise-in-callback
154:3   warning  Avoid using promises inside of callbacks    promise/no-promise-in-callback
154:63  warning  Each then() should return a value or throw  promise/always-return
155:4   warning  Avoid calling back inside of a promise      promise/no-callback-in-promise
157:4   warning  Avoid calling back inside of a promise      promise/no-callback-in-promise
175:59  warning  Each then() should return a value or throw  promise/always-return
176:4   warning  Avoid calling back inside of a promise      promise/no-callback-in-promise
178:4   warning  Avoid calling back inside of a promise      promise/no-callback-in-promise
189:3   warning  Avoid using promises inside of callbacks    promise/no-promise-in-callback
189:3   warning  Avoid using promises inside of callbacks    promise/no-promise-in-callback
189:51  warning  Each then() should return a value or throw  promise/always-return
190:4   warning  Avoid calling back inside of a promise      promise/no-callback-in-promise
192:4   warning  Avoid calling back inside of a promise      promise/no-callback-in-promise
203:71  warning  Each then() should return a value or throw  promise/always-return
205:4   warning  Avoid calling back inside of a promise      promise/no-callback-in-promise
206:17  warning  Avoid calling back inside of a promise      promise/no-callback-in-promise
218:71  warning  Each then() should return a value or throw  promise/always-return
220:4   warning  Avoid calling back inside of a promise      promise/no-callback-in-promise
258:10  warning  Each then() should return a value or throw  promise/always-return
261:18  warning  Avoid calling back inside of a promise      promise/no-callback-in-promise

/Users/build/jenkins/workspace/ium-sdk_titanium_mobile_PR-10130/iphone/cli/commands/_build.js
6364:79  warning  'out' is defined but never used  no-unused-vars

/Users/build/jenkins/workspace/ium-sdk_titanium_mobile_PR-10130/iphone/cli/hooks/frameworks.js
 61:5   warning  Expected catch() or return                  promise/catch-or-return
 61:34  warning  Avoid calling back inside of a promise      promise/no-callback-in-promise
428:5   warning  Each then() should return a value or throw  promise/always-return

✖ 27 problems (0 errors, 27 warnings)


Running "checkFormat:ios" (checkFormat) task

Running "checkFormat:android" (checkFormat) task
Fatal error: Error: Formatting incorrect on "android/titanium/src/java/org/appcelerator/titanium/proxy/TiViewProxy.java", proposed changes: <?xml version='1.0'?>
<replacements xml:space='preserve' incomplete_format='false'>
<replacement offset='21498' length='1'>&#10;						</replacement>
</replacements>

npm ERR! Test failed.  See above for more details.

Generated by :no_entry_sign: dangerJS against 0766c04430e074dbb6f913a57b1da75fb45a5a55

build avatar Jun 24 '18 19:06 build

@sgtcoolguy thanks for your feedback! As far as I remember you can do animate(null) on iOS to stop an animation, so that would be another way to stop the animation on Android. But I have to check that. Yes, since there is only one animation playing I thought it would be good to stop it on the view. But I'm open for the Ti.UI.Animation way! Just means that you have to keep track of the animation object. In my case I couldn't access it in the 2nd button. A callback sounds like a good idea. I'll add a cancelled event, so we have start, complete and cancelled to listen for.

m1ga avatar Jun 25 '18 20:06 m1ga

I think I can't make something like animation.stop() since it looks like that there is no connection between TiAnimation (just storing the parameters) and the actual TiAnimationBuilder that is created from the view where the animation is created

m1ga avatar Jun 26 '18 18:06 m1ga

@m1ga Sorry about the delay in responding!

Ok, yeah it makes sense that We call stopAnimation() on the view then. I'd still like to see some sort of feedback/mechanism like a callback to handle when an animation is canceled.

Also, my OCD hates that both canceled and cancelled are technically correct, and looking at our API docs I do not see that we stuck with one over the other...

sgtcoolguy avatar Jul 17 '18 20:07 sgtcoolguy

Added the cancel event, updated the example, added the JIRA ticket

m1ga avatar Sep 22 '18 15:09 m1ga

@m1ga, calling View.animate() should stop an existing animation too. On iOS, it does. On Android, the previous animation will continue to animate until its duration has ended, which causes the 2nd given animation to be ignored . This is a pre-existing bug in Titanium and not an issue on your end, but this is good opportunity to fix it. Thanks.

Edit: Actually, let me see if it's possible to do "tweening" between the 2 animations. That would be better than stopping the animation. It's not particularly valuable on Android "yet" since we only support a "linear" animation, but I'd like us to support "easing" style animations on Android in the near future, like iOS.

jquick-axway avatar Nov 20 '18 20:11 jquick-axway

@jquick-axway I've added animate() to call stop, too. Should I remove stopAnimation()?

m1ga avatar Nov 21 '18 16:11 m1ga

Should I remove stopAnimation()?

Good question... because I'm wondering if setting View.animate() to null would be a good alternative to stopping an animation. Currently, setting it to null will throw an exception on Android, but we can change that behavior. On iOS, a null animation argument is simply ignored, but doesn't stop the current animation (we can change that too).

Side Note: I've been experimenting with animations this week. Your fix to the View.animate() method solves an edge case where a translation/scale animation needs to change when the app orientation changes. So, thanks for this. :)

jquick-axway avatar Nov 21 '18 20:11 jquick-axway

Fails
:no_entry_sign: Test reports missing for Android 5.0, Android Main, CLI, iPad, iPhone, MacOS. This indicates that a build failed or the test app crashed
:no_entry_sign:

:microscope: There are library changes, but no changes to the unit tests. That's OK as long as you're refactoring existing code, but will require an admin to merge this PR. Please see README.md#unit-tests for docs on unit testing.

Warnings
:warning:

Commit 605f64c7c59b60df70c3b5a0c0ae612f011a141f has a message "add animate() to stop the animation" giving 2 errors:

  • subject may not be empty
  • type may not be empty
:warning:

Commit 09a7082201c9ebc05313dc6701728eae51728a9e has a message "cancel event" giving 2 errors:

  • subject may not be empty
  • type may not be empty
:warning:

Commit 20d94b181d231cbadb7475ba7c0f5386054bd93c has a message "docs" giving 2 errors:

  • subject may not be empty
  • type may not be empty
:warning:

Commit cc3f8d80af04034e35b6d7c7edea706efaa90c6f has a message "Android: stop animation" giving 2 errors:

  • type must be lower-case
  • type must be one of [build, chore, ci, docs, feat, fix, perf, refactor, revert, style, test]
:warning:

Commit 0c9f35ecbcddf420006bcb224755995753c0437d has a message "Android: stop animation" giving 2 errors:

  • type must be lower-case
  • type must be one of [build, chore, ci, docs, feat, fix, perf, refactor, revert, style, test]
:warning:

:mag: Can't find junit reports at ./junit.*.xml, skipping generating JUnit Report.

:warning: This PR has milestone set to 10.0.0, but the version defined in package.json is 10.2.0 Please either: - Update the milestone on the PR - Update the version in package.json - Hold the PR to be merged later after a release and version bump on this branch
Messages
:book:

:rotating_light: This PR has one or more commits with warnings/errors for commit messages not matching our configuration. You may want to squash merge this PR and edit the message to match our conventions, or ask the original developer to modify their history.

:book: :tada: Another contribution from our awesome community member, m1ga! Thanks again for helping us make Titanium SDK better. :thumbsup:

Generated by :no_entry_sign: dangerJS against daeba0071acdf914b0adb1abfb1b698b87a45494

build avatar May 04 '19 18:05 build

great...my master branch is broken after testing the github issue PR :disappointed: need to fix that edit: fixed!

m1ga avatar Mar 27 '22 14:03 m1ga