Panoramica di Flex Layout

Ultimo aggiornamento il 7 ago 2026

Utilizza il pannello Layout Flex di InDesign per creare, allineare, impostare la direzione, disporre, giustificare e spaziare gli elementi nel layout Flex.

Che cos'è un layout Flex?

Layout Flex è una funzionalità che consente di creare contenitori che si adattano automaticamente quando il contenuto cambia. Gli elementi nel contenitore sono posizionati utilizzando direzione, spaziatura, padding e allineamento. Quando il contenuto viene aggiunto, rimosso o ridimensionato, il layout si regola automaticamente, eliminando la necessità di regolazioni manuali.

Accedere alle opzioni di Flex Layout

Seleziona un oggetto/gruppo/più oggetti nel documento ed esegui una delle seguenti operazioni per accedere alle opzioni di Flex Layout:

  • Vai a Object > Flex Layout.
  • Fare clic con il pulsante destro del mouse sull'oggetto per accedere a Flex Layout.
  • Andare su Window > pannello Flex Layout.
  • Seleziona una volta per lavorare con il flex principale e fai doppio clic per selezionare l'elemento figlio.
  • Usa lo strumento Selezione diretta per selezionare gli elementi secondari.

Aggiungi a Flex Layout

Aggiunge gli oggetti selezionati a un Layout Flex.

Converti in Layout Flex

Converte un oggetto (cornice rettangolare, forma rettangolare o gruppo) in un Layout Flex.

Rimuovi Layout Flex

Rimuove il Layout Flex dalla selezione. Se il Layout Flex aveva più oggetti, viene creato un gruppo. Se aveva un solo oggetto, l'oggetto rimane.

Mostra controlli Flex

Apre il pannello Layout Flex (alternativa al pannello Proprietà).

Flex Layout introduce in InDesign un concetto di contenitore simile a CSS Flexbox.Offre un controllo potente del layout per gli oggetti secondari.Con Flex Layout, i progetti diventano strutturati, più adattabili e richiedono meno regolazioni manuali.

Contenitore del layout Flex

Puoi configurare le proprietà di Flex Layout direttamente negli Stili oggetto.Puoi creare uno Stile oggetto denominato Contenitore verticale che include le impostazioni di Flex Layout, quindi applicarlo a qualsiasi contenitore Flex Layout nel layout.

Esempio:

Usa il pannello Stili oggetto per applicare Flex Layout e impostare proprietà come direzione, allineamento e spaziatura.Una volta salvato, applica questo stile ad altri contenitori per ottenere un comportamento di layout coerente.

Layout Flex secondario

La stessa sezione Flex Layout negli Stili oggetto può anche definire proprietà per gli elementi figlio di Flex Layout e i loro elementi figlio nidificati, consentendoti di standardizzare il comportamento, come dimensioni fisse o flessibili, in tutto il layout.

  • Creazione diretta di elementi interattivi: Converti gli elementi secondari all'interno di un Flex Layout in elementi interattivi senza crearli separatamente e aggiungerli al Flex Layout.
  • Blocca elementi figlio: Blocca uno o più elementi figlio all'interno di un Flex Layout per impedire di trascinarli, ridimensionarli o spostarli fuori dalla cornice, consentendo comunque modifiche di posizione usando i tasti freccia della tastiera.
  • Navigazione da tastiera per elementi secondari: Riposiziona gli elementi bloccati o sbloccati usando i tasti freccia sinistra o destra nei layout orizzontali o i tasti freccia su o giù nei layout verticali.
Suggerimento

Puoi usare gli Stili oggetto per definire le proprietà flex all'interno delle cornici flex bloccate.

Pannello Flex Layout

Per accedere al pannello, vai a Finestra > Layout Flex. Si apre il pannello Layout Flex. Ora puoi creare o aggiungere un layout Flex o personalizzarne uno esistente in base alle tue esigenze. Se non è presente alcuna selezione, puoi usare il pannello per modificare le impostazioni predefinite (applicabile se il rilevamento automatico è disattivato). Vai su Preferenze > Generale > Rileva automaticamente e applica le impostazioni del layout Flex per verificare l'impostazione di rilevamento automatico.

Pannello Layout Flex che mostra varie opzioni per creare un layout Flex

A. Larghezza del contenitore Flex B. Altezza del contenitore Flex C. Disponi testo D. Direzione degli oggetti nel layout Flex E. Spaziatura verticale F. Spaziatura orizzontale G. Padding  H. Giustificazione I. Allineamento degli oggetti nel layout Flex 

Larghezza e Altezza

La dimensione sia dei contenitori Flex Layout che dei loro elementi secondari può essere controllata indipendentemente.Per un contenitore Flex Layout, la larghezza e l'altezza possono essere:

  • Fisso: la dimensione del contenitore rimane costante, indipendentemente dal suo contenuto.
  • Automatico: la dimensione del contenitore aumenta o diminuisce in base alla dimensione dei suoi elementi secondari.

Per un elemento secondario Flex Layout (inclusi Flex Layout nidificati):

  • Fisso: la dimensione dell'elemento secondario rimane costante, indipendentemente dal suo contenuto.
  • Automatico: la dimensione dell'elemento secondario si adatta al proprio contenuto o a quello degli elementi secondari.
  • Riempi spazio: l'elemento secondario si espande per occupare lo spazio rimanente disponibile in quella dimensione, condividendo lo spazio con altri elementi di tipo Riempi spazio secondo necessità.

Disponi testo

Attiva o disattiva la disposizione degli oggetti nel contenitore.

Direzione

Scegli come gli elementi fluiscono all'interno del contenitore (riga, riga inversa, colonna, colonna inversa).

Spaziatura

Controlla il padding e la spaziatura.

  • Spaziatura interna: Definisci la spaziatura all'interno del contenitore su tutti i lati (sopra, sotto, sinistra, destra).
  • Spaziatura orizzontale : Imposta una spaziatura uniforme tra gli elementi orizzontalmente.
  • Spaziatura verticale : Imposta una spaziatura uniforme tra gli elementi verticalmente.

Giustificazione

Controlla la distribuzione degli elementi lungo l'asse principale.

Allinea la riga all'inizio del Flex Layout e allinea gli elementi all'inizio della riga.

Allinea la riga al centro del Flex Layout e allinea gli elementi al centro della riga.

Allinea la riga alla fine del Flex Layout e allinea gli elementi alla fine della riga.

Allinea gli elementi nelle righe in modo che:

  • Spazio uguale su entrambi i lati di ogni elemento.
  • Gli elementi ai bordi hanno solo un lato esposto; lo spazio ai bordi è la metà dello spazio tra gli elementi.

Allinea gli elementi nelle righe in modo che:

  • Il primo elemento sia allineato al bordo iniziale e l'ultimo elemento sia allineato al bordo finale.
  • Gli elementi rimanenti sono distribuiti uniformemente solo nel mezzo.
  • Distribuisce gli elementi uniformemente lungo l'asse principale, con il primo elemento all'inizio e l'ultimo alla fine.
  • Nessuno spazio ai bordi esterni.

Allinea gli elementi nelle righe in modo che:

  • Spazio uguale ovunque: tra gli elementi e ai bordi.
  • Tutto rimane perfettamente uniforme.

Allineamento

Allinea gli elementi sull'asse trasversale: In alto, Al centro, In basso, o A sinistra, Al centro, A destra.

In alto a sinistra: allinea le righe nella parte superiore sinistra del contenitore Flex Layout e allinea gli elementi della riga nella parte superiore sinistra della riga.

Al centro a sinistra: allinea le righe al centro a sinistra del contenitore Flex Layout e allinea gli elementi nella riga al centro a sinistra della riga.

In basso a sinistra: allinea le righe in basso a sinistra del contenitore Flex Layout e allinea gli elementi nella riga in basso a sinistra della riga.

In alto al centro: allinea le righe in alto al centro del contenitore Flex Layout e allinea gli elementi nella riga in alto al centro della riga.

Al centro: allinea le righe al centro del contenitore Flex Layout e allinea gli elementi nella riga al centro della riga.

In basso al centro: allinea le righe in basso al centro del contenitore Flex Layout e allinea gli elementi nella riga in basso al centro della riga.

In alto a destra: allinea le righe in alto a destra del contenitore Flex Layout e allinea gli elementi nella riga in alto a destra della riga.

Al centro a destra: allinea le righe al centro a destra del contenitore Flex Layout e allinea gli elementi nella riga al centro a destra della riga.

In basso a destra: allinea le righe in basso a destra del contenitore Flex Layout e allinea gli elementi nella riga in basso a destra della riga.

Indicatori di selezione nei Layout Flex

InDesign utilizza segnali visivi per aiutarti a comprendere gli stati di selezione nei Layout Flex:

  • I contorni tratteggiati indicano i livelli di layout non attivi.
  • I contorni continui indicano le cornici dello stesso livello selezionabili.
  • Lo strumento Selezione diretta consente di selezionare i fotogrammi nidificati senza clic ripetuti.

Questi indicatori aiutano a chiarire la gerarchia e il focus della selezione quando si lavora con layout nidificati.

Controlli di spaziatura interna ed esterna nell'area di lavoro

I Layout Flex forniscono controlli interattivi nell'area di lavoro per regolare la spaziatura interna ed esterna:

  • Spaziatura interna collegata: Regola insieme tutti e quattro i valori di spaziatura interna.
  • Spaziatura interna scollegata: Regola ogni lato indipendentemente.
  • Spaziatura orizzontale e verticale: Modifica la spaziatura direttamente tra gli elementi, incluse le righe o colonne a capo.

Gli indicatori visivi nell'area di lavoro riflettono i valori correnti e si aggiornano in tempo reale nel pannello Layout Flex.

Trasforma e inclina i fotogrammi Layout Flex

Ora puoi ruotare, rispecchiare, ridimensionare o inclinare un Layout Flex senza interromperne il comportamento. Le trasformazioni si applicano sia ai fotogrammi flex principali che a quelli nidificati, e il pannello Layout Flex rimane attivo mentre trasformi gli oggetti. Questo ti consente di regolare allineamento, spaziatura, disposizione e direzione mentre trasformi i layout, senza interrompere la struttura flex.