Sembunyikan dan Tampilkan Penampilan Karakter ZEPETO

4 mnt

Menggunakan metode Renderer

Anda dapat menonaktifkan Renderer Karakter ZEPETO untuk membuatnya tidak terlihat oleh kamera.

Berikut adalah contoh kode untuk menyembunyikan dan menampilkan penampilan karakter dengan menekan tombol.

1) Buat Hierarki > Buat Objek Kosong dan ganti namanya menjadi HideShowCharacter.

2) Buat Proyek > Buat > ZEPETO > TypeScript dan ganti namanya menjadi HideShowCharacter.

3) Tambahkan skrip ke objek HideShowCharacter.

4) Tulis skrip contoh seperti yang ditunjukkan di bawah ini.

import { Renderer } from 'UnityEngine';
import { Button } from 'UnityEngine.UI';
import { SpawnInfo, ZepetoPlayers } from 'ZEPETO.Character.Controller';
import { ZepetoScriptBehaviour } from 'ZEPETO.Script';
 
export default class HideShowCharacter extends ZepetoScriptBehaviour {
 
    public hideCharacterBtn: Button;
    public showCharacterBtn: Button;
 
    Start() {
        ZepetoPlayers.instance.OnAddedLocalPlayer.AddListener(() => {
            this.hideCharacterBtn.onClick.AddListener(() => {
                // Nonaktifkan Renderer Karakter Zepeto untuk membuatnya tidak terlihat oleh kamera 
                ZepetoPlayers.instance.LocalPlayer.zepetoPlayer.character.GetComponentsInChildren<Renderer>().forEach(r => {
                    r.enabled = false;
                    console.log("Sembunyikan");
                });
            });
 
            this.showCharacterBtn.onClick.AddListener(() => {
                ZepetoPlayers.instance.LocalPlayer.zepetoPlayer.character.GetComponentsInChildren<Renderer>().forEach(r => {
                    r.enabled = true;
                    console.log("Tampilkan");
                });
            });  
        });
    }
 
}

5) Gunakan Canvas > Tombol untuk menambahkan setiap tombol ke layar dan menetapkannya ke inspector skrip.

6) Tekan tombol [▶︎(putar)] untuk menjalankannya.

Ubah lapisan karakter untuk menangani penyembunyian

Selain menonaktifkan Renderer karakter, Anda juga dapat menyembunyikan dan menampilkan penampilan karakter.

Ini dilakukan dengan memanfaatkan Culling Mask di Kamera ZEPETO.

Culling Mask memungkinkan Anda untuk memperlakukan lapisan tertentu sebagai tidak terlihat.

Ketika karakter ZEPETO dibuat, tidak ada Lapisan yang diatur secara default.

Kode contoh berikut menunjukkan cara membuat lapisan tertentu tidak terlihat di Kamera ZEPETO, dan kemudian mengubah lapisan karakter ZEPETO dengan mengklik tombol untuk menyembunyikan dan menampilkannya.

import { ZepetoScriptBehaviour } from 'ZEPETO.Script';
import { Camera, LayerMask, Transform } from "UnityEngine";
import { ZepetoCharacter, ZepetoPlayers } from "ZEPETO.Character.Controller";
import { Button } from "UnityEngine.UI";

// Fungsi yang mengubah lapisan semua sub-objek dari karakter
function ChangeLayersRecursively(transform: Transform, layer: string, fromLayer?: string): void {
    if (!transform || !layer || layer.length === 0) {
        return;
    }

    if (fromLayer) {
        if (transform.gameObject.layer === LayerMask.NameToLayer(fromLayer)) {
            transform.gameObject.layer = LayerMask.NameToLayer(layer);
        }
    } else {
        transform.gameObject.layer = LayerMask.NameToLayer(layer);
    }
    for (let i = 0; i < transform.childCount; i++)
    {
        let child = transform.GetChild(i);
        ChangeLayersRecursively(child, layer, fromLayer);
    }
}

export default class ChangeCameraLayer extends ZepetoScriptBehaviour {

    private zepetoCamera : Camera;
    public hideCharacterBtn: Button;
    public showCharacterBtn: Button;

    Start() {
        ZepetoPlayers.instance.OnAddedLocalPlayer.AddListener(() => {
            let character = ZepetoPlayers.instance.LocalPlayer.zepetoPlayer.character;
            this.zepetoCamera = ZepetoPlayers.instance.LocalPlayer.zepetoCamera.camera;
            // Tambahkan lapisan ke culling mask
            this.zepetoCamera.cullingMask |= (1 << LayerMask.NameToLayer("Player"));
            // Hapus lapisan dari culling mask
            this.zepetoCamera.cullingMask &= ~(1 << LayerMask.NameToLayer("TransparentFX"));

            this.hideCharacterBtn.onClick.AddListener(() => {
                this.SetHiddenLayer(character);
            });

            this.showCharacterBtn.onClick.AddListener(() => {
                this.SetPlayerLayer(character);
            });
        });
    }

    SetPlayerLayer(playerObject: ZepetoCharacter) {
        ChangeLayersRecursively(playerObject.transform, "Player");
    }

    SetHiddenLayer(playerObject: ZepetoCharacter) {
        ChangeLayersRecursively(playerObject.transform, "TransparentFX");
    }
}