Cómo agregar herramientas de anotación, redacción y edición de formularios a un visor de PDF de JavaScript

A medida que más aplicaciones empresariales se trasladan al entorno web, tiene sentido que cosas como compartir y editar documentos también se trasladen al navegador. Sin embargo, en muchas situaciones, los usuarios necesitarán hacer algo más que simplemente ver un documento PDF.

Es posible que necesiten agregar anotaciones para proporcionar información adicional, redactar información personal del documento o incluso completar campos de formulario dentro del documento. Afortunadamente, el visor de PDF JavaScript de Document Solutions facilita la adición de esta funcionalidad a su aplicación JavaScript .

En este artículo, repasaremos las siguientes características del visor de PDF JavaScript de Document Solutions:

• Editor de anotaciones para visor de PDF JavaScript

• Características clave de las anotaciones

• Redactar contenido de un PDF

• Editor de formularios para visor de PDF JavaScript

• Funciones clave del editor de formularios

• Opciones de edición adicionales para el visor de PDF

  
  

Ahora, echemos un vistazo a estas características.

Editor de anotaciones para visor de PDF JavaScript

Las herramientas de anotación en el visor de PDF JavaScript de Document Solutions ayudarán a los usuarios a revisar y marcar información importante en sus documentos PDF. También podrán agregar, modificar y eliminar anotaciones de documentos PDF existentes conservando el contenido original.

Los usuarios pueden hacer anotaciones en el PDF y comentar y responder a los comentarios de los demás. Con la capacidad de ocultar anotaciones, los usuarios pueden ver e imprimir fácilmente los documentos originales y, si lo necesitan, también pueden imprimir copias que incluyan sus anotaciones. El Editor de anotaciones enumera todas las anotaciones en su documento, lo que le permite acceder y modificar las anotaciones existentes:

Casos de uso y beneficios

Normalmente, los usuarios confían en Adobe Acrobat para anotar archivos PDF. Con un visor que incluye funciones de edición, sus usuarios pueden anotar sus documentos directamente en la aplicación sin necesidad de moverse entre aplicaciones. Como puede ver, un visor que incluya capacidades de edición puede optimizar significativamente el flujo de trabajo de una empresa.

A continuación se muestran solo algunos ejemplos en los que esta funcionalidad sería beneficiosa:

• Un empleado de una empresa quiere enviar informes financieros a la dirección para su revisión. La gerencia puede abrir los informes en línea en el visor de PDF, usar anotaciones para sugerir cambios e informar al empleado que se han realizado comentarios. Luego, el empleado puede abrir el documento en el editor en línea y actualizarlo en el visor utilizando las anotaciones realizadas.

• Un empleado tiene dudas sobre la estructura salarial de su empresa. Pueden leer los documentos en el Visor de PDF, redactar información confidencial y marcar áreas que necesitan aclaración mediante herramientas de anotación.

• Un diseñador de sitios web prepara capturas de pantalla para un sitio web y las combina en un PDF para enviarlas para su revisión. Los revisores marcan las áreas que necesitan cambios utilizando las herramientas de anotación.

  
  

Las herramientas de anotación en el Visor de PDF JavaScript de Document Solutions hacen posibles todos estos escenarios. Examinemos las características incluidas con Anotaciones.

Características clave de las anotaciones

Las siguientes funciones clave están disponibles con anotaciones:

• Edite archivos PDF con una variedad de anotaciones
• Marque información importante a través de una interfaz de usuario fácil de usar
• Agregar, modificar y eliminar anotaciones de archivos PDF nuevos y existentes
• Mejore el contenido del PDF y aplique propiedades específicas de las anotaciones
• Imprima el PDF original sin modificaciones
• Guarde el PDF modificado con anotaciones en el cliente

Edite archivos PDF con una variedad de anotaciones

El visor de PDF de Document Solutions admite todas las anotaciones que necesita para revisar sus documentos PDF. Puedes agregar lo siguiente:

• Anotaciones de texto (nota adhesiva): agrega texto o notas adhesivas al PDF
• Anotación de texto libre: agrega una nota que siempre está visible en el PDF
• Anotación en tinta: dibuja garabatos a mano alzada en el PDF
• Anotación cuadrada: agrega una forma de rectángulo/cuadrado en el PDF
• Anotación de círculo: agrega una forma de círculo en el PDF
• Anotación de línea: agrega una línea recta en el PDF
• Anotación de polilínea: agrega formas cerradas o abiertas con múltiples bordes en el PDF
• Anotación de polígono: agrega un polígono al PDF
• Anotación de archivo adjunto: adjunte un archivo al documento, que se incrustará en el PDF
• Anotación de sonido: agrega sonido (formato .au, .aiff o .wav) importado desde un archivo o grabado desde el micrófono de la computadora.
• Anotación de enlace: agrega enlaces que pueden vincular a diferentes páginas web, llamar a motores de búsqueda y ejecutar JavaScript.
• Anotación de sello: utilice imágenes, ya sea localmente o desde un servidor, como anotaciones en el PDF.

Marque información importante a través de una interfaz de usuario fácil de usar

Las herramientas de anotación de Document Solutions PDF Viewer tienen una interfaz de usuario intuitiva que permite a los usuarios dibujar anotaciones en el PDF. El Visor de PDF incluye una barra de herramientas de anotaciones y un editor independientes para agregar anotaciones, modificar sus propiedades o eliminar anotaciones del PDF existente.

El panel Propiedades muestra una lista de anotaciones en su documento. Puede seleccionar cualquier anotación en el PDF, aplicar propiedades específicas de la anotación desde el panel izquierdo o eliminar la anotación.

En la pestaña Página del panel, puede ver cuántas anotaciones existen en su página. Cuando envía su documento para su revisión, puede identificar la cantidad de ediciones realizadas.

Agregar, modificar y eliminar anotaciones de archivos PDF nuevos y existentes

Puede editar las anotaciones existentes o eliminarlas en cualquier momento mientras revisa los archivos PDF en el Visor de PDF de JavaScript. Para agregar una anotación, simplemente haga clic en el botón Editor de anotaciones en el panel izquierdo y verá la barra de herramientas de anotaciones . Haga clic en cualquier anotación y dibuje directamente en el PDF. Seleccione la anotación y verá las propiedades de la anotación mostradas en el panel izquierdo. También puede cargar un PDF con anotaciones existentes, seleccionar la anotación, modificar las propiedades o eliminar la anotación del panel de propiedades.

Mejore el contenido del PDF y aplique propiedades específicas de las anotaciones

Los usuarios encontrarán un amplio soporte para configurar propiedades específicas de anotaciones en el visor. Puede agregar texto enriquecido, establecer el color del texto, agregar un borde, establecer el autor y el tema, agregar una respuesta, establecer la posición Límites/X/Y para las anotaciones y mucho más desde el panel de Propiedades.

Imprime el PDF sin modificaciones

Si desea ver el PDF original, puede ocultar las anotaciones usando el botón Ocultar e imprimir el PDF sin anotaciones.

Guarde el PDF modificado con anotaciones en el cliente

Haga clic en el botón Guardar para aplicar cambios a su PDF y guardar las anotaciones. El visor debe estar conectado a un servidor que ejecute DsPdf para guardar los cambios. La lista de cambios y el PDF original se envían al servidor, donde DsPdf aplica los cambios. Luego, envía el PDF modificado al cliente, donde el usuario puede guardarlo.

Redactar contenido de un PDF

La opción Redactar anotación o Redactar una región en la barra de herramientas le ayuda a marcar secciones confidenciales para su eliminación. Puede configurar el color de borde de marca y el color de relleno de marca para permitir a los usuarios marcar el área para la redacción. El usuario puede configurar estas propiedades para que se apliquen al pasar el cursor sobre el contenido redactado, es decir, las propiedades Color de relleno de superposición , Texto superpuesto , Alineación de texto superpuesto y Repetir texto . Todas estas opciones aparecerán en su PDF cuando se elimine el contenido del documento.

También puede redactar contenido específico desde el botón Aplicar redacción en el panel Propiedades. Una vez aplicada la redacción, puede restablecerla utilizando el botón Restablecer redacción en la barra de herramientas. Sin embargo, al guardar el PDF, ya no se puede acceder a la información redactada y las redacciones aplicadas no se pueden restablecer.

Puede aplicar anotaciones de redacción individuales o hacer clic en el botón Aplicar todas las ediciones para aplicar las ediciones en todo el documento. Cuando guarda el PDF con las censuras aplicadas, el contenido censurado se eliminará por completo del PDF. Los usuarios no pueden seleccionar ni copiar el material eliminado a otro documento ni utilizar otras herramientas de PDF para leer el contenido redactado.

Editor de formularios para visor de PDF JavaScript

Con el Editor de formularios, ahora puede diseñar formularios PDF interactivos en línea. El Editor le ayudará a utilizar varios campos de formulario y propiedades avanzadas al crear sus formularios. También puede completar y enviar el formulario en línea .

Las características del Editor de formularios incluyen:

• Crea nuevos formularios PDF desde cero
• Diseñe, complete, envíe y restablezca formularios PDF
• Recopile datos directamente del usuario y complete formularios PDF
• Complete los datos en los campos del formulario desde una fuente externa (base de datos, JSON , etc.)
• Agregar campos de formulario a documentos PDF existentes
• Editar campos de formulario en documentos PDF existentes
• Agregue funcionalidad JavaScript a formularios PDF
• Aplicar una amplia gama de propiedades a los campos de formulario.
• Barra de herramientas de interfaz de usuario y panel de propiedades rápidos e intuitivos para diseñar formularios PDF
• Cree una interfaz de usuario personalizada : omita los campos innecesarios en su barra de herramientas

La necesidad de un diseñador de formularios PDF basado en la web

• El formato PDF es el formato preferido para el diseño y la apariencia. Por lo tanto, aunque los formularios HTML son populares, los formularios PDF siempre tendrán el aspecto que usted los diseñó.

• La mayoría de las aplicaciones están basadas en la web y Document Solutions PDF Viewer es una herramienta en línea integral para crear formularios PDF, editar archivos PDF, agregar anotaciones y guardar el PDF modificado en el cliente. Es una forma más rápida de generar y conservar archivos PDF en una sola aplicación.

• Los desarrolladores pueden crear un formulario PDF en Acrobat y compartirlo en línea. Sin embargo, el PDF abierto en el visor predeterminado del navegador no se puede personalizar, ni los desarrolladores pueden usar acciones JavaScript adicionales en el formulario, como enviar el contenido o completar el contenido con datos del formulario. Document Solutions PDF Viewer admite otras acciones de JavaScript que puede configurar en el formulario con las acciones Enviar y Restablecer.

• Puede usar Microsoft Word para crear un formulario o puede usar un editor de PDF. Crear un formulario PDF en Word puede resultar un desafío ya que requiere herramientas de edición complejas. Un diseñador de formularios con visor de PDF de Document Solutions es intuitivo e incluye una interfaz de usuario fácil de usar y el panel de propiedades que establece las propiedades deseadas en los campos del formulario.

• Puede diseñar formularios PDF para verlos y completarlos en cualquier navegador. Tampoco tienes que preocuparte por su apariencia o si el usuario final tiene Adobe Acrobat.

Diferentes tipos de formularios PDF que puedes crear

Puede crear los siguientes formularios PDF con el Diseñador de formularios:

• Formularios de inscripción (ejemplos: evento, cursos universitarios, membresía, historial de pacientes, concursos, etc.)

• Formularios de solicitud (ejemplos: solicitud de empleo, solicitud de préstamo, etc.)

• Formularios de comentarios (ejemplos: eventos, sitio web, comercio electrónico, etc.)

• Formularios de solicitud (ejemplos: alquiler, información, formularios de pago, etc.)

  
  

Funciones clave del Diseñador de formularios PDF

El visor de PDF JavaScript de Document Solutions admite varios tipos de campos de formulario que ayudarán a que su PDF sea interactivo y completo:

• Campo de texto: permite a los usuarios ingresar texto como nombre, número de teléfono, etc.
• Campo de contraseña: permite a los usuarios ingresar la contraseña de un documento.
• Campo de área de texto: le permite agregar texto de formato largo, como experiencia laboral, dirección, etc.
• Campo CheckBox: permite al usuario seleccionar múltiples opciones
• Campo ComboText: le permite agregar texto en posiciones igualmente espaciadas (por ejemplo, ingresando la fecha, el correo electrónico, etc., en un formulario de registro).
• Campo ComboBox: le permite elegir un elemento de un menú emergente o escribir un valor
• Campo ListBox: muestra una lista de opciones para seleccionar
• Campo PushButton: un botón interactivo que activa acciones específicas, como abrir archivos individuales, mostrar un mensaje emergente, etc.
• Campo RadioButton: muestra un grupo de opciones entre las que el usuario puede seleccionar solo una.
• Campo del botón Enviar: le permite enviar el formulario completo
• Campo del botón Restablecer: le permite restablecer el formulario

UI fácil de usar para diseñar formularios PDF

Las herramientas del editor de formularios de Document Solutions tienen una interfaz de usuario fácil de usar para agregar campos de formulario al PDF. El Visor de PDF incluye una barra de herramientas y un editor de campos de formulario separados para agregar campos de formulario, modificar las propiedades o eliminarlos del PDF existente. El panel Propiedades muestra una lista de campos de formulario en su documento. Puede seleccionar cualquier campo de formulario en el PDF, aplicar propiedades específicas del campo de formulario desde el panel izquierdo y eliminar el campo de formulario. En la pestaña Página del panel, también puede ver cuántos campos de formulario existen en su página.

Agregar, modificar y eliminar campos de formulario de formularios PDF nuevos o existentes

En cualquier momento, mientras diseña un formulario PDF en el visor en línea, puede cambiar los campos del formulario existentes y también eliminarlos. Para agregar un campo de formulario, simplemente haga clic en el botón Editor de formularios en el panel izquierdo y verá la barra de herramientas del Editor de formularios. Haga clic en cualquier campo del formulario y dibuje directamente en la página PDF. Seleccione el campo del formulario y verá las propiedades del campo del formulario mostradas en el panel izquierdo. También puede cargar un formulario PDF con campos de formulario existentes, seleccionar el campo del formulario, aplicar propiedades o elegir la opción Eliminar en el panel de propiedades para eliminar el campo del formulario.

Mejore el formulario PDF con propiedades específicas del campo del formulario

Existe un amplio soporte para configurar las propiedades específicas del campo de formulario para cada campo de formulario admitido por el visor. Entre algunas características generales, puede configurar Nombre, Sólo lectura, Valor, Alinear, Color de fondo, Longitud máxima, propiedades de borde, Tamaño de fuente y establecer la posición Límites/X/Y de los campos del formulario.

Además, puede establecer la propiedad Requerido en campos de texto como TextField, PasswordField, TextArea y ComboText Field.

Imprima el formulario PDF original

Si desea ver el archivo PDF original, puede ocultar los campos del formulario usando el botón Ocultar en la barra de herramientas principal y ver o imprimir el archivo PDF sin los campos del formulario.

Guarde el PDF recién diseñado con campos de formulario en el cliente

Aplique los cambios a su documento PDF y guarde los campos del formulario. Esta operación necesita un producto DsPdf en el servidor para obtener el PDF original y la lista de cambios, aplicar los cambios y enviar el PDF modificado al cliente.

Complete y envíe formularios PDF

Después de diseñar el formulario PDF, puede permitir que sus usuarios completen y envíen el formulario PDF al espectador. Los datos del formulario se envían a la base de datos o se generan como un PDF a partir de los valores completados. También puede importar datos de formulario a un formulario PDF desde la base de datos al visor.

Opciones de edición adicionales para el visor de PDF

Además de las anotaciones, redacciones y campos de formulario, puede utilizar las siguientes funciones para trabajar y editar documentos PDF.

Crear documentos PDF en blanco

Es posible utilizar el Visor de PDF para crear documentos PDF usando el botón Nuevo documento . Puede diseñar el PDF o un formulario PDF a través de las herramientas Anotación y Editor de formularios .

Agregar páginas nuevas y eliminar páginas en documentos PDF

Puede agregar una nueva página a un documento PDF existente o a un documento PDF original usando el botón Nueva página y usar el botón Eliminar para eliminar las páginas.

Seleccionar y eliminar anotaciones/campos de formulario de documentos PDF

Puede seleccionar los campos de anotación/formulario agregados a un documento PDF en la vista Editor de anotaciones y Editor de formularios en cualquier momento. Utilice el botón Eliminar para eliminar las anotaciones o los campos de formulario de documentos PDF nuevos o existentes.

Deshacer y rehacer cambios

Si desea deshacer o rehacer sus cambios en las anotaciones o campos de formulario, puede usar los botones Deshacer/Rehacer tanto en el Editor de anotaciones como en el de formularios. Estos botones registran sus cambios de forma incremental y puede seguir deshaciendo o rehaciendo sus acciones hasta que esté satisfecho con el resultado.

Conclusión

Con eso, hemos repasado las funciones de anotaciones, redacción y campos de formulario del visor de PDF JavaScript de Document Solutions. Como ha visto, no podría ser más fácil agregar sus propias anotaciones, redactar información que no debería mostrarse y agregar/editar campos de formulario para crear formularios PDF interactivos.