Dalam dunia game salah satu faktor pentingnya adalah character atau sang actor, dan tentunya untuk beberapa jenis game character yang tidak monoton sangat diperlukan, salah satu cara untuk membuatnya tidak monoton adalah dengan melakukan perubahan wajah, maka tutorial berikut akan membahas cara pergantian wajah secara simple.

Secara umum pergantian wajah dilakukan dengan pergantian image, namun cara tersebut memiliki banyak kekurangan, dalam tutorial ini akan dibahas cara pergantian wajah karakter dengan cara mengganti bagian wajah saja, dan kita kali ini akan menggunakan NML, langsung saja kita mulai.

Pertama siapkan file image png seperti dibawah ini dengan image utama dikiri dan image wajah dikanan

Setelah itu kita buat file nmlnya, dengan format namafile.nml, setelah itu buka dengan notepad atau alat editor lainnya dan mari buat isinya

Yang kita butuhkan pertama kali adalah untuk meload resource yang beruta texture, maka dari itu buat tag resource dan texture yang akan meload file image yang sudah kita siapkan seperti dibawah ini

<Resources>
<Texture name="nama_texture" source="Folder\fileimage.png" hidden="true"/>
</Resources>

Setelah itu saatnya kita menggambar object pada canvas, tag yang digunakan adalah Set, set adalah sebuah objek yang dapat berisi state, hanya satu state yang dapat digambar/diambil pada suatu waktu.

Sekarang masukan ukuran set yang kita gunakan, contoh size yag kita pakai adalah lebar 481 dan panjang 600 maka kita buat set seperti berikut

<Set name="nama_set" size="481,600" version="2">

Tips : ukuran dapat disesuaikan dengan size image karakter tanpa bagian wajah yang disebelah kanan, karena kita akan menggambar karakternya saja sehingga apabila kita set lebih luas misal lebar 600 maka sisa lebar yang tidak terpakai akan menjadi sia-sia.

Contoh size yang tepat seperti berikut lebar 481 dan panjang 600

Contoh size yang kurang tepat lebar 600 dan panjang 600, karena menyia-nyiakan space canvas

Setelah itu kita dapat menggambar pada canvas dengan menggunakan tag state, kita ambil pose pertama yaitu pose char asli tanpa wajah tambahan seperti berikut

<State name="Pose pertama">
<Image texture="nama_texture" rect="0,0,481,600"/>
</State>

Lalu bagaimana cara mengganti wajahnya? mari kita buat pose kedua seperti berikut

Kita akan ambil wajah yang kedua, liat wajah kedua yang ada dikanan image ini

Pertama gambar char utama seperti contoh sebelumnya kemudian ambil coordinat wajah, ukuran wajah dan coordinat dari wajah utama yang akan direplace, dalam contoh ini coor wajah yang kita pilih adalah (482,84) dan ukuran wajahnya lebar 97 panjang 81, dan coor wajah utama adalah (159,123) sehingga nml-nya seperti berikut

<State name="Pose kedua">
<Image texture="nama_texture" rect="0,0,481,600">
<Image texture="nama_texture" position="159,123" rect="482, 84, 97, 81" />
</Image>
</State>

Dan akan tampak seperti berikut apabila berhasil

Lalu gabungkan semua nml tadi sehingga akan seperti berikut :

<?xml version="1.0" encoding="utf-8" ?>
<Resources>
<Texture name="nama_texture" source="Folder\fileimage.png" hidden="true"/>
<Set name="nama_set" size="481,600" version="2">
<State name="Pose pertama">
<Image texture="nama_texture " rect="0,0,481,600"/>
</State>
<State name="Pose kedua">
<Image texture="nama_texture " rect="0,0,481,600">
<Image texture="nama_texture " position="159,123" rect="482, 84, 97, 81" />
</Image>
</State>
</Set>
</Resources>

Kira-kira setelah diaplikasi hasilnya sebagai berikut :

Pose pertama :

Pose kedua :

Sekian dulu sedikit info dari saya, terima kasih ^_^