Elementi di interfaccia utente

Gli utenti interagiscono con l'applicazione aziendale tramite le interfacce utente. Prima di iniziare a creare le applicazioni, rivedere questi elementi dell'interfaccia utente.

Pagine

Le pagine sono le interfacce utente (UIs) per la tua applicazione. È possibile utilizzare le pagine per costruire diversi tipi di Usta per l'utente.

Si sviluppano le pagine con un designer a basso codice in cui è possibile trascinare vari componenti alla propria pagina, e configurarli. Quando la tua applicazione viene distribuita, le tue pagine vengono rese come pagine web HTML in fase di esecuzione.

Ci sono tre modi in cui è possibile aggiungere pagine alla propria applicazione:

Gli utenti di base e avanzati possono clicca sul menu della pagina nel riquadro di navigazione superiore e il clic Nuovo.
Quando si inizia per la prima volta a creare un'applicazione, la prima pagina viene creata per impostazione predefinita. Anche la tavolozza della vista è immediatamente avviata, quindi è possibile iniziare ad aggiungere viste alla prima pagina. Questa pagina iniziale è nota come la tua pagina iniziale. Ogni volta che si crea una pagina utilizzando questo metodo, la tavolozza della vista viene avviata automaticamente.
Gli utenti di base e avanzati possono aggiungere nuove pagine quando si configurano determinate viste all'interno della loro applicazione.
È anche possibile aggiungere nuove pagine quando si personalizzano determinate viste. Immaginate di aggiungere un pulsante alla pagina iniziale. Il pulsante è un pulsante Successivo che richiama un'azione, quindi indirizza l'utente in una pagina designata. Quando si definiscono i valori Passo successivo è necessario selezionare una voce per la proprietà Vai alla pagina . È possibile impostare questa proprietà su Nuova pagina, quindi specificare un nome per la tua nuova pagina. Quando si termina la configurazione della pagina Passo successivo , viene generata la nuova pagina. È possibile creare nuove pagine quando si configura qualsiasi vista che utilizzi la configurazione di Next steps.
Gli utenti avanzati possono utilizzare il diagramma per il loro progetto di applicazione per aggiungere una nuova pagina alla loro applicazione.

Durante la creazione delle pagine, è possibile impostare la convalida senza code page che consente di assicurarsi che i dati previsti vengano immessi dall'utente finale e che i valori dei dati siano validi per tale pagina:

È possibile contrassegnare un elemento come obbligatorio e convalidarne il valore. Ad esempio, se si dispone di un valore di età nella pagina, è possibile configurare la convalida per assicurarsi che il valore sia presente e che aderisca all'intervallo di valori validi.
Esistono due configurazioni possibili per la gestione degli errori di convalida. È possibile impedire all'utente di uscire dalla pagina in caso di errore ed è possibile disabilitare la visualizzazione in caso di errore. Ad esempio, è possibile rimanere nella pagina corrente quando si fa clic su OK e si verifica un errore. È inoltre possibile configurare il pulsante OK in modo che sia disabilitato fino a quando non si verificano errori di convalida.

Ci sono due modi in cui è possibile eliminare una pagina:

Gli utenti di base e avanzati possono eliminare una pagina dall'applicazione passando alla pagina che si desidera eliminare, quindi facendo clic sull'icona di eliminazione nel riquadro di navigazione superiore.
Suggerimento: Fai un'istantanea dell'applicazione prima di eliminare le pagine.
Gli utenti avanzati possono passare al diagramma di applicazione, fare clic con il tasto destro del mouse su una pagina e quindi selezionare Elimina.

Se si elimina una pagina utilizzata da un'altra vista per la proprietà Vai alla pagina , si spezza la logica per quella vista. Qualsiasi vista che punti alla pagina che hai cancellato, deve essere aggiornata per puntare ad una pagina esistente.

Menu di navigazione delle pagine

È possibile organizzare le pagine della propria applicazione in un menu di navigazione visibile ai propri utenti. Quando si aggiunge una pagina al menu di navigazione, viene creata una voce di menu per quella pagina e aggiunta al menu.

È possibile creare tre tipi di menu di navigazione:

Pagine: Una voce di menu che naviga in una o più pagine.
Cartelle: Una voce di menu che può nidificare altre voci di menu al suo interno.
Link esterni: Una voce di menu che collega l'utente a una destinazione esterna alla propria applicazione.

È anche possibile associare le pagine alle voci di menu di navigazione esistenti, in particolare le pagine. Diciamo che la tua applicazione ha un flusso di pagine di quattro pagine, ma non vuoi che ogni pagina del flusso abbia una propria voce di menu di navigazione. È possibile scegliere di associare le quattro pagine di flusso ad una voce di menu di navigazione. In questo modo, non importa dove si trova il tuo utente nel flusso della pagina, viene evidenziata la voce di menu associata.

Per gli scenari avanzati, gli articoli di menu di navigazione possono sparare agli eventi di limite. Per configurare gli eventi di limite, passare alla modalità di visualizzazione Avanzato e utilizzare il Diagramma.

Viste

Le viste sono serie riutilizzabili di widget dell'interfaccia utente, come ad esempio i campi di testo, i selezionatori di data e i pulsanti, che gli utenti possono utilizzare per interagire con un oggetto o un servizio di business. Le viste possono comprendere uno o più insiemi di altre viste, i binding dei dati, le istruzioni di layout e i comportamenti.

Poiché le viste sono riutilizzabili, ogni istanza di visualizzazione può condividere parti della propria interfaccia utente con altre istanze di visualizzazione. Ad esempio, si crea una pagina che contiene un'istanza di visualizzazione che include una serie di campi di indirizzo. Se si crea una seconda pagina che ha bisogno degli stessi campi di indirizzo, è possibile riutilizzare la stessa vista. In entrambi i casi, la pagina sta utilizzando un'istanza della vista. È possibile modificare in modo indipendente le proprietà di ogni istanza. Ad esempio, la modifica dell'etichetta di una sola vista non modifica l'etichetta dell'altro. Entrambe le istanze di visualizzazione utilizzano un riferimento per puntare alla definizione della vista. Questo approccio significa che se la definizione della vista cambia, è possibile vedere che la modifica riflessa nelle istanze della vista.

È possibile modificare le istanze di visualizzazione utilizzando le proprietà di configurazione e sovrascrivendo lo styling predefinito. Se si definisce un binding per un'istanza, deve corrispondere al tipo nella definizione della pagina. Si verifica un avviso se il tipo di oggetto aziendale non corrisponde al tipo di collegamento dati definito per la vista. Per ogni istanza di visualizzazione vengono presentate le proprietà di configurazione. Se si desidera sovrascrivere il valore predefinito, è possibile fornire un valore specifico o assegnare una variabile. È anche possibile esporre la proprietà di configurazione a qualsiasi vista che contenga la vista. Esponendo la proprietà di configurazione crea un'opzione di configurazione nella vista corrente con il binding corrispondente. Non è necessario creare l'opzione di configurazione e legarla.

Viste in kit o applicazioni: È possibile creare una vista nell'applicazione o in un toolkit. In generale, creare viste altamente riutilizzabili in toolkit e viste più specializzate nelle applicazioni. Scegliere l'applicazione significa che è possibile riutilizzarlo solo all'interno dell'applicazione. Tuttavia, significa anche che se qualcuno visualizza la vista, le modifiche si applicano alle istanze di visualizzazione in quella applicazione. Se la vista è in un toolkit e poi qualcuno l'ha edita, le modifiche potrebbero applicarsi a tutte le istanze di vista in tutte le applicazioni che utilizzano quella versione del toolkit. Poiché la modifica di una definizione di vista può influenzare molte istanze, fare attenzione quando si apprendono delle modifiche. Ad esempio, la cancellazione di una casella di contenuto nella definizione della vista potrebbe significare che le pagine o le viste che contengono istanze di tale vista non possono visualizzare il contenuto definito in quella casella di contenuto. Non è possibile modificare direttamente la definizione della vista dall'interno della pagina principale o della vista. È necessario, invece, aprire la definizione della vista prima prima di modificarla.

Toolkit IU: Il toolkit UI, ovvero il toolkit predefinito, fornisce una ricca serie di visualizzazioni che è possibile utilizzare per costruire applicazioni che vengono eseguite su più dispositivi. Utilizzare le viste UI per il nuovo sviluppo. Per diventare familiare con le viste UI, esplora il campione di Discover UI.

Kit di strumenti per il luogo di lavoro: Il toolkit Workplace è costituito da una serie di visualizzazioni che è possibile utilizzare per progettare le proprie applicazioni di business basate su client e dashboard di tipo client personalizzate per la gestione del lavoro in Workplace. Le viste del toolkit Workplace sono disponibili nella tavolozza Application Designer per la progettazione di dashboard e applicazioni.

Toolkit Content Services: Il toolkit Content Services contiene tutti i componenti dell'interfaccia utente, le azioni e i dati che possono essere utilizzati per fornire la funzione di gestione del contenuto.

Composito - stile vs widget - style view development

Di solito, quando si costruiscono la vista, è possibile seguire uno dei seguenti modelli. Oppure è possibile utilizzare una combinazione di entrambi i modelli se l'interfaccia utente è più complessa e lo richiede.

Le viste in stile composito sono semplici e non richiedono competenze tecniche avanzate per costruire. Per creare una vista in stile composito, aggiungere il contenuto al layout dalla tavolozza. Se la tua vista ha più aree di informazioni, utilizzare il layout della griglia per organizzare le viste, quindi impostare le relative proprietà e completare il binding dei dati come richiesto. Le viste in stile composito possono essere riutilizzate in più pagine o in altre viste che possono essere costruite gerarchicamente.
Le viste in stile widget sono più complesse e richiedono una maggiore abilità tecnica. In genere, le viste in stile widget sono viste personalizzate che possono includere, ad esempio, un segmento HTML personalizzato che è possibile popolare con codice HTML o un iFrame che ha un ID specifico. È possibile impostare le proprietà di configurazione della vista stile widget e aggiungere la logica JavaScript in linea e CSS in linea nella pagina Comportamento . Per il funzionamento che si verifica in fase di runtime, ad esempio, quando viene caricata una pagina o si fa clic su un pulsante, è possibile inserire la logica JavaScript all'interno dei gestori eventi della vista, in Eventi.

Visualizza modelli

I modelli forniscono un modo per creare uno sguardo standardizzato su più pagine.

Un modello è una vista che qualcuno segna come utilizzabile come modello nelle proprietà Panoramica . Gli utenti possono quindi selezionare il modello quando si creano le proprie visualizzazioni. Le nuove viste hanno il contenuto del modello come contenuto base, a cui gli utenti possono quindi aggiungere contenuti. Ad esempio, si crea una vista che ha il logo dell'azienda e il nome in un'area banner, e una casella di contenuto come segnaposto per altri contenuti. Quando si utilizza questa vista come modello, è quindi possibile selezionarla quando si sta creando un'altra vista o pagina. La nuova vista ha l'area banner definita nel modello insieme ad un'area per i contenuti. Anche altri utenti possono utilizzare il modello quando si creano viste in modo che ci sia uno sguardo coerente attraverso le nuove viste. Poiché i modelli sono viste, è anche possibile rilasciarli sulle pagine. Ad esempio, se si dispone di un modello che ha un banner comune, è possibile rilasciarlo su una pagina in modo che la pagina abbia il banner comune.

Suggerimento: Se il modello sta utilizzando le celle in un layout di griglia, le impostazioni di direzione delle celle sovrascrivono le impostazioni di anteprima di eventuali caselle di contenuto in quelle celle.

Il modello serve anche per aggiornare più viste contemporaneamente. Poiché il modello è un riferimento a una vista e non una copia, se si modifica il modello vengono aggiornate tutte le viste e le pagine che si basano su quel modello con quelle modifiche. Per continuare l'esempio precedente, si aggiorna il modello per modificare l'immagine del logo. Tutte le viste che utilizzano il tuo modello vengono aggiornate con il nuovo logo.