Empiece a realizar un seguimiento de su progreso
Inicio de Trailhead
Inicio de Trailhead

Empezar a trabajar con 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 de negocios 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 permitir 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.
Descripción general de procesamiento de solicitud de Visualforce

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 ingreso de datos de contacto.
Modificar formulario de contacto
En solo una docena de lineas de marcas, 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 ingreso 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 email sabe qué aspecto tiene una dirección de email válida y muestra un error si se ingresa un email no válido.
    • El campo de fecha se muestra un widget de fecha cuando hace clic en el campo para facilitar el ingreso 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 en las que puede 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 están mostrando 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 Icono del Iniciador de aplicación en la barra de navegación. Para ver todas sus aplicaciones y elementos, seleccione Ver todo.
Fichas y aplicaciones del Iniciador de aplicación

Haga clic en una aplicación personalizada (1) para activarla. Los elementos en la aplicación aparecen en la barra de navegación, incluyendo cualquier ficha de Visualforce que agregó a la aplicación. Recuerde que necesita agregar sus páginas de Visualforce a fichas para que sean accesibles en 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 precedente, puede agregar fichas de Visualforce a una aplicación y aparecen como elementos en la barra de navegación de la aplicación.
Ficha Barra de navegación con Visualforce

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. El comportamiento aquí es idéntico a Salesforce Classic, excepto que necesita ver los detalles de un registro para ver el formato de página.
Formato de página de Visualforce en Lightning Experience

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

Cuando cree 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.
Agregar una página de Visualforce a la página de Lightning App Builder
Nota

Nota

Debe activar “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 el Generador de aplicaciones Lightning.

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

Acción global en Lightning Experience
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 en más o menos el mismo. Agréguelas al área apropiada del publicador en el formato de página del objeto.
Incorporación de acciones rápidas al formato de página
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 sustituyó, su página se muestra 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 una sustitución de acción!
Sustituir la acción Modificar en el objeto Contacto

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 (y la URL) sí lo están. 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í.