Prima di continuare a progettare l'interfaccia utente, dobbiamo rendere il nostro codice più pulito.
Per questo motivo, è necessario separare i compositi in nuovi file.
Quindi, all'interno delle schermate, create un nuovo file.
Lo chiamerò sfondo sfumato.
Spostare questo componibile da qui e incollarlo qui.
È molto semplice.
Come si vede, stiamo chiamando il gradiente di sfondo componibile dal file del gradiente di sfondo.
Allo stesso modo, creeremo un altro file chiamato header.
All'interno di questa intestazione creeremo due funzioni componibili.
Cominciamo con il principale componibile.
E qui lo nominerò come testo dell'immagine del profilo nel parametro dell'oggetto modificatore.
Inizierò con le immagini componibili.
Imposterò la risorsa pittore arte disegnabile.
Dobbiamo aggiungere alcune immagini alla cartella drawable.
Ho preparato queste due immagini utente e la campana.
Incolliamoli nella cartella drawable di Android Studio.
Ed eccoci qui.
Ora impostate il pittore sulla risorsa R dot drawable dot user import r Alt+.
Entrate ed eccovi serviti.
La descrizione del contenuto sarebbe un profilo.
Quindi si imposta il modificatore uguale al modificatore passato.
È inoltre possibile aggiungere altri parametri di modifica, come l'inizio del padding pari a 16 dpi.
È inoltre possibile aggiungere un clip e impostarlo sulla forma del cerchio e sulla dimensione, ad esempio, di 32 dpi.
Questo va bene per l'immagine del profilo.
Ricordare che i vincoli sono inclusi nell'oggetto modificatore passato come parametro per questo componibile.
Un'altra funzione componibile chiamata notifica.
Il modificatore è un parametro e all'interno di questa notifica
composta lo chiamo immagine di notifica, per evitare errori.
In seguito imposterò il pittore di immagini, l'arte delle risorse, i punti disegnabili e la notifica della descrizione del contenuto.
Inoltre, è possibile impostare il modificatore sul modificatore passato, perché
è necessario aggiungere i vincoli per esso nel Constraintlayout.
Inoltre, possiamo aggiungere alcuni padding.
Ad esempio, fine equivale a 16 dpi.
Inoltre, è possibile specificare la forma circolare della clip e la dimensione di 42 dpi.
Passiamo ora alla schermata Constraintlayout e passiamo i vincoli
per l'immagine del profilo e l'immagine di notifica.
All'interno dell'ambito di Constraintlayout, dobbiamo passare i vincoli per l'intestazione.
Inoltre, creeremo le catene.
Quindi creerò linee guida superiori, iniziali e finali dall'alto, da sinistra e
da destra Linee guida utilizzando Crea linea guida dall'alto 16 DPI.
Nei video precedenti abbiamo parlato di linee guida.
Pertanto, per saperne di più, vi invitiamo a consultare le lezioni sulle linee guida.
Ora dobbiamo creare una catena.
Dobbiamo iniziare a utilizzare il metodo di creazione della catena orizzontale.
Devo impostare i riferimenti e lo stile della catena.
Passiamo alla catena orizzontale di creazione.
Possiamo vedere gli elementi var args e lo stile della catena.
Come ho detto, per ogni elemento componibile
all'interno del constraintlayout, dobbiamo creare un riferimento.
Per creare un riferimento per l'immagine del profilo e
per l'immagine di notifica, andiamo a questa funzione.
E qui devo creare un'immagine del profilo e un'immagine di notifica di riferimento.
Scorrere verso il basso per creare una catena orizzontale per l'immagine di notifica del profilo.
Lo stile della catena equivale al punto stile catena diffuso all'interno.
Richiamo queste due funzioni e passo i vincoli.
Quindi nell'immagine del profilo imposterò il vincolo del punto modificatore come.
Impostare il riferimento all'immagine del profilo.
È necessario passare i vincoli di collegamento al punto superiore alla linea guida superiore.
Inoltre, passeremo e chiameremo l'immagine di notifica.
Passa il vincolo del punto modificatore come immagine di notifica.
Impostare il modificatore o il vincolo come immagine di notifica
e impostare i vincoli all'interno dell'ambito del vincolo come funzione.
Collegamento al punto due in alto.
Immagine del profilo punto superiore pulsante punto di collegamento due immagine del profilo punto inferiore.
Questi sono i vincoli per l'immagine del profilo e l'immagine di notifica.
Lasciatemi eseguire e vedere i cambiamenti.
Ed eccoci qui.
Questo è il nostro profilo e questa è la campana.
Congratulazioni ragazzi.
Abbiamo creato l'intestazione.