Introducción a Visualforce

Dado que los componentes web Lightning son la mejor manera de crear interfaces de usuario con Salesforce, diríjase a la ruta Migración de componentes web Visualforce a Lightning para aprender a usar LWC y cumplir con los estándares web actuales. De lo contrario, continúe con esta insignia para obtener más información sobre Visualforce.

Objetivos de aprendizaje

Después de completar esta unidad, podrá:

• Describir qué es Visualforce y para qué se utiliza.
  
• Indicar tres o más ubicaciones en las que poder utilizar Visualforce.
  

Introducción a Visualforce

Visualforce es un marco de desarrollo web que permite a los desarrolladores crear interfaces de usuario personalizadas y sofisticadas para aplicaciones de escritorio y móviles que se pueden alojar en la plataforma Lightning. Puede utilizar Visualforce para crear aplicaciones con el estilo de Lightning Experience, así como crear su propia interfaz completamente personalizada.

Visualforce permite a los desarrolladores ampliar las funciones integradas de Salesforce, sustituirlas con nuevas funciones y crear aplicaciones completamente nuevas. Utilice funciones potentes e integradas del controlador estándar o redacte su propia lógica empresarial personalizada en Apex. Puede crear una función para su propia organización o crear aplicaciones para venta en AppExchange.

El desarrollo de aplicaciones de Visualforce es familiar para cualquier usuario que haya creado aplicaciones web. Los desarrolladores crean páginas de Visualforce redactando componentes, HTML y elementos de estilo opcionales. Visualforce puede integrarse con cualquier marco de JavaScript o tecnología web estándar para obtener una interfaz de usuario más enriquecida y animada. Cada página es accesible mediante una URL única. Cuando alguien accede a una página, el servidor realiza cualquier procesamiento requerido por la página, representa la página en HTML y devuelve los resultados al navegador para la visualización.

Un ejemplo de página de Visualforce

Este es un breve ejemplo de una página operativa de Visualforce.

<apex:page standardController="Contact" >
	<apex:form >
		<apex:pageBlock title="Edit Contact">
			<apex:pageBlockSection columns="1">
				<apex:inputField value="{!Contact.FirstName}"/>
				<apex:inputField value="{!Contact.LastName}"/>
				<apex:inputField value="{!Contact.Email}"/>
				<apex:inputField value="{!Contact.Birthdate}"/>
			</apex:pageBlockSection>
			<apex:pageBlockButtons >
				<apex:commandButton action="{!save}" value="Save"/>
			</apex:pageBlockButtons>
		</apex:pageBlock>
	</apex:form>
</apex:page>

Esta página muestra un formulario de introducción de datos de contacto.

En solo una docena de líneas de marcado, esta página hace mucho.

• Conecta con el controlador estándar de Visualforce, una parte del marco de Visualforce que proporciona acceso y modificación automáticos a los datos, acciones estándar y mucho más.
  
• Cuando se accede sin un Id. de registro, la página muestra un formulario de introducción de datos en blanco. Cuando hace clic en Guardar, se crea un nuevo registro desde los datos del formulario.
  
• Cuando se accede con un Id. de registro, la página busca los datos para ese registro de contacto y lo muestra en un formulario modificable. Cuando hace clic en Guardar, se vuelven a guardar sus cambios para el contacto en la base de datos.
  
• Cada campo de entrada es inteligente acerca de cómo presenta su valor.
  

• El campo de correo electrónico sabe qué aspecto tiene una dirección de correo electrónico válida y muestra un error si se introduce un correo electrónico no válido.
  
• El campo de fecha muestra un widget de fecha cuando hace clic en el campo para facilitar la introducción de una fecha.
  

• El botón Guardar llama al método de acción save, una de las acciones estándar proporcionadas por el controlador estándar.
  

Dónde puede utilizar Visualforce

Salesforce proporciona varias formas para utilizar Visualforce en su organización. Puede ampliar las funciones integradas de Salesforce, sustituirlas con nuevas funciones y crear aplicaciones completamente nuevas.

A continuación, se enumeran algunas de las maneras con las que puede agregar Visualforce a su organización. Recuerde que estas capturas de pantalla muestran ejemplos y no reflejan las aplicaciones y páginas personalizadas en su organización.

Abrir una página de Visualforce desde el Iniciador de aplicación

Sus aplicaciones de Visualforce y fichas personalizadas están todas disponibles desde el Iniciador de aplicación. Para abrir el Iniciador de aplicación, haga clic en en la barra de navegación. Para ver todos sus elementos y aplicaciones, seleccione Ver todo.

Haga clic en una aplicación personalizada (1) para activarla. Los elementos de la aplicación aparecen en la barra de navegación, incluyendo cualquier ficha de Visualforce que haya agregado a la aplicación. Recuerde que necesita agregar sus páginas de Visualforce a fichas para que sean accesibles desde el Iniciador de aplicación. Las fichas de Visualforce que no son aplicaciones pueden encontrarse en Todos los elementos (2).

Agregar una página de Visualforce a la barra de navegación

Como se describe en el ejemplo anterior, puede agregar fichas de Visualforce a una aplicación; estas aparecen como elementos en la barra de navegación de la aplicación.

Mostrar una página de Visualforce dentro de un formato de página estándar

Amplíe los formatos de página incrustando páginas de Visualforce en ellos para mostrar contenido completamente personalizado en una página estándar. Este comportamiento es idéntico a Salesforce Classic, excepto que necesita ver los detalles de un registro para ver el formato de página.

Agregar una página de Visualforce como un componente en Generador de aplicaciones Lightning

Cuando crea una página de aplicación personalizada en Generador de aplicaciones Lightning, puede agregar una página de Visualforce a la página utilizando el componente Visualforce.

Debe activar “Available for Lightning Experience, Lightning Communities, and the mobile app” (Disponible para Lightning Experience, Comunidades Lightning y la aplicación móvil) para una página de Visualforce con el fin de que esté disponible en Generador de aplicaciones Lightning.

Iniciar una página de Visualforce como una acción rápida

Aunque su colocación en la interfaz de usuario de Lightning Experience es bastante diferente de Salesforce Classic, el proceso de agregar acciones rápidas es más o menos el mismo. Agréguelas al área apropiada del publicador en el formato de página del objeto.

Mostrar una página de Visualforce sustituyendo botones o vínculos estándar

Puede sustituir las acciones disponibles en un objeto con una página de Visualforce. Cuando el usuario hace clic en un botón o vínculo que se ha sustituido, se muestra su página en vez de la página estándar. La configuración es prácticamente idéntica a Salesforce Classic. No lo dude, ¡le costará bastante creer que está en Lightning Experience cuando defina la sustitución de una acción!

Mostrar una página de Visualforce utilizando botones o vínculos personalizados

Puede crear nuevas acciones para sus objetos, en la forma de botones y vínculos, definiéndolas en un objeto. Los botones y vínculos de JavaScript no se admiten en Lightning Experience, pero los elementos (y la URL) de Visualforce sí. El proceso de definición de botones y vínculos de Visualforce es idéntico al de Salesforce Classic, así que no lo mostraremos aquí.

Recursos

• Guía del desarrollador de Visualforce
• Dreamforce Session: Introducción a Visualforce
• Trailhead: Generador de aplicaciones Lightning
• Trailhead: Utilizar Visualforce en Lightning Experience