Erstellen eines Avatarabbildes als 2D Widget. Relativ einfach. Diese Technik ist recht flexibel und kann nach eigenen Bedürfnissen sehr einfach angepasst werden. Zum Beispiel um im Inventar gerenderte Vorschaubilder darzustellen.
Als Erstes erstellen wir ein Rendertarget.
Also im Contenbrowser mit Rechtsklick auf Materials & Textures und darin dann Render Target auswählen. Dies nennen wir um in Avatar_Mirror.
Wir öffnen das Rendertarget und passen die Größe unseren Bedürfnissen an. In meinem Fall sind folgende Einstellungen ideal. Allerdings benutze ich es halt zur Darstellung des Avatars. Man kann diese Technik aber auch für bewegte 3D-Vorschaubilder im Inventar oder ähnliches benutzen.
[Blockierte Grafik: https://unrealengine4.de/index.php?attachment/11730-01-rendertarget-size-png/]
Auf jeden Fall sollte die Größe so gewählt werden das von dem Objekt, welches am Ende dargestellt werden soll, nichts abgeschnitten wird.
Für das Rendertarget brauchen wir nun nichts mehr. Es ist jedoch ratsam es offenzulassen und in einem Nebenfenster im Auge zu behalten, weil dadurch die nächsten Schritte einfacher werden.
Als Nächstes erstellen wir einen Actor. Einen ganz normalen Actor in der Auswahl ganz oben.
[Blockierte Grafik: https://unrealengine4.de/index.php?attachment/11731-02-actor-png/]
Diesen benennen wir um in MeshWidget_actor.
Hier wird nun alles reingepackt, was im Widget zu sehen sein soll.
[Blockierte Grafik: https://unrealengine4.de/index.php?attachment/11732-03-actor-komponenten-png/]
In diesem Fall kommt eine Camera hinzu, umbenannt in Mirror 2D
Ein Skeletal Mesh umbenannt in DollMesh
Ganz wichtig ist ein Spotlight das alles, was von der Kamera gefilmt wird von vorne beleuchtet. Wenn ihr dies nicht macht, habt ihr nur einen schwarzen Umriss. Wenn ihr etwas in der Art erzeugen möchtet, sieht dann aus wie ein Shadow Warrior, dann lasst halt das Licht weg.
Zusätzlich habe ich noch Skylight und Atmospheric Fog eingefügt, um die Ausleuchtung etwas besser hinzubekommen. Ist nicht nötig, aber experimentiert da ruhig etwas rum.
Hier kommt übrigens alles rein, was später zu sehen sein soll. Wenn der Avatar also zum Beispiel auf einem Podest stehen soll, kommt der hier rein. Was auch schick aussieht, ist ein Flammenparticle System von unten, das hat dann ein wenig was von Höllenfeuer usw.
Einfachheitshalber bleiben wir jedoch nur beim Avatar, SKamera und SpotLight.
Diese Komponenten werden nun in einer Reihe angeordnet. Das Skeletal Mesh zuerst. Dann die Kamera, diese wird auf den Avatar ausgerichtet, sodass dieser komplett im Bild ist.
Und über der Kamera kommt das Spotlight hin das den Avatar anstrahlt. Bei der gesamten Ausrichtung hilft der Trick mit dem offenen Rendertarget, um zu sehen, was abgebildet wird. Hier sollte man auf jeden Fall einen Sportstrahler verwenden, denn sonst sieht man einfach nur schwarz.
Nun klickt ihr eines der Komponenten an und gebt unter Details den Suchbegriff „owner“ ein.
Nun geht ihr alle Komponenten durch und über all wo Owner No See erscheint, macht ihr dort ein Häkchen rein.
[Blockierte Grafik: https://unrealengine4.de/index.php?attachment/11733-04-owner-no-see-png/]
Der DollMesh könnt ihr noch eine Animation, z.B. Idle falls vorhanden, hinzufügen, dann bewegt sich der Avatar noch ein wenig. Und vorher natürlich noch ein DummyMesh, wie zum Beispiel das Mannquin von Unreal, damit überhaupt etwas zu sehen ist.
Zusätzlich fügen wir dem Ganzen noch eine Variable hinzu. Diese benennen wir in InputMesh um. Wir schalten sie auf Typ „Skeletal Mesh Object Reference“.
[Blockierte Grafik: https://unrealengine4.de/index.php?attachment/11734-05-variable-png/]
[Blockierte Grafik: https://unrealengine4.de/index.php?attachment/11735-06-variable-settings-png/]
Zudem muss diese Variable auf Instance Editable und Expose on Spawn gestellt werden.
Wir wechseln nun vom Viewport in den Eventgraph.
An das Event BeginPlay hängen wir die Node Set Skeletal Mesh.
Das Target wird mit DollMesh und New Mesh mit InputMesh verbunden.
Kümmern wir uns nun um das Material.
Legen wir also ein neues Material an und nennen dies MeshWidget_mat.
Die Materialeigenschaften stellen wir auf
Material Domain: User Interface
Blend Mode: Masket
[Blockierte Grafik: https://unrealengine4.de/index.php?attachment/11737-08-materal-details-png/]
In das Material kommen schlicht zwei Nodes. Einmal Texture Sample wo als Texture das Rendertarget „Avatar_Mirror“ reinkommt.
Der RGB-Ausgang wird mit Final Coloor von dem Material verbunden.
Den Alphaausgang verbinden wir mit einem OneMinus und diesen dann mit Opacity Mask.
[Blockierte Grafik: https://unrealengine4.de/index.php?attachment/11739-10-material-nodes-png/]
Dies dient dem folgenden Zweck. Durch die Maske wird der Avatar später freigestellt dargestellt. Ansonsten hätte dieser einen schwarzen Rand um sich herum. Dies ist natürlich nicht so wichtig, wenn ihr noch mehr Objekte wie eine Plattform oder eine Wand im Hintergrund habt. OneMinus ist wichtig, weil ansonsten würde der schwarze Rahmen dargestellt werden und die Figur als durchsichtig. Netter Effekt, allerdings wüsste ich dafür keine Anwendung.
Das Material ist nun fertig.
Fangen wir mit dem Widget an.
Wir erstellen also ein neues Widget. Dies beinhaltet nur ein Image. Wir benennen dies in ShowMesh um.
[Blockierte Grafik: https://unrealengine4.de/index.php?attachment/11740-11-meshimage-png/]
Das Image stellen wir auf Is Variable. Size X und Y bekommt die gleiche Größe wie das Rendertarget. Und als Brush wählen wir das MeshWidget_mat.
Hier noch ein kleines Anwendungsbeispiel.
[Blockierte Grafik: https://unrealengine4.de/index.php?attachment/11742-beispiel-png/]
Kommentare