Skip to content

haptics

NPM version

Platform Support

Platform Support

intro:

Haptics plugin

Reference

Method

  • impactLight

    Touching lightweight objects

ts
import { 
hapticsPlugin
,
ImpactStyle
} from "@plaoc/plugins";
await
hapticsPlugin
.
impactLight
({
style
:
ImpactStyle
.
Heavy
});
  • notification

    Vibration notification

ts
import { 
hapticsPlugin
,
NotificationType
} from "@plaoc/plugins";
await
hapticsPlugin
.
notification
({
type
:
NotificationType
.
Success
});
  • vibrateClick

    Feedback vibration for click gestures

ts
import { 
hapticsPlugin
} from "@plaoc/plugins";
await
hapticsPlugin
.
vibrateClick
();
  • vibrateDisabled

    Disable feedback vibration for gestures

ts
import { 
hapticsPlugin
} from "@plaoc/plugins";
await
hapticsPlugin
.
vibrateDisabled
();
  • vibrateDoubleClick

    Feedback vibration for double tap gesture

ts
import { 
hapticsPlugin
} from "@plaoc/plugins";
await
hapticsPlugin
.
vibrateDoubleClick
();
  • vibrateHeavyClick

    Feedback vibration for heavy tap gestures, such as menu key/tragedy/3Dtouch

ts
import { 
hapticsPlugin
} from "@plaoc/plugins";
await
hapticsPlugin
.
vibrateHeavyClick
();
  • vibrateTick

    tick

ts
import { 
hapticsPlugin
} from "@plaoc/plugins";
await
hapticsPlugin
.
vibrateTick
();
  • vibrate

    Custom effects

ts
import { 
hapticsPlugin
, VibrateOptions } from "@plaoc/plugins";
await
hapticsPlugin
.
vibrate
({
duration
: [100, 200, 300] });

Parameter

  • ImpactStyle

    Touch feedback intensity

ts
import { 
ImpactStyle
} from "@plaoc/plugins";
ImpactStyle
.
Heavy
;
  • NotificationType

    notification type

ts
import { 
NotificationType
} from "@plaoc/plugins";
NotificationType
.
Success
;
  • VibrateOptions

    Vibration frequency

ts
import { VibrateOptions } from "@plaoc/plugins";

const 
options
: VibrateOptions = {
duration
: [100, 1, 200] };

Usage Plugins

vue
<script setup lang="ts">
import { 
hapticsPlugin
} from "@plaoc/plugins";
async function
customVibrate
() {
await
hapticsPlugin
.
vibrate
({
duration
: [10, 2, 100, 3, 10] });
} </script>

Usage WebComponent

vue
<script setup lang="ts">
import { 
ref
} from "vue";
import {
HTMLDwebHapticsElement
} from "@plaoc/plugins";
const
$hapticsPlugin
=
ref
<
HTMLDwebHapticsElement
>();
let
haptics
:
HTMLDwebHapticsElement
;
onMounted(async () => {
haptics
=
$hapticsPlugin
.
value
!;
}); async function
customVibrate
() {
haptics
.
vibrate
({
duration
: [10, 2, 100, 3, 10] });
} </script> <template> <
dweb-haptics
ref
="
$hapticsPlugin
"></
dweb-haptics
>
</template>

Released under the MIT License.