haptics
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>