You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
A tooltip is displayed upon tapping and holding a screen element or component (on mobile) or hovering over it (desktop).
Vuetify has the mouse hover method solved for tooltips on desktop, but does not yet provide a method to handle a finger long-press on mobile. Instead, a <v-tooltip> displays immediately on tap/click. This is sometimes the desired response, but other times it is not.
Adding a v-touch-hold type directive to vuetify would:
Align vuetify more closely to Google's MD spec for tooltips.
Potentially make it easy for developers to implement long-press functionality within a vuetify app anywhere it's needed. The current offerings elsewhere (other than here) do not seem a good match for vuetify use.
What is your proposed solution?
A v-touch-hold directive such as used by Quasar seems to have the best combination of features, simplicity, and effectiveness. It:
is a directive, so can be applied most anywhere directly
allows for custom long-press duration length v-touch-hold:2000, but has a reasonable default setting of 600ms
can be used for both mouse and touch events, or limited to just touch events v-touch-hold.noMouse, as desired
supports both .stop and .prevent modifier use, if needed
calls a method when the duration threshold has been reached v-touch-hold="myHandler"
passes the event to the handler, with the developer being able to glean the screen position and duration length (this feature may or may not be that useful)
Thanks for considering this request.
The text was updated successfully, but these errors were encountered:
MajesticPotatoe
changed the title
Feature Request: VTouchHold Directive for Long-Press of an Element
[Feature Request] VTouchHold Directive for Long-Press of an Element
Dec 7, 2018
I like to provide baseline functionality for users but also give them the ability to integrate third party libraries, such as hammerjs, which offer a full suite of functionality.
With that being said, we have lots of touch directives that we are going to add in version 3.
What problem does this feature solve?
Google's Tooltips MD spec mentions:
Vuetify has the mouse hover method solved for tooltips on desktop, but does not yet provide a method to handle a finger long-press on mobile. Instead, a
<v-tooltip>
displays immediately on tap/click. This is sometimes the desired response, but other times it is not.Adding a
v-touch-hold
type directive to vuetify would:What is your proposed solution?
A
v-touch-hold
directive such as used by Quasar seems to have the best combination of features, simplicity, and effectiveness. It:v-touch-hold:2000
, but has a reasonable default setting of 600msv-touch-hold.noMouse
, as desired.stop
and.prevent
modifier use, if neededv-touch-hold="myHandler"
Thanks for considering this request.
The text was updated successfully, but these errors were encountered: