bug: improve ion-item-sliding gesture on desktop with trackpad/mouse

[EinfachHans]

Feature Request

Ionic version:

[x] 4.x

Describe the Feature Request

I think for v6 and Ionic Desktop the ion-sliding-item should be refactored as this is not a known desktop gesture. But i don't want to use another component based on the screen size, as this will be very confusing in large projects.

Describe Preferred Solution

• A possible solution could be to always show all buttons at the end of the item?
• Or automatically show a Dropdown Icon at the End which will then show all available Options?

Describe Alternatives

If someone has another idea, feel free to start a discussion about the best solution here.

Related Code

Additional Context

[lincolnthree]

@EinfachHans We added a tap/click handler that opens the slider programmatically when clicked on non-interactable areas, like text or images. Buttons in the inner ion-item cancel the click event/stopPropagation and prevent the slider from opening. (Clicking again also closes it.)

[EinfachHans]

@lincolnthree i currently add buttons on the item itself (at the end) when on a specific breakpoint size. I would recommend this as the normal behavior as the sliding itself is not really desktop known

[lincolnthree]

@EinfachHans We already have controls/buttons at the end of each item - we don't want the additional buttons underneath revealed/highlighted (or even rendered) by default -- they are rendered when users open the items.

Our design works very well for what our users are doing :) And most people discover the "click" action we've added because the cursor "pointer" indicates they can interact with it.

The controls at the end of each item stay active even when the item is open (e.g. the "+ / -" buttons can be used even when open).

[lincolnthree]

https://user-images.githubusercontent.com/362329/108636430-25c97780-7453-11eb-83c4-4ba15a99074f.mov

[EinfachHans]

@lincolnthree Yeah seems perfect for your use case. Hard UI discussion i think 😃 In my case i already have a click event on the items which opens another page

[lincolnthree]

That said, @EinfachHans , I'll tack on an idea that clicking to open items would be a great built-in feature! It took quite a bit of work to get this working properly.

Also, rendering the items conditionally when opened also took quite a bit of work.

[lincolnthree]

@EinfachHans Yeah, we do too. But we delegate that to the image when "editing" (in our case we can do that). But I'm sure this isn't always possible. UI is hard :)

https://user-images.githubusercontent.com/362329/108636503-9bcdde80-7453-11eb-812f-b2d9b6997a9b.mov

[liamdebeasi]

Hi everyone,

We are going to be focusing on the mobile application use case moving forward rather than the desktop use case, so we don't have plans to add support for this at the moment.

Note that performance re: ion-item-sliding is being tracked in https://github.com/ionic-team/ionic-framework/issues/23155

I am going to close this, but let me know if there are any question.

[ionitron-bot[bot]]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.