haptics
intro:
Haptics plugin
Reference
Method
impactLightTouching lightweight objects
ts
import { hapticsPlugin, ImpactStyle } from "@plaoc/plugins";
await hapticsPlugin.impactLight({ style: ImpactStyle.Heavy });
notificationVibration notification
ts
import { hapticsPlugin, NotificationType } from "@plaoc/plugins";
await hapticsPlugin.notification({ type: NotificationType.Success });
vibrateClickFeedback vibration for click gestures
ts
import { hapticsPlugin } from "@plaoc/plugins";
await hapticsPlugin.vibrateClick();
vibrateDisabledDisable feedback vibration for gestures
ts
import { hapticsPlugin } from "@plaoc/plugins";
await hapticsPlugin.vibrateDisabled();
vibrateDoubleClickFeedback vibration for double tap gesture
ts
import { hapticsPlugin } from "@plaoc/plugins";
await hapticsPlugin.vibrateDoubleClick();
vibrateHeavyClickFeedback vibration for heavy tap gestures, such as menu key/tragedy/3Dtouch
ts
import { hapticsPlugin } from "@plaoc/plugins";
await hapticsPlugin.vibrateHeavyClick();
vibrateTicktick
ts
import { hapticsPlugin } from "@plaoc/plugins";
await hapticsPlugin.vibrateTick();
vibrateCustom effects
ts
import { hapticsPlugin, VibrateOptions } from "@plaoc/plugins";
await hapticsPlugin.vibrate({ duration: [100, 200, 300] });
Parameter
ImpactStyleTouch feedback intensity
ts
import { ImpactStyle } from "@plaoc/plugins";
ImpactStyle.Heavy;
NotificationTypenotification type
ts
import { NotificationType } from "@plaoc/plugins";
NotificationType.Success;
VibrateOptionsVibration 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>