Editor Studio: impilare gli elementi
6 min
In questo articolo:
- Applicare una pila
- Passare dalla pila orizzontale a quella verticale
- Gestire una pila
- Progettare una pila
- Regolare il layout della pila
Una pila è un contenitore flessibile che "abbraccia" un gruppo di elementi, in ordine verticale o orizzontale. Assicura che gli elementi rimangano in ordine, con la spaziatura definita da te, e non si sovrappongano mai.
Detto questo, puoi comunque utilizzare i margini negativi per sovrapporre intenzionalmente gli elementi.
Hai degli elementi sovrapposti?
Consulta il nostro video sulla risoluzione dei problemi (contenuti in inglese) per scoprire cosa controllare e risolvere questo problema.
Applicare una pila
Impilare gli elementi è un modo rapido per organizzare il tuo design con una spaziatura uniforme, creando un layout pulito e raffinato. Quando si selezionano più elementi uno accanto all'altro (nello stesso elemento parent), viene visualizzata l'opzione per impilarli.
Usa il Controllo responsività per individuare le opportunità per impilare elementi adiacenti, assicurandoti che non si sovrappongano mai accidentalmente.
Per applicare una pila:
- Vai al tuo Editor
- Clicca su un elemento che vuoi inserire nella pila
- Tieni premuto il tasto Maiusc e seleziona gli altri elementi della pila
- Clicca su Impila
- (Facoltativo) Trascina la linea tra gli elementi per impostare i margini
Suggerimento:
Puoi anche creare margini negativi per sovrapporre intenzionalmente gli elementi.
Passare dalla pila orizzontale a quella verticale
Quando impili gli elementi, questi si disporranno automaticamente orizzontalmente o verticalmente in base all'ordine in cui li inserisci. Ad esempio, se gli elementi sono posizionati uno sotto l'altro, la pila apparirà verticale.
Ad ogni modo, puoi sempre passare dalla posizione orizzontale a quella verticale utilizzando il menu a tendina che appare quando selezioni la pila. Questo riorganizza automaticamente gli elementi in modo che siano nell'ordine giusto.
Gestire una pila
Puoi personalizzare la pila in base ai nuovi contenuti e requisiti. Aggiungi altri elementi alla pila, spostali con un clic e scollega gli elementi che non sono più necessari.
Per gestire una pila:
- Vai al tuo Editor
- Seleziona la pila pertinente
- Scegli cosa fare dopo:
Aggiungi un elemento alla pila
Scollega un elemento dalla pila
. Quindi, clicca su Scollega dalla pila.
Riordina gli elementi nella pila
/Sposta in basso 
o Sposta a sinistra 
/Sposta a destra 
Togli gli elementi dalla pila
Progettare una pila
La pila non deve essere necessariamente trasparente: puoi progettarla per far risaltare il contenuto sulla pagina. Aggiungi un colore di sfondo, un bordo e un'ombra. Puoi anche rendere gli angoli della pila più arrotondati o squadrati
Per progettare una pila:
- Vai al tuo Editor
- Seleziona la pila pertinente
- Clicca sull'icona Apri Ispezione
in alto a destra dell'Editor
- Usa le opzioni disponibili sotto Design per personalizzare la pila:
- Imposta il colore di sfondo e la sua opacità
- Aggiungi un bordo per incorniciare la pila
- Scegli un raggio per gli angoli
- Abilita l'ombra e gestisci le impostazioni come angoli, distanza, dimensioni, ecc.
Regolare il layout della pila
Regola il layout della pila per assicurarti che ogni elemento sia distanziato e allineato in modo che si adatti alla tua visione creativa o alle esigenze del cliente.
Per modificare il layout della pila:
- Vai al tuo Editor
- Seleziona la pila pertinente
- Clicca sull'icona Apri Ispezione in alto a destra dell'Editor
- Scorri verso il basso fino a Layout
- Usa le opzioni disponibili per modificare il layout della pila:
- Cambia il layout della pila da Orizzontale a Verticale o viceversa
- (Solo orizzontale) Cambia la direzione da Sinistra a destra a Destra a sinistra o viceversa
- Inserisci un valore sotto Spaziatura elemento per creare margini uguali tra gli elementi della pila (es. elementi).
- Scegli un allineamento per gli elementi della pila: Sinistra, Destra, Centro o Giustifica
- Aggiungi la spaziatura interna ai lati
Lo sapevi?
Puoi regolare la spaziatura interna e la spaziatura dell'elemento direttamente sull'area di lavoro. Trascina la linea tra gli elementi o clicca due volte sulla linea se preferisci inserire un valore preciso. Puoi anche cambiare l'unità di misura, se necessario.