Show Menu
ARGOMENTI×

Introduction to authoring adaptive forms

Panoramica

I moduli adattivi consentono di creare moduli coinvolgenti, reattivi, dinamici e adattivi. AEM Forms offre un’interfaccia utente intuitiva e componenti forniti con il prodotto per creare e utilizzare moduli adattivi. È possibile scegliere di creare un modulo adattivo basato su un modello di modulo o uno schema oppure senza un modello di modulo. È importante scegliere con attenzione il modello di modulo che non solo si adatta alle proprie esigenze ma che amplia gli investimenti infrastrutturali e le risorse esistenti. Per creare un modulo adattivo è possibile scegliere tra le seguenti opzioni:
  • Uso di un modello dati modulo L'integrazione dei dati consente di integrare entità e servizi da origini dati diverse in un modello di dati del modulo che è possibile utilizzare per creare moduli adattivi. Scegliere il modello dati del modulo se il modulo adattivo creato prevede il recupero e la scrittura di dati da e verso più origini dati.
  • Utilizzando un modello di modulo XDP Si tratta di un modello di modulo ideale se si dispone di investimenti in moduli XFA o XDP. Fornisce un modo diretto per convertire i moduli basati su XFA in moduli adattivi. Eventuali regole XFA esistenti vengono conservate nei moduli adattivi associati. I moduli adattivi risultanti supportano i costrutti XFA, ad esempio convalide, eventi, proprietà e pattern.
  • L'utilizzo di uno schema XML Definition (XSD) o di uno schema XML e JSON rappresenta la struttura in cui i dati vengono prodotti o utilizzati dal sistema back-end della tua organizzazione. È possibile associare lo schema a un modulo adattivo e utilizzarne gli elementi per aggiungere contenuto dinamico al modulo adattivo. Gli elementi dello schema saranno disponibili per l'uso nella scheda Oggetti modello dati del browser Contenuto durante la creazione di moduli adattivi.
  • Uso di uno o più modelli di modulo
I moduli adattivi creati con questa opzione non utilizzano alcun modello di modulo. I dati XML generati da tali moduli hanno una struttura semplice con campi e valori corrispondenti.
Per ulteriori informazioni sulla creazione di un modulo adattivo, vedere Creazione di un modulo adattivo.

Interfaccia utente per la creazione di moduli adattivi

L’interfaccia touch per la creazione di moduli adattivi è intuitiva e fornisce:
  • Funzionalità di trascinamento
  • Componenti per moduli standard
  • Archivio integrato per le risorse
Quando si crea un nuovo modulo o si modifica un modulo adattivo esistente, si utilizzano i seguenti elementi dell'interfaccia utente:
A. Barra laterale B. Pagina della barra degli strumenti C. Pagina del modulo adattivo

Barra degli strumenti della pagina

La barra degli strumenti della pagina nella parte superiore contiene opzioni che consentono di visualizzare l'anteprima del modulo, modificare le proprietà del modulo e il layout del modulo. È possibile visualizzare l'anteprima del modulo al momento della creazione e apportare le modifiche necessarie. Nella barra degli strumenti della pagina sono disponibili:
  • Attiva/disattiva pannello laterale laterale: Consente di mostrare o nascondere la barra laterale.
  • Informazioni pagina : Consente di visualizzare le proprietà della pagina, pubblicare/annullare la pubblicazione di un modulo, avviare un flusso di lavoro del modulo e aprire il modulo nell’interfaccia classica.
  • Emulatore : Consente di emulare l'aspetto del modulo per dimensioni di visualizzazione diverse, ad esempio tablet e telefoni.
  • Modifica : Consente di selezionare altre modalità, ad esempio: Modifica, Stile, Sviluppatore e Progettazione .
    • Modifica : Consente di modificare le proprietà del modulo e dei suoi componenti. Ad esempio, aggiungere un componente, rilasciare un’immagine e specificare campi obbligatori.
    • Stile : Consente di formattare l'aspetto dei componenti del modulo. Ad esempio, in modalità stile, potete selezionare un pannello e specificarne il colore di sfondo.
    • Sviluppatore : Consente a uno sviluppatore di:
      • Scopri di quali moduli sono composti.
      • Eseguire il debug di ciò che sta accadendo dove e quando, che a sua volta aiuta a risolvere i problemi.
    • Progettazione : Consente di abilitare o disabilitare componenti personalizzati, o componenti out-of-the-box non elencati nella barra laterale.
  • Anteprima : Consente di visualizzare un'anteprima dell'aspetto del modulo al momento della pubblicazione.

Component toolbar

Quando selezionate un componente, compare una barra degli strumenti che consente di utilizzarlo. Sono disponibili opzioni per tagliare, incollare, spostare e specificare le proprietà dei componenti. Le opzioni disponibili sono:
A. Configure : Toccando Configura , le proprietà del componente sono visibili nella barra laterale. La configurazione di queste proprietà consente di personalizzare l'esperienza di acquisizione dei dati. Potete modificare il nome dell’elemento del componente, specificare il testo dell’etichetta nel campo Titolo del componente. Il nome dell’elemento consente di acquisire i valori immessi dall’utente mediante il componente. Nelle proprietà del componente, potete specificare il comportamento del componente e gestire l’input dell’utente. Configurare le proprietà nella barra laterale per acquisire i dati utente e utilizzarli per un’ulteriore elaborazione. Le proprietà per il contenitore di moduli adattivi consentono di specificare librerie client, layout, temi, impostazioni del documento di registrazione, impostazioni di salvataggio, impostazioni di invio e impostazioni di metadati.
B. Copia : È possibile utilizzare l'opzione Copia per copiare un componente e incollarlo in altre aree del modulo. Quando incollate un componente, il componente incollato riceve un nuovo nome di elemento ma mantiene le proprietà del componente copiato.
C. Taglia : È possibile utilizzare l’opzione Taglia per spostare un componente da una posizione all’altra nel modulo adattivo.
D. Elimina : Consente di eliminare il componente dal modulo.
E. Inserisci : Consente di inserire un componente sopra il componente selezionato.
F. Incolla : Consente di incollare il componente tagliato o copiato utilizzando le opzioni descritte sopra.
G. Modifica regole : Consente di aprire l'editor delle regole. Per ulteriori informazioni, vedere Editor Editor di regole per moduli adattivi regole.
H. Gruppo : Consente di selezionare più componenti per tagliare, copiare o incollare più componenti contemporaneamente.
I. Elemento padre : Consente di selezionare l’elemento padre di un componente. Ad esempio, un campo di testo si trova all'interno di una sottosezione, che risiede in una sezione. La sezione si trova nel pannello principale della guida e il contenitore di modulo adattivo è l'elemento principale di un pannello principale della guida. Per un componente, è possibile visualizzare tutte le opzioni con i bordi inferiori ordinati della gerarchia.
Ad esempio, toccando Elemento padre per una casella di testo, è possibile visualizzare:
  • Sottosezione
  • Sezione
  • guideRootPanel
  • Contenitore di moduli adattivi
J. Altri : Offre ulteriori opzioni per l’utilizzo del componente selezionato.
  • Visualizza espressione SOM
  • Salvare un pannello come frammento (solo per i pannelli)
  • Aggiungere un pannello secondario (solo per i pannelli)
  • Barra degli strumenti del pannello Aggiungi (solo per i pannelli)
  • Sostituisci (non per i pannelli)

Adaptive form page

La pagina del modulo adattivo è il modulo effettivo. È come qualsiasi altra pagina WCM modellata come il componente WCM cq:Page . L'immagine seguente mostra la struttura del contenuto di un tipico modulo adattivo.
La struttura del contenuto contiene in genere i seguenti componenti primari:
  • guideContainer : Livello principale di un modulo adattivo, contrassegnato come Inizio del modulo adattivo nell’interfaccia utente del modulo adattivo. In questo componente potete specificare:
    • Layout mobile del modulo adattivo: Definisce l’aspetto del modulo sui dispositivi mobili.
    • Pagina di ringraziamento: Definisce la pagina in cui l'utente viene reindirizzato dopo l'invio del modulo.
    • Invia azione : Definisce la modalità di elaborazione del modulo sul server dopo l'invio del modulo da parte dell'utente.
    • Attribuzione stile : Specifica il percorso del file CSS utilizzato per personalizzare l'aspetto del modulo.
  • rootPanel : Pannello principale di un modulo adattivo. Può contenere sottopannelli sotto il nodo degli elementi. A ciascun pannello, incluso il pannello principale, può essere associato un layout. Il layout del pannello determina il layout del modulo. Ad esempio, nel layout Accordion*, *i relativi elementi sono disposti come passi Accordion.
  • barra degli strumenti : A un contenitore di moduli adattivi è associata una barra degli strumenti globale, globale per il modulo. Questa barra degli strumenti può essere aggiunta utilizzando l’azione Aggiungi barra degli strumenti nella barra di modifica, che consente agli autori di aggiungere azioni quali Invia, Salva, Ripristina e così via.
  • risorse : Questo nodo contiene informazioni aggiuntive utilizzate per la creazione di moduli. Ad esempio, dettagli relativi al modello di modulo, alla localizzazione e così via).