Lezione dal corso Figma Basics
è arrivato il momento degli autografi out.
Vedremo che cosa sono e come utilizzarli e tutte le proprietà che possiamo applicare a questi elementi in modo da utilizzarli al meglio.
Per prima cosa cos'è un'auto layout prima di tutto è un contenitore con un tram, ma con una particolarità facciamo zoom su questo bottone per osservarlo più da vicino.
Vedete, abbiamo un bottone, un tram che al suo interno a questa icona un testo e un background, cosa non proprio corretti, Issy, ma ma che molti insieme di persone che vengono da sketch fanno abbiamo un tram come quelli che abbiamo già visto, ma se osservate bene, quello che succede è che non è molto reattivo.
Se cambia, per esempio la lunghezza di questo testo, cambiando appunto il testo, il bottone rimane così com'è.
Spesso però vogliamo che il contenitore, il contenuto interagiscono tra di loro.
In questo caso, se abbiamo un bottone, vogliamo che la dimensione in orizzontale la larghezza del bottone si ridimensioni in base a quello che abbiamo dentro.
In questo e in tutti gli altri casi gli autori out sono nostri amici.
Possiamo creare un'auto layout selezionando un fra me e utilizzando l'apposito menù oppure possiamo usare uno short Possiamo usare Maiusc A.
Vedete cosa è successo? Abbiamo definito un fram un'auto layout che si comporta in questo modo in base al contenuto di questo fra me l'auto layout si ridimensiona in modo da abbracciarlo e adattarsi a tutto quello che inseriamo al suo interno.
Le prime tre proprietà che voglio mostrarvi degli auto layout sono queste Direzione distanza pudding per esempio.
Qua abbiamo un'auto layout vuoto e qua ho preparato due piccoli elementi per fare una lista.
Quello che succede Vedete trascino questo titolo l'auto layout subito.
Abbraccia il contenuto che posso prendere aggiungere altri elementi.
La prima proprietà che voglio mostrarvi è la direzione.
Possiamo ottenere le auto, il layout in due direzioni verticale, come in questo caso ho anche orizzontale.
Abbiamo poi altre due proprietà La distanza tra gli elementi che questa qui é il padding, la distanza che sta tra il blocco interno e tutti i bordi che abbiamo intorno intorno a questo.
Il padding può essere modificato sia in tutte le direzioni contemporaneamente sia in una direzione specifica.
Quindi, per esempio, se voglio rendere queste due attività sotto attività della prima diventando le Quello che posso fare è da questo menu aumentare solo il pudding in un certo lato.
Qui ho preparato un altro esempio per vedere gli ultimi concetti fondamentali.
Abbiamo il ridimensionamento sia del contenitore sia del contenuto, così come l'allenamento degli elementi dentro un'auto layout.
Per quanto riguarda il ridimensionamento, possiamo vedere le proprietà che abbiamo applicato qua nel blocco racing.
Quelle di default sono a contents che abbracciano il contenuto.
Facciamo un po' di zoom.
Evitiamo un esempio pratico Vedete questo elemento se lo ridimensionò l'altro layout continua ad abbracciare il contenuto e si adatta di conseguenza.
Abbiamo poi un'altra opzione che possiamo applicare che effettui la possiamo applicare da qua la possiamo applicare da questo pannello oppure direttamente possiamo ridimensionare l'elemento.
In questo caso verrà trasformato direttamente in un elemento con la ragazza fissa.
Quello che succede è che in questo caso l'auto layout continua a contenere, a dare ordine agli elementi che contiene, ma non si ridimensiona più in senso orizzontale, quindi ho definito una larghezza fissa.
Il racing poi si può applicare anche per gli elementi che sono contenuti con un'opzione in più in questo caso o questo rettangolo con dimensione fissa e vedete, ho un'altra opzione che prima non avevo e Phil Container in questo caso sto dicendo di riempire il contenitore in senso orizzontale.
Quello che succede a questo punto è vedete gli altri due elementi mantengono un'altezza e una larghezza fissa e questo cerca di prendersi tutto lo spazio rimanente espandendosi in orizzontale.
Questo dà origine a comportamenti molto particolari.
Se per esempio prendo quest'auto layout vedete questo si muove in autonomia.
Il contenitore, ricordiamolo, abbraccia in verticale il contenuto, mentre quest'altro rettangolo cerca di impostiamo lo qua riempire il container più che può.
In questo modo abbiamo questo comportamento.
Quando ridimensiona questo elemento, il suo contenitore l'auto layout si ridimensiona di conseguenza e di conseguenza si ridimensiona anche il primo rettangolo che cerca di prendere tutta la larghezza disponibile.
Allo stesso modo, se restringono oltre una certa dimensione, il contenitore non potrà stringersi di più perché questi altri due elementi toccano i bordi del contenitore e quindi avremo questo effetto particolare.
Abbiamo infine un ultimo punto molto veloce che riguarda l'allenamento dentro gli autori out.
Prendiamo questi elementi e per questo esempio rimettiamoci come fix e aumentiamo la dimensione l'ultima opzione è quella che possiamo accendere da questo quadratino e definisce come gli elementi si allineano all'interno dell'auto layout Vedete abbiamo il default in alto a sinistra, ma possiamo anche centrarlo verticalmente orizzontalmente, metterli in un angolo, eccetera.
Abbiamo infine un'ultima opzione.
Per quanto riguarda l'allenamento può essere pact, quindi tutti gli elementi stanno tra di loro il più vicino possibile, oppure possiamo applicare Space Bike.
In questo caso gli elementi prendono tutto lo spazio orizzontale o verticale.
Dipende dalle direzioni che abbiamo dato al nostro autori Out e L' Trezza che li definiamo in questa lezione.
Abbiamo visto teoricamente come formare, impostare, settare, l'auto layout, ma l'unico modo di utilizzarli al meglio, come del resto qualsiasi altro elemento su Fig.
Ma è provare, provare, provare, provare.
Per questo motivo nella prossima lezione vedremo un'interfaccia che non li utilizza e proveremo ad applicarle in modo da renderla un po' più responsivo.
Un po' più interattiva per quanto riguarda gli elementi contenuti negli autori out.
Learnn è la piattaforma online che ti aiuta a 360 gradi a crescere nel digitale. Sviluppa competenze con oltre 220 corsi, condividi i tuoi risultati, fai networking con otre 120.000 professionisti/e e oltre 300 aziende.
Vogliamo cambiare l’Italia, una persona alla volta.
Per farlo ci proponiamo di democratizzare l’apprendimento e accelerare la crescita di persone, idee e aziende attraverso strumenti tecnologici a supporto di qualsiasi professionista.
Learnn prevede un piano totalmente gratuito (Free) che ti permette di iniziare qualsiasi corso che abbiamo su Learnn.
Per chi volesse finire i corsi, ottenere certificazioni e connettersi con professionisti e aziende, Learnn Pro permette di avere accesso illimitato a tutto questo. Il corso di Learnn Pro è 9.99 euro / mese e puoi disdire quando vuoi.
Per i team di aziende abbiamo anche un Piano Team con oltre 300 clienti aziendali.
Potrai seguire i contenuti da computer, tablet e smartphone.
Scarica l’App iOS/Android Learnn e segui i contenuti in modalità video, audio e testo.
Learnn ha un piano gratuito che ti permette di accedere all 40% di ogni corso in maniera gratuita e solo con la tua email.
Learnn offre sia un piano gratuito con accesso limitato ai contenuti, sia un piano PRO del costo di soli 9.99 euro al mese con cui potrai avere accesso a tutti i nostri contenuti senza limiti o sorprese.
Una volta completata l’iscrizione sarà possibile gestire i propri dati e disdire in qualsiasi momento e in completa autonomia.
No, non offriamo certificazioni, facciamo di meglio.
Man mano che completi corsi potrai verificare le tue competenze e condividerle sul tuo profilo LinkedIn o CV.
Inoltre abbiamo sviluppato una feature chiamata Profile attraverso il quale otterrai un link personale per mostrare in tempo reale tutti i contenuti da te completati e molto altro.
Immagine personale, username, badge, link esterni e molto altro.
Crea una vera e propria sales page dove il prodotto in vendita sono le tue competenze.
Se avessi altre domande puoi usare la live chat qui di fianco.
Per partnership compila questo form
La nostra vision è rendere l'Italia famosa nel mondo per l'esecuzione.
La missione di Learnn
è accelerare la crescita di ogni individuo rendendo accessibili conoscenza, opportunità e tecnologia per avere un impatto positivo sul mondo e sugli altri.
Tutto incluso (come Netflix), IVA inclusa, nessuna sorpresa o addebito indesiderato.
Disdici quando vuoi, in 1 click.
Scegli di migliorare ogni giorno per 12 mesi senza interruzioni scegliendo il piano annuale.
In un unico pagamento annuale
Disdici quando vuoi, in 1 click.
Con l’abbonamento otterrai:
Consuma i +200 corsi e webinar di Learnn da webapp o app iOS e Android, in formato video, audio o testo.
Con l'abbonamento a Learnn hai accesso a tutto (proprio tutto) ciò che contiene la piattaforma.
Ogni mese registriamo nuovi corsi su tutto cio di cui potresti avere bisogno nel mondo digitale.
Con l'app Learnn trasformi ogni momento di vuoto in un'occasione di apprendimento.
Scarica tutto il materiale che ti serve e utilizza i moduli riassuntivi per fissare i concetti.
Ogni settimana nuove offerte di lavoro da parte di tantissime aziende che operano nel mondo digitale.