Inleiding tot het ontwerpen van adaptieve formulieren introduction-to-authoring-adaptive-forms
Overzicht overview
Met adaptieve formulieren kunt u aantrekkelijke, responsieve, dynamische en adaptieve formulieren maken. AEM Forms biedt een intuïtieve gebruikersinterface en kant-en-klare componenten voor het maken van en werken met adaptieve formulieren. U kunt desgewenst een adaptief formulier maken op basis van een formuliermodel of -schema of zonder formuliermodel. Het is belangrijk om zorgvuldig het formuliermodel te kiezen dat niet alleen aan uw vereisten voldoet, maar ook uw bestaande infrastructurele investeringen en middelen uitbreidt. U kunt uit de volgende opties kiezen om een adaptief formulier te maken:
-
Gebruikend een model van vormgegevens
de integratie van Gegevenslaat u entiteiten en de diensten van verschillende gegevensbronnen in aan een model integreren van vormgegevens dat u kunt gebruiken om adaptieve vormen tot stand te brengen. Kies een formuliergegevensmodel als het adaptieve formulier dat u maakt, bestaat uit het ophalen en schrijven van gegevens van en naar meerdere gegevensbron. -
Gebruikend een Malplaatje van de Vorm XDP
Het is een ideaal formuliermodel als u investeert in XFA-gebaseerde of XDP-formulieren. Dit biedt een directe manier om uw XFA-formulieren om te zetten in adaptieve formulieren. Bestaande XFA-regels blijven behouden in de bijbehorende adaptieve formulieren. De resulterende adaptieve formulieren ondersteunen XFA-constructies, zoals validaties, gebeurtenissen, eigenschappen en patronen. -
Gebruikend een Definitie van het Schema van XML (XSD) of een Schema JSON
De schema's van XML en JSON vertegenwoordigen de structuur waarin de gegevens door het achterste deelsysteem in uw organisatie worden geproduceerd of worden verbruikt. U kunt het schema koppelen aan een adaptief formulier en de elementen ervan gebruiken om dynamische inhoud toe te voegen aan het aangepaste formulier. De elementen van het schema zijn beschikbaar voor gebruik op het tabblad Gegevensmodelobjecten van de browser Inhoud wanneer u adaptieve formulieren maakt. -
Gebruikend niets of zonder een vormmodel
Voor adaptieve formulieren die met deze optie worden gemaakt, wordt geen formuliermodel gebruikt. De XML-gegevens die op basis van dergelijke formulieren worden gegenereerd, hebben een vlakke structuur met velden en bijbehorende waarden.
Voor meer informatie over het creëren van een adaptieve vorm, zie Creërend een adaptieve vorm.
UI voor het schrijven van adaptieve formulieren adaptive-form-authoring-ui
De interface voor het optimaliseren van aanrakingen voor het ontwerpen van adaptieve formulieren is intuïtief en biedt:
- Functionaliteit voor slepen en neerzetten
- Standaardformuliercomponenten
- Geïntegreerde opslagplaats voor middelen
Wanneer u een bestaand adaptief formulier maakt of bewerkt, gebruikt u de volgende UI-elementen:
A. Sidebar B. de toolbar van de Pagina C. Aangepaste vormpagina
Zijbalk sidebar
Met de zijbalk kunt u
- Zie formulierinhoud zoals deelvensters, componenten, velden en indeling.
- Eigenschappen van componenten bewerken.
- Zoek, bekijk en gebruik middelen in uw AEM DAM-opslagplaats (Digital Asset Management).
- Voeg componenten toe aan uw formulier.
A. browser van de Inhoud B. browser van Eigenschappen C. browser van Assets D. Browser van Componenten
De zijbalk bestaat uit de volgende browsers:
-
browser van de Inhoud
In de inhoudbrowser kunt u zien-
Objecten van de Vorm
Hiermee geeft u de objecthiërarchie van het formulier weer. Auteurs kunnen naar specifieke formuliercomponenten navigeren door op dat element te tikken in de formulierobjectstructuur. Auteur kan objecten zoeken en opnieuw rangschikken vanuit deze structuur. -
Modelvoorwerpen van Gegevens
Hiermee kunt u de hiërarchie van het formuliermodel bekijken.
Hiermee kunt u formuliermodelelementen naar het aangepaste formulier slepen en neerzetten. De toegevoegde elementen worden automatisch geconverteerd naar formuliercomponenten met behoud van hun oorspronkelijke eigenschappen. U kunt gegevensmodelobjecten zien wanneer uw formulier gebruikmaakt van een XML-schema, JSON-schema of XDP-sjabloon.
-
-
browser van Eigenschappen
Hiermee kunt u de eigenschappen van een component bewerken. De eigenschappen worden gewijzigd op basis van een component. Eigenschappen van de adaptieve formuliercontainer weergeven:
Selecteer een component, dan uitgezocht > Adaptive Form Container, en selecteer dan .
-
browser van Assets
Hiermee kunt u verschillende typen inhoud segmenteren, zoals afbeeldingen, documenten, pagina's, films, enzovoort.
-
browser van Componenten
Bevat componenten die u kunt gebruiken om een adaptief formulier te maken. U kunt componenten van het aangepaste formulier naar het aangepaste formulier slepen om formulierelementen toe te voegen en toegevoegde elementen configureren volgens de vereisten. In de volgende tabel worden de componenten beschreven die in de componentbrowser worden weergegeven.
Aanbevolen procedures voor het werken met componenten best-practices
U kunt de volgende tips en trucs gebruiken bij het werken met adaptieve formuliercomponenten:
-
Elke component heeft bijbehorende eigenschappen die de weergave en functionaliteit ervan bepalen. Om de eigenschappen van een component te vormen, selecteer de component en selecteer om de componenteneigenschappen in browser van Eigenschappen te openen.
-
Een component wordt geïdentificeerd met zijn elementnaam. Wanneer u selecteert, kunt u de naam van de component veranderen door de Element Name gebiedswaarde in eigenschappen browser te veranderen. Het veld Elementnaam accepteert alleen letters, cijfers, koppeltekens (-) en onderstrepingstekens (_). Andere speciale tekens zijn niet toegestaan en de elementnaam moet met een letter beginnen.
-
U kunt de eigenschap Titel van een adaptieve formuliercomponent inline wijzigen in de formuliereditor zonder de browser Eigenschappen te openen, zolang de titel maar zichtbaar is op het formulier. Daartoe:
-
Selecteer deze optie om een component te selecteren die een eigenschap Title heeft en waarvan de eigenschap Hide title is uitgeschakeld.
-
Selecteer om de titel editable te maken.
-
Wijzig de titel en selecteer de Return-toets of selecteer een willekeurige locatie buiten de component om de wijzigingen op te slaan. Selecteer de sleutel van Esc om de veranderingen te verwerpen.
-
-
Sommige adaptieve formuliercomponenten, zoals E-mail en Telefoon, bevatten validatiepatronen die niet in de verpakking staan. U kunt echter aangepaste validatie opgeven door het veld Validation Pattern onder de accordeon Patronen bij te werken in de componenteigenschappen. Zie de componentbeschrijvingen in de bovenstaande tabel voor meer informatie over standaardvalidaties.
-
Adaptieve formuliervelden, zoals Numeriek vak en E-mail, kunnen zo worden geconfigureerd dat ze ook speciale HTML5-invoertypen bevatten. Wanneer deze velden de focus hebben op mobiele apparaten en tablets, worden op het toetsenblok specifieke alfabet, getallen en tekens vóór weergegeven die doorgaans worden gebruikt voor het invoeren van informatie in de velden. Het helpt gebruikers informatie snel ingaan zonder het moeten tussen karakterreeksen op het toetsenbord van een knevel voorzien. Als u gespecialiseerde invoer voor een component wilt toestaan, schakelt u het selectievakje Use HTML Type Number in de componenteigenschappen in.
-
U kunt een component van de Doos van de Tekst toelaten om RTF goed te keuren. Als u tekst met opmaak wilt inschakelen voor een tekstvak, schakelt u het selectievakje Allow Rich Text in de eigenschappen van de component in.
-
U kunt de componenten van het Doos van de Tekst, E-mail, en van de Telefoon aan autofill waarden voor gebieden zoals naam, adres, creditcard, telefoon, en e-mail van de informatie toelaten die in browser autofill montages wordt opgeslagen. Selecteer Enable Autofill in de componenteigenschappen en selecteer een Autofill Attribute om deze functie in te schakelen. Wanneer een gebruiker een adaptief formulier invult, worden de waarden voorgesteld vanuit het profiel Automatisch vullen in de browser of op basis van de waarden die eerder door de gebruiker zijn ingevuld. Automatisch vullen werkt alleen als de instellingen voor automatisch vullen in de browser van de gebruiker zijn ingeschakeld.
-
Geef waarden op voor keuzerondjes en selectievakjes in de indeling
{value}={text}
in componenteigenschappen. -
Met de component Bestandsbijlage kan een gebruiker standaard slechts één bestand bijvoegen. U kunt de componenteigenschappen echter configureren om meerdere bijlagen te ondersteunen. Als een gebruiker meerdere bestanden met dezelfde bestandsnaam bijvoegt, kunnen er bovendien problemen optreden in de bijlagen. Daarom wordt aanbevolen een unieke id te koppelen voor elke verzonden bijlage bij het verzenden van het formulier. Daartoe:
- Navigeer op uw AEM Forms-server naar Adobe Experience Manager > Tools > Operations > Web Console .
- Zoeken en selecteren Adaptive Forms Configuration Service .
- Schakel Make File Names Unique in het dialoogvenster Adaptive Forms Configuration Service in. Standaard is dit uitgeschakeld.
-
Om gebruikers toe te laten om een PDF vast te maken gebruikend browser Safari, zorg ervoor dat application/pdf aan het Ondersteunde bezit van de Types van Dossier van de component van de gehechtheid van het Dossier wordt toegevoegd. De adaptieve vormen die met vorige versie van AEM Forms worden gecreeerd kunnen .pdf in plaats van application/pdf in het Ondersteunde bezit van de Types van Dossier bevatten.
Voor meer beste praktijken rond adaptieve vormen, zie Beste praktijken voor het werken met adaptieve vormen.
Pagina, werkbalk page-toolbar
De pagina-werkbalk boven in het scherm bevat opties waarmee u een voorbeeld van het formulier kunt bekijken, de eigenschappen van het formulier kunt wijzigen en de indeling van het formulier kunt bewerken. U kunt een voorbeeld van het formulier bekijken wanneer u het maakt en de wijzigingen daarop aanbrengen. In de paginabooltoolbar, ziet u:
-
Knevel Zijpaneel : Laat u Zijbalk tonen of verbergen.
-
de informatie van de Pagina : Laat u paginaeigenschappen bekijken, publiceren/unpublish een vorm, een vormwerkschema beginnen, en de vorm in klassieke UI openen.
-
Emulator : Laat u het blik van uw vorm voor verschillende vertoningsgrootte zoals tabletten en telefoons emuleren.
-
geeft uit: Laat u andere wijzen zoals: Edit, Style, Developer, en Design selecteren.
-
geeft uit: Laat u de eigenschappen van de vorm en zijn componenten uitgeven. U kunt bijvoorbeeld een component toevoegen, een afbeelding neerzetten en verplichte velden opgeven.
-
Stijl: Laat u de verschijning van componenten van uw vorm opmaken. In de stijlmodus kunt u bijvoorbeeld een deelvenster selecteren en de achtergrondkleur ervan opgeven.
-
Ontwikkelaar: Laat een ontwikkelaar aan:
- Ontdek waaruit de formulieren bestaan.
- Foutopsporing waar en wanneer gebeurt, wat weer helpt om problemen op te lossen.
-
Ontwerp. Hiermee kunt u aangepaste componenten, of componenten buiten het vak die niet in het zijpaneel staan, in- of uitschakelen.
-
-
Voorproef: Laat u voorproef hoe de vorm kijkt wanneer u het publiceert.
Component, werkbalk component-toolbar
Wanneer u een component selecteert, ziet u een werkbalk waarin u de component kunt bewerken. U krijgt opties om, eigenschappen van de componenten te snijden te kleven, te bewegen en te specificeren. U kunt kiezen uit de volgende opties:
A.vormt: Wanneer u Configure selecteert, zijn de componenteneigenschappen zichtbaar in sidebar. Als u deze eigenschappen configureert, kunt u de ervaring voor het vastleggen van gegevens aanpassen. U kunt de elementnaam van de component wijzigen en de labeltekst opgeven in het veld Titel van de component. Met elementnaam kunt u waarden vastleggen die gebruikers invoeren met de component. In de componenteigenschappen geeft u het gedrag van de component op en beheert u de gebruikersinvoer. Configureer eigenschappen in de zijbalk om gebruikersgegevens vast te leggen en te gebruiken voor verdere verwerking. Met eigenschappen voor adaptieve formuliercontainers kunt u clientbibliotheken, indelingen, thema's, Document of Record-instellingen, opslaginstellingen, verzendinstellingen en metagegevensinstellingen opgeven.
B.Exemplaar: U kunt de exemplaaroptie gebruiken om een component te kopiëren en het in andere plaatsen in de vorm te kleven. Wanneer u een component plakt, krijgt de geplakte component een nieuwe elementnaam maar behoudt deze de eigenschappen van de gekopieerde component.
C.Besnoeiing: U kunt de besnoeiingsoptie gebruiken om een component van één plaats aan een andere in de adaptieve vorm te bewegen.
D. Schrapping: Laat u de component van de vorm schrappen.
E. Tussenvoegsel: Laat u een component boven de geselecteerde component opnemen.
F. Deeg: Laat u de component kleven u knipt of gebruikend de hierboven beschreven opties kopieerde.
G. geeft regels uit: Laat u de regelredacteur openen. Voor meer informatie, zie Redacteur van de Regel.
H. Groep: Laat u veelvoudige componenten selecteren als u, meer dan één component samen knippen kopiëren of wilt kleven.
I. Ouder: Laat u de ouder van een component selecteren. Een tekstveld bevindt zich bijvoorbeeld binnen een subsectie, die zich in een sectie bevindt. De sectie bevindt zich in het hoofddeelvenster van de hulplijn en de adaptieve formuliercontainer is het bovenliggende element van een hoofddeelvenster van de hulplijn. Voor een component, kunt u alle opties zien met hiërarchie gesorteerd onderaan-op.
Als u bijvoorbeeld Parent voor een tekstvak selecteert, kunt u zien:
- Onderafdeling
- Sectie
- guideRootPanel
- Container voor adaptieve vorm
J. anderen: Verstrekt meer opties om met de geselecteerde component te werken.
- SOM-expressie weergeven
- Een deelvenster opslaan als fragment (alleen voor deelvensters)
- Onderliggend deelvenster toevoegen (alleen voor deelvensters)
- Deelvensterwerkbalk toevoegen (alleen voor deelvensters)
- Vervangen (niet voor deelvensters)
Aangepaste formulierpagina af-page
De aangepaste formulierpagina is het daadwerkelijke formulier. Dit is net als elke andere WCM-pagina die is gemodelleerd als de WCM cq:Page
-component. In de volgende afbeelding ziet u de inhoudsstructuur van een adaptief formulier.
De inhoudsstructuur bevat doorgaans de volgende primaire componenten:
-
guideContainer: De wortel van een adaptieve vorm, die als Start of adaptive form in de adaptieve vorm UI duidelijk is. In deze component kunt u het volgende opgeven:
- Mobiele Lay-out van de adaptieve vorm: Bepaalt de verschijning van de vorm op mobiele apparaten.
- Dank u pagina: Bepaalt de pagina waar de gebruiker na het voorleggen van de vorm opnieuw gericht wordt.
- legt Actie voor: Bepaalt hoe de vorm op de server wordt verwerkt zodra de gebruiker de vorm voorlegt.
- het Stileren: Specificeert de weg aan het CSS dossier wordt gebruikt om de verschijning van de vorm aan te passen die.
-
rootPanel: het wortelpaneel van een adaptieve vorm. Het kan subdeelvensters onder de puntenknoop bevatten. Aan elk deelvenster, inclusief het hoofddeelvenster, kan een lay-out zijn gekoppeld. De indeling van het deelvenster bepaalt hoe het formulier wordt opgemaakt. In de schermindeling Accordeon worden de items ervan bijvoorbeeld ingedeeld als Accordion-stappen.
-
toolbar: een adaptieve vormcontainer heeft een bijbehorende globale toolbar, die aan de vorm globaal is. Deze werkbalk kan worden toegevoegd met de handeling Add Toolbar op de bewerkbalk. Hiermee kunnen auteurs handelingen toevoegen, zoals Verzenden, Opslaan, Herstellen enzovoort.
-
activa: Deze knoop bevat extra informatie die voor vorm creatie wordt gebruikt. Bijvoorbeeld details van het formuliermodel, lokalisatiedetails, enzovoort).