ionic-team / ionic-framework

A powerful cross-platform UI toolkit for building native-quality iOS, Android, and Progressive Web Apps with HTML, CSS, and JavaScript.
https://ionicframework.com
MIT License
50.93k stars 13.51k forks source link

feat: Add event for ion-item-sliding open/close state change #18533

Open bryplano opened 5 years ago

bryplano commented 5 years ago

Feature Request

Ionic version:

[x] 4.x

Describe the Feature Request

Ionic should provide an event(s) for developers that allows them to determine when an <ion-item-sliding> has been fully opened or closed.

Describe Preferred Solution

Provide event(s) ionOpen and/or ionClose emitted when the slider reaches a fully open or closed position. It would only emit once even if the user has not removed their finger from the slider, but the slider has moved to an "open/closed" position.

For example, if the user moves the slider from position 0 to position 1.0, the event would fire once.

If the user moves the slider from position 0 -> 1 and back to 0, the event would fire twice (once on "open" and once on "close").

If the user moves the slider from position 0 -> 0.5 -> 0, the event would not fire (because there was not a change from open to closed or vice-versa.

Describe Alternatives

The current implementation allows developers to use the ionDrag event (https://ionicframework.com/docs/api/item-sliding#events), but that event emits any time the position changes and is not definitive (i.e. you could drag a slider halfway to open/closed and the event would still fire).

Alternatively you could also use the getSlidingRatio and set it to a specific value. However, this is also not definitive as you could drag from 0 -> 0.75 -> 0 which should not count as a close/open.

Related Code

I do not have a code sample at this time.

eherve commented 4 years ago

+1 ionDrag is not fired when the user click on another item and the opened one is closed.

lincolnthree commented 3 years ago

I'd also like to see this incorporate (itemStartedOpening) and (itemStartedClosing) or something like that to represent the full lifecycle and support fine-grained triggers. But @bryplano is right, this can currently be done using (ionDrag) but it's a bit of work.