Diálogo
Los diálogos nativos del sistema para abrir y guardar archivos junto con diálogos de mensajes.
Supported Platforms
This plugin requires a Rust version of at least 1.77.2
Platform | Level | Notes |
---|---|---|
windows | ||
linux | ||
macos | ||
android | | Does not support folder picker |
ios | | Does not support folder picker |
Configuración
Instala el plugin de diálogo para comenzar.
Usa el gestor de paquetes de tu proyecto para agregar la dependencia:
npm run tauri add dialog
yarn run tauri add dialog
pnpm tauri add dialog
cargo tauri add dialog
-
Ejecuta
cargo add tauri-plugin-dialog
para agregar el plugin a las dependencias del proyecto enCargo.toml
. -
Modifica
lib.rs
para inicializar el plugin:
#[cfg_attr(mobile, tauri::mobile_entry_point)]pub fn run() { tauri::Builder::default() // Inicializa el plugin .plugin(tauri_plugin_dialog::init()) .run(tauri::generate_context!()) .expect("error while running tauri application");}
- Si deseas crear diálogos en JavaScript, instala el paquete npm también:
npm install @tauri-apps/plugin-dialog
yarn add @tauri-apps/plugin-dialog
pnpm add @tauri-apps/plugin-dialog
Uso
El plugin de diálogo está disponible tanto en JavaScript como en Rust. Aquí tienes cómo puedes usarlo:
en JavaScript:
- Crear un diálogo de Si/No
- Crear un diálogo de Ok/Cancelar
- Crear un diálogo de mensaje
- Abrir un diálogo de selección de archivos
- Diálogo de guardar en archivo
en Rust:
- Construir un diálogo de pregunta
- Construir un diálogo de mensaje
- Construir un diálogo de selección de archivos
JavaScript
Consulta todas las Opciones de diálogo en la referencia de la API de JavaScript.
Crear un diálogo de Si/No
Muestra un diálogo de pregunta con botones Yes
y No
.
import { ask } from '@tauri-apps/plugin-dialog';
// Crea un diálogo de Sí/Noconst answer = await ask('This action cannot be reverted. Are you sure?', { title: 'Tauri', type: 'warning',});
console.log(answer);// Imprime un booleano en la consola
Crear un diálogo de Ok/Cancelar
Muestra un diálogo de pregunta con botones Ok
y Cancel
.
import { confirm } from '@tauri-apps/plugin-dialog';
// Crea un diálogo de confirmación Ok/Cancelarconst confirmation = await confirm( 'This action cannot be reverted. Are you sure?', { title: 'Tauri', type: 'warning' });
console.log(confirmation);// Imprime un booleano en la consola
Crear un diálogo de mensaje
Muestra un diálogo de mensaje con un botón Ok
. Ten en cuenta que si el usuario cierra el diálogo, devolverá false
.
import { message } from '@tauri-apps/plugin-dialog';
// Muestra un mensajeawait message('File not found', { title: 'Tauri', type: 'error' });
Abrir un diálogo de selección de archivos
Abre un diálogo de selección de archivos/directorios.
La opción multiple
controla si el diálogo permite la selección múltiple o no, mientras que directory
, si es una selección de directorio o no.
import { open } from '@tauri-apps/plugin-dialog';
// Abre un diálogoconst file = await open({ multiple: false, directory: false,});console.log(file);// Imprime la ruta y el nombre del archivo en la consola
Diálogo de guardar en archivo
Abre un diálogo de guardar archivo/directorio.
import { save } from '@tauri-apps/plugin-dialog';// Indica para guardar un 'My Filter' con extensión .png o .jpegconst path = await save({ filters: [ { name: 'My Filter', extensions: ['png', 'jpeg'], }, ],});console.log(path);// Imprime la ruta escogida
Rust
Consulta la referencia de la API de Rust para ver todas las opciones disponibles.
Construir un diálogo de pregunta
Muestra una diálogo de pregunta con botones Absolutely
y Totally
.
use tauri_plugin_dialog::DialogExt;
let answer = app.dialog() .message("Tauri is Awesome") .title("Tauri is Awesome") .ok_button_label("Absolutely") .cancel_button_label("Totally") .blocking_show();
Si necesitas una operación no bloqueante puedes usar show()
en su lugar:
use tauri_plugin_dialog::DialogExt;
app.dialog() .message("Tauri is Awesome") .title("Tauri is Awesome") .ok_button_label("Absolutely") .cancel_button_label("Totally") .show(|result| match result { true => // hacer algo, false =>// hacer algo, });
Construir un diálogo de mensaje
Muestra un diálogo de mensaje con un botón Ok
. Ten en cuenta que si el usuario cierra el diálogo, devolverá false
.
use tauri_plugin_dialog::{DialogExt, MessageDialogKind};
let ans = app.dialog() .message("File not found") .kind(MessageDialogKind::Error) .title("Warning") .blocking_show();
Si necesitas una operación no bloqueante puedes usar show()
en su lugar:
use tauri_plugin_dialog::{DialogExt, MessageDialogKind};
app.dialog() .message("Tauri is Awesome") .kind(MessageDialogKind::Info) .title("Information") .ok_button_label("Absolutely") .show(|result| match result { true => // hacer algo, false => // hacer algo, });
Construir un diálogo de selección de archivos
Seleccionar archivos
use tauri_plugin_dialog::DialogExt;
let file_path = app.dialog().file().blocking_pick_file();// devuelve un `Option` de file_path, o `None` si el usuario cierra el diálogo
Si necesitas una operación no bloqueante puedes usar show()
en su lugar:
use tauri_plugin_dialog::DialogExt;
app.dialog().file().pick_file(|file_path| { // devuelve un `Option` de file_path, o `None` si el usuario cierra el diálogo })
Guardar archivos
use tauri_plugin_dialog::DialogExt;
let file_path = app .dialog() .file() .add_filter("My Filter", &["png", "jpeg"]) .blocking_save_file(); // haz algo con la ruta de archivo opcional aquí // la ruta del archivo es `None` si el usuario cierra el diálogo
o, alternativamente:
use tauri_plugin_dialog::DialogExt;
app.dialog() .file() .add_filter("My Filter", &["png", "jpeg"]) .pick_file(|file_path| { // devuelve un `Option` de file_path, o `None` si el usuario cierra el diálogo });
© 2025 Tauri Contributors. CC-BY / MIT