Le funzioni di conversione Crea pennello immagine da texture e Crea pennello immagine da materiale ti permettono di inserire una texture o un materiale da un modello di visualizzazione in un widget Immagine direttamente all'interno del tuo widget utente.
A differenza delle funzioni di conversione Imposta parametro materiale, queste due funzioni di conversione eliminano la necessità di avere un materiale con un parametro Texture. Queste funzioni di conversione inseriscono texture nella tua UI.
Questo esempio espande il widget Tracciatore dai tutorial In testo passando la proprietà Icona dal Modello di visualizzazione Tracciatore in un Widget immagine utilizzando Crea pennello immagine da texture.
Crea pennello immagine da materiale e Crea pennello immagine da texture/materiale morbido condividono lo stesso flusso di lavoro e hanno proprietà identiche. Tuttavia, questo tutorial non spiega come importarli. Fai riferimento ai tutorial in Creazione di un HUD personalizzato per vedere come queste proprietà sono impostate nel widget.
Impostazione del widget
Lo stesso Widget utente dei tutorial IntToText/Double viene utilizzato per creare questo widget di tracciamento.
Questo tutorial include un widget Immagine aggiuntivo che trasmette l'icona dal dispositivo Tracciatore. I campi Title e CurrentValue esistenti sono racchiusi in una Casella impilata con orientamento orizzontale in modo che l'icona venga visualizzata da sinistra a destra accanto al testo del widget.
Aggiungi i seguenti widget alla Gerarchia nell'ordine indicato nell'elenco seguente:
Sovrapposizione
Immagine (Nidifica il widget Immagine nell'Overlay e rinominalo in Sfondo.)
Casella impilata (Nidifica la Casella impilata sotto l'Overlay.)
2 Immagine (Nidifica sotto la Casella impilata e rinomina i widget in Icona e Distanziatore.)
Casella impilata (Nidifica la seconda casella impilata sotto la prima Casella impilata.)
Imposta l'Allineamento verticale e Orizzontale del widget Immagine icona su Centro. In questo modo l'icona è sempre centrata.
Un widget immagine Distanziatore aggiuntivo viene utilizzato per creare uno spazio tra l'icona e il testo sottostante.
Impostazione della funzione conversione
Apri la finestra Associazioni visualizzazione per associare l'icona del dispositivo Tracciatore al widget Immagine icona nella tua UI.
Seleziona il widget Immagine icona nella Gerarchia, quindi fai clic su +Aggiungi widget nella finestra Associazioni visualizzazione.
Nel campo a sinistra, seleziona Icona > Pennello > Seleziona. Questo passa un valore nel campo Pennello dell'immagine Icona.
Nel campo a sinistra, seleziona Funzioni di conversione > Crea pennello immagine da texture > Seleziona.
Sotto l'associazione vengono visualizzati diversi campi. Per saperne di più sulle funzioni di ogni campo, consulta Crea pennello immagine da materiale dalle proprietà Texture/Materiale.
Fai clic sull'icona della catena accanto a Immagine, seleziona MVVM_UEFN_Tracker > Icona > Seleziona.
Imposta le Dimensioni immagine sul valore desiderato per l'immagine nel widget Tracciatore.
Risultato finale
Trascina un dispositivo Tracciatore nel tuo progetto e imposta le opzioni seguenti:
Nel pannello Dettagli, imposta le icone nei campi Icona incarico delle icone Piccola e Grande. In questo esempio, le icone T_UI_IconLibrary_Ham sono state utilizzate per le icone piccola e grande.
Il widget Immagine icona è riempito con l'icona Ham impostata nel dispositivo Tracciatore.
Crea pennello immagine da materiale dalle proprietà Texture/Materiale
Entrambe le funzioni di conversione condividono gli stessi campi, se non diversamente specificato:
Immagine (solo per Crea immagine da texture)
Variabile Texture da passare al Pennello del widget immagine.
Materiale (solo per Crea immagine dal materiale)
Variabile Materiale da passare al Pennello del widget immagine.
Dimensioni
Dimensione dell'immagine o del materiale disegnato.
Colore tinta
Colore con cui tingere l'immagine o il materiale.
Tipo tile (solo per Crea immagine da texture)
Determina se l'immagine viene affiancata orizzontalmente, verticalmente o entrambe quando viene passata al pennello del widget immagine. Se la dimensione originale dell'icona è inferiore alla dimensione specificata nella funzione di conversione, l'immagine verrà affiancata.
In questo esempio, la mia icona è 64x64px, mentre la Dimensione è impostata su 72x72px, causando l'affiancamento.