mirror of
https://github.com/tauri-apps/tauri-docs.git
synced 2026-01-31 00:35:16 +01:00
add haptics and geolocation pages from readme (#3599)
This commit is contained in:
Vitor Ayres
@@ -68,7 +68,9 @@ async function generator() {
|
||||
'deep-link',
|
||||
'dialog',
|
||||
'fs',
|
||||
'geolocation',
|
||||
'global-shortcut',
|
||||
'haptics',
|
||||
'http',
|
||||
'log',
|
||||
'nfc',
|
||||
|
||||
172
src/content/docs/plugin/geolocation.mdx
Normal file
172
src/content/docs/plugin/geolocation.mdx
Normal file
@@ -0,0 +1,172 @@
|
||||
---
|
||||
title: Geolocation
|
||||
description: Get and track the device's current position, including information about altitude, heading, and speed (if available).
|
||||
plugin: geolocation
|
||||
i18nReady: true
|
||||
---
|
||||
|
||||
import PluginLinks from '@components/PluginLinks.astro';
|
||||
import Compatibility from '@components/plugins/Compatibility.astro';
|
||||
|
||||
import { Tabs, TabItem, Steps } from '@astrojs/starlight/components';
|
||||
import CommandTabs from '@components/CommandTabs.astro';
|
||||
import PluginPermissions from '@components/PluginPermissions.astro';
|
||||
|
||||
<PluginLinks plugin={frontmatter.plugin} />
|
||||
|
||||
Get and track the device's current position, including information about altitude, heading, and speed (if available).
|
||||
|
||||
## Supported Platforms
|
||||
|
||||
<Compatibility plugin={frontmatter.plugin} />
|
||||
|
||||
## Setup
|
||||
|
||||
Install the geolocation plugin to get started.
|
||||
|
||||
<Tabs>
|
||||
<TabItem label="Automatic">
|
||||
|
||||
Use your project's package manager to add the dependency:
|
||||
|
||||
{' '}
|
||||
|
||||
<CommandTabs
|
||||
npm="npm run tauri add geolocation"
|
||||
yarn="yarn run tauri add geolocation"
|
||||
pnpm="pnpm tauri add geolocation"
|
||||
deno="deno task tauri add geolocation"
|
||||
bun="bun tauri add geolocation"
|
||||
cargo="cargo tauri add geolocation"
|
||||
/>
|
||||
|
||||
</TabItem>
|
||||
<TabItem label="Manual">
|
||||
<Steps>
|
||||
|
||||
1. Run the following command in the `src-tauri` folder to add the plugin to the project's dependencies in `Cargo.toml`:
|
||||
|
||||
```sh frame=none
|
||||
cargo add tauri-plugin-geolocation --target 'cfg(any(target_os = "android", target_os = "ios"))'
|
||||
```
|
||||
|
||||
2. Modify `lib.rs` to initialize the plugin:
|
||||
|
||||
```rust title="src-tauri/src/lib.rs" ins={5-6}
|
||||
#[cfg_attr(mobile, tauri::mobile_entry_point)]
|
||||
pub fn run() {
|
||||
tauri::Builder::default()
|
||||
.setup(|app| {
|
||||
#[cfg(mobile)]
|
||||
app.handle().plugin(tauri_plugin_geolocation::init());
|
||||
Ok(())
|
||||
})
|
||||
.run(tauri::generate_context!())
|
||||
.expect("error while running tauri application");
|
||||
}
|
||||
```
|
||||
|
||||
3. Install the JavaScript Guest bindings using your preferred JavaScript package manager:
|
||||
|
||||
<CommandTabs
|
||||
npm="npm install @tauri-apps/plugin-geolocation"
|
||||
yarn="yarn add @tauri-apps/plugin-geolocation"
|
||||
pnpm="pnpm add @tauri-apps/plugin-geolocation"
|
||||
deno="deno add npm:@tauri-apps/plugin-geolocation"
|
||||
bun="bun add @tauri-apps/plugin-geolocation"
|
||||
/>
|
||||
|
||||
</Steps>
|
||||
|
||||
</TabItem>
|
||||
</Tabs>
|
||||
|
||||
## Configuration
|
||||
|
||||
### iOS
|
||||
|
||||
Apple requires privacy descriptions to be specified in Info.plist for location information, where you should describe why your app needs to access it. Illustrated below is an example description:
|
||||
|
||||
```xml {6-7}
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
|
||||
<plist version="1.0">
|
||||
<dict>
|
||||
<key>NSLocationWhenInUseDescription</key>
|
||||
<string>Required to do XY</string>
|
||||
</dict>
|
||||
</plist>
|
||||
```
|
||||
|
||||
### Android
|
||||
|
||||
This plugin automatically adds the following permissions to your `AndroidManifest.xml` file:
|
||||
|
||||
```xml
|
||||
<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />
|
||||
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
|
||||
```
|
||||
|
||||
If your app requires GPS functionality to function, you should add the following to your `AndroidManifest.xml` file:
|
||||
|
||||
```xml
|
||||
<uses-feature android:name="android.hardware.location.gps" android:required="true" />
|
||||
```
|
||||
|
||||
The Google Play Store uses this property to decide whether it should show the app to devices without GPS capabilities.
|
||||
|
||||
## Usage
|
||||
|
||||
The geolocation plugin is available in JavaScript.
|
||||
|
||||
```javascript
|
||||
import {
|
||||
checkPermissions,
|
||||
requestPermissions,
|
||||
getCurrentPosition,
|
||||
watchPosition,
|
||||
} from '@tauri-apps/plugin-geolocation';
|
||||
|
||||
let permissions = await checkPermissions();
|
||||
if (
|
||||
permissions.location === 'prompt' ||
|
||||
permissions.location === 'prompt-with-rationale'
|
||||
) {
|
||||
permissions = await requestPermissions(['location']);
|
||||
}
|
||||
|
||||
if (permissions.location === 'granted') {
|
||||
const pos = await getCurrentPosition();
|
||||
|
||||
await watchPosition(
|
||||
{ enableHighAccuracy: true, timeout: 10000, maximumAge: 0 },
|
||||
(pos) => {
|
||||
console.log(pos);
|
||||
}
|
||||
);
|
||||
}
|
||||
```
|
||||
|
||||
## Permissions
|
||||
|
||||
By default all potentially dangerous plugin commands and scopes are blocked and cannot be accessed. You must modify the permissions in your `capabilities` configuration to enable these.
|
||||
|
||||
See the [Capabilities Overview](/security/capabilities/) for more information and the [step by step guide](/learn/security/using-plugin-permissions/) to use plugin permissions.
|
||||
|
||||
```json title="src-tauri/capabilities/mobile.json" ins={7-11}
|
||||
{
|
||||
"$schema": "../gen/schemas/mobile-schema.json",
|
||||
"identifier": "mobile-capability",
|
||||
"windows": ["main"],
|
||||
"platforms": ["iOS", "android"],
|
||||
"permissions": [
|
||||
"core:default",
|
||||
"geolocation:allow-check-permissions",
|
||||
"geolocation:allow-request-permissions",
|
||||
"geolocation:allow-get-current-position",
|
||||
"geolocation:allow-watch-position"
|
||||
]
|
||||
}
|
||||
```
|
||||
|
||||
<PluginPermissions plugin={frontmatter.plugin} />
|
||||
125
src/content/docs/plugin/haptics.mdx
Normal file
125
src/content/docs/plugin/haptics.mdx
Normal file
@@ -0,0 +1,125 @@
|
||||
---
|
||||
title: Haptics
|
||||
description: Haptic feedback and vibrations on Android and iOS
|
||||
plugin: haptics
|
||||
i18nReady: true
|
||||
---
|
||||
|
||||
import PluginLinks from '@components/PluginLinks.astro';
|
||||
import Compatibility from '@components/plugins/Compatibility.astro';
|
||||
|
||||
import { Tabs, TabItem, Steps } from '@astrojs/starlight/components';
|
||||
import CommandTabs from '@components/CommandTabs.astro';
|
||||
import PluginPermissions from '@components/PluginPermissions.astro';
|
||||
|
||||
<PluginLinks plugin={frontmatter.plugin} />
|
||||
|
||||
Haptic feedback and vibrations on Android and iOS.
|
||||
|
||||
There are no standards/requirements for vibration support on Android, so the feedback APIs may not work correctly on more affordable phones, including recently released ones.
|
||||
|
||||
## Supported Platforms
|
||||
|
||||
<Compatibility plugin={frontmatter.plugin} />
|
||||
|
||||
## Setup
|
||||
|
||||
Install the haptics plugin to get started.
|
||||
|
||||
<Tabs>
|
||||
<TabItem label="Automatic">
|
||||
|
||||
Use your project's package manager to add the dependency:
|
||||
|
||||
{' '}
|
||||
|
||||
<CommandTabs
|
||||
npm="npm run tauri add haptics"
|
||||
yarn="yarn run tauri add haptics"
|
||||
pnpm="pnpm tauri add haptics"
|
||||
deno="deno task tauri add haptics"
|
||||
bun="bun tauri add haptics"
|
||||
cargo="cargo tauri add haptics"
|
||||
/>
|
||||
|
||||
</TabItem>
|
||||
<TabItem label="Manual">
|
||||
<Steps>
|
||||
|
||||
1. Run the following command in the `src-tauri` folder to add the plugin to the project's dependencies in `Cargo.toml`:
|
||||
|
||||
```sh frame=none
|
||||
cargo add tauri-plugin-haptics --target 'cfg(any(target_os = "android", target_os = "ios"))'
|
||||
```
|
||||
|
||||
2. Modify `lib.rs` to initialize the plugin:
|
||||
|
||||
```rust title="src-tauri/src/lib.rs" ins={5-6}
|
||||
#[cfg_attr(mobile, tauri::mobile_entry_point)]
|
||||
pub fn run() {
|
||||
tauri::Builder::default()
|
||||
.setup(|app| {
|
||||
#[cfg(mobile)]
|
||||
app.handle().plugin(tauri_plugin_haptics::init());
|
||||
Ok(())
|
||||
})
|
||||
.run(tauri::generate_context!())
|
||||
.expect("error while running tauri application");
|
||||
}
|
||||
```
|
||||
|
||||
3. Install the JavaScript Guest bindings using your preferred JavaScript package manager:
|
||||
|
||||
<CommandTabs
|
||||
npm="npm install @tauri-apps/plugin-haptics"
|
||||
yarn="yarn add @tauri-apps/plugin-haptics"
|
||||
pnpm="pnpm add @tauri-apps/plugin-haptics"
|
||||
deno="deno add npm:@tauri-apps/plugin-haptics"
|
||||
bun="bun add @tauri-apps/plugin-haptics"
|
||||
/>
|
||||
|
||||
</Steps>
|
||||
|
||||
</TabItem>
|
||||
</Tabs>
|
||||
|
||||
## Usage
|
||||
|
||||
The haptics plugin is available in JavaScript.
|
||||
|
||||
```javascript
|
||||
import {
|
||||
vibrate,
|
||||
impactFeedback,
|
||||
notificationFeedback,
|
||||
selectionFeedback,
|
||||
} from '@tauri-apps/plugin-haptics';
|
||||
|
||||
await vibrate(1);
|
||||
await impactFeedback('medium');
|
||||
await notificationFeedback('warning');
|
||||
await selectionFeedback();
|
||||
```
|
||||
|
||||
## Permissions
|
||||
|
||||
By default all potentially dangerous plugin commands and scopes are blocked and cannot be accessed. You must modify the permissions in your `capabilities` configuration to enable these.
|
||||
|
||||
See the [Capabilities Overview](/security/capabilities/) for more information and the [step by step guide](/learn/security/using-plugin-permissions/) to use plugin permissions.
|
||||
|
||||
```json title="src-tauri/capabilities/mobile.json" ins={7-10}
|
||||
{
|
||||
"$schema": "../gen/schemas/mobile-schema.json",
|
||||
"identifier": "mobile-capability",
|
||||
"windows": ["main"],
|
||||
"platforms": ["iOS", "android"],
|
||||
"permissions": [
|
||||
"haptics:allow-impact-feedback",
|
||||
"haptics:allow-notification-feedback",
|
||||
"haptics:allow-selection-feedback",
|
||||
"haptics:allow-vibrate"
|
||||
]
|
||||
}
|
||||
```
|
||||
|
||||
<PluginPermissions plugin={frontmatter.plugin} />
|
||||
@@ -87,12 +87,15 @@ import WebSocket from '@tauri-apps/plugin-websocket';
|
||||
|
||||
const ws = await WebSocket.connect('ws://127.0.0.1:8080');
|
||||
|
||||
ws.addListener((msg) => {
|
||||
const removeListener = ws.addListener((msg) => {
|
||||
console.log('Received Message:', msg);
|
||||
});
|
||||
|
||||
await ws.send('Hello World!');
|
||||
|
||||
// optionally remove the listener
|
||||
removeListener();
|
||||
|
||||
await ws.disconnect();
|
||||
```
|
||||
|
||||
|
||||
Reference in New Issue
Block a user