Haptics

Introduction:

Vibration Plugin

• Reference
  • Method
    • Parameter
  • Usage Plugins
  • Usage WebComponent

Reference

Method

• impactLight

  Impact light object

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

• notification

  Vibration notification

import { hapticsPlugin, NotificationType } from "@plaoc/plugins";

await hapticsPlugin.notification({ type: NotificationType.Success });

• vibrateClick

  Feedback vibration for click gesture

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

• vibrateDisabled

  Feedback vibration for disabled gesture

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

• vibrateDoubleClick

  Feedback vibration for double-click gesture

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

• vibrateHeavyClick

  Feedback vibration for heavy-click gesture, such as menu key/long press/3Dtouch

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

• vibrateTick

  Tick

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

• vibrate

  Custom effect

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

Parameter

• ImpactStyle

  Impact feedback intensity

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

• NotificationType

  Notification type

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

• VibrateOptions

  Vibration frequency

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

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

Usage Plugins

<script setup lang="ts">
import { hapticsPlugin } from "@plaoc/plugins";

async function customVibrate() {
  await hapticsPlugin.vibrate({ duration: [10, 2, 100, 3, 10] });
}
</script>

Usage WebComponent

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