Menggunakan V-pad

19min
V-pad
Antarmuka kontrol diperlukan untuk memanipulasi karakter dalam dunia.
ZEPETO World pada dasarnya membuat antarmuka kontrol yang disebut V-pad saat runtime melalui ZEPETOPlayers.
﻿
V-pad dapat melakukan fungsi berikut tergantung pada area yang disentuh pemain di layar:
﻿
﻿
1) Layar sentuh: Ketika Anda menyentuh area pad dan menggesernya ke atas, bawah, kiri, atau kanan, pemain lokal bergerak di sepanjang sumbu XZ.
Ketika Anda mengetuk di dalam area pad, touchpad muncul di lokasi yang disentuh, dan menghilang setelah aksi sentuh selesai.
Area pad default adalah sebagai berikut:
Mode layar
Ukuran kanvas
Ukuran area
Horizontal
1334 X 750
600 X 450
Vertikal
750 X 1334
375 X 500
﻿
2) Tombol lompat: Menekan tombol menyebabkan pemain lokal melompat. Nilai tinggi dari lompatan dapat diubah melalui Zepeto Players > Karakter > Daya Lompat.
﻿
👍 Tips
Area pad dapat diubah dengan mengatur area prefab yang terdaftar di Kontrol Pemain Zepeto.
Ubah ukuran area dalam urutan berikut.
Pilih prefab default yang terdaftar di Kontrol Pemain Zepeto dan salin prefab dengan menyeret dan menjatuhkannya ke dalam Assets.
Pilih objek Pad di dalam Prefab yang disalin.
Ubah Lebar dan Tinggi komponen Rect Transform ke ukuran yang diinginkan.
﻿
﻿
Struktur objek V-pad yang dibuat saat runtime adalah sebagai berikut.
﻿
1) Pad: Objek UI layar yang dapat menggerakkan posisi karakter.
Latar Belakang: Gambar latar belakang hitam transparan yang menunjukkan area pad.
HandleOrigin: Area lingkaran luar dari pad. HandleOrigin mengubah posisi tergantung pada lokasi yang disentuh.
Handle: Area lingkaran dalam dari pad. Ketika Handle disentuh dan diseret, posisinya berubah dan tidak meninggalkan area HandleOrigin.
2) Lompat: Objek tombol yang memungkinkan karakter untuk melompat.
Atas: Objek gambar lompat di dalam tombol Lompat.
﻿
Cara mendapatkan nilai input V-pad
Untuk menerima nilai input V-pad, Anda harus mengakses komponen ZepetoScreenTouchpad dan komponen ZepetoScreenButton yang dibuat saat runtime dan mendaftarkan sebuah event.
Event ZepetoScreenTouchpad
Komponen ZepetoScreenButton adalah komponen tombol lompat karakter. Event yang dapat diakses termasuk:
Event
Deskripsi
OnPointerDownEvent
Event ini terjadi ketika pengguna menekan V-pad.
OnDragEvent
Event ini terjadi saat pengguna menekan V-pad.
OnPointerUpEvent
Event ini terjadi ketika pengguna melepaskan V-Pad.
﻿
ZepetoScreenButton Event
Komponen ZepetoScreenButton adalah komponen tombol loncat karakter. Acara yang dapat diakses termasuk:
Acara
Deskripsi
OnPointDownEvent
Acara ini terjadi ketika pengguna menekan tombol loncat.
OnPointUpEvent
Acara ini terjadi ketika pengguna melepaskan tombol loncat.
﻿
Contoh Skrip
Skrip berikut adalah contoh untuk mengeluarkan nilai posisi V-pad ke konsol ketika pengguna menekan touchpad.
GetVPadInput
import { Object } from 'UnityEngine';
import { ZepetoPlayers, ZepetoScreenButton, ZepetoScreenTouchpad } from 'ZEPETO.Character.Controller';
import { ZepetoScriptBehaviour } from 'ZEPETO.Script'

export default class GetVPadInput extends ZepetoScriptBehaviour {

    Start() {

        // Tambahkan pendengar untuk acara ketika pemain lokal ditambahkan
        ZepetoPlayers.instance.OnAddedLocalPlayer.AddListener(() => {
            this.GetPadTouch();
            this.GetJumpTouch();
        });
    }

    GetPadTouch() {

        // Temukan objek ZepetoScreenTouchpad di dalam scene
        const touchPad = Object.FindObjectOfType<ZepetoScreenTouchpad>();

        // Tambahkan pendengar untuk acara drag pada touchpad
        touchPad.OnDragEvent.AddListener(() => {
            // Catat posisi pegangan sentuh ketika acara drag terjadi
            console.log(touchPad.touchHandle.transform.position);
        });
    }

    GetJumpTouch() {

        // Temukan objek ZepetoScreenButton di dalam scene
        const screenButton = Object.FindObjectOfType<ZepetoScreenButton>();

        // Tambahkan pendengar untuk OnPointDownEvent dari screenButton
        // Pendengar ini mencatat "Tombol Lompat Turun" ketika tombol ditekan
        screenButton.OnPointDownEvent.AddListener(() => {

            console.log("Tombol Lompat Turun");
        });

        // Tambahkan pendengar untuk OnPointUpEvent dari screenButton
        // Pendengar ini mencatat "Tombol Lompat Naik" ketika tombol dilepaskan
        screenButton.OnPointUpEvent.AddListener(() => {

            console.log("Tombol Lompat Naik");
        });

    }

}
import { Object } from 'UnityEngine';
import { ZepetoPlayers, ZepetoScreenButton, ZepetoScreenTouchpad } from 'ZEPETO.Character.Controller';
import { ZepetoScriptBehaviour } from 'ZEPETO.Script'

export default class GetVPadInput extends ZepetoScriptBehaviour {

    Start() {

        // Tambahkan pendengar untuk acara ketika pemain lokal ditambahkan
        ZepetoPlayers.instance.OnAddedLocalPlayer.AddListener(() => {
            this.GetPadTouch();
            this.GetJumpTouch();
        });
    }

    GetPadTouch() {

        // Temukan objek ZepetoScreenTouchpad di dalam scene
        const touchPad = Object.FindObjectOfType<ZepetoScreenTouchpad>();

        // Tambahkan pendengar untuk acara drag pada touchpad
        touchPad.OnDragEvent.AddListener(() => {
            // Catat posisi pegangan sentuh ketika acara drag terjadi
            console.log(touchPad.touchHandle.transform.position);
        });
    }

    GetJumpTouch() {

        // Temukan objek ZepetoScreenButton di dalam scene
        const screenButton = Object.FindObjectOfType<ZepetoScreenButton>();

        // Tambahkan pendengar untuk OnPointDownEvent dari screenButton
        // Pendengar ini mencatat "Tombol Lompat Turun" ketika tombol ditekan
        screenButton.OnPointDownEvent.AddListener(() => {

            console.log("Tombol Lompat Turun");
        });

        // Tambahkan pendengar untuk OnPointUpEvent dari screenButton
        // Pendengar ini mencatat "Tombol Lompat Naik" ketika tombol dilepaskan
        screenButton.OnPointUpEvent.AddListener(() => {

            console.log("Tombol Lompat Naik");
        });

    }

}
﻿
Deskripsi Skrip
Daftarkan pendengar acara yang memanggil GetPadTouch() dan GetJumpTouch() fungsi ketika pemain lokal ditambahkan ke dalam adegan.
Fungsi GetPadTouch() adalah fungsi yang memproses acara sentuh yang terjadi pada touchpad.
Gunakan Object.FindObjectOfType<ZepetoScreenTouchpad>() untuk menemukan objek ZepetoScreenTouchpad dalam adegan.
Tambahkan pendengar untuk OnDragEvent. Pendengar ini akan aktif ketika acara drag terjadi pada touchpad.
Di dalam pendengar, lokasi pegangan sentuh akan dikeluarkan ke konsol.
Fungsi GetJumpTouch() adalah fungsi yang memproses acara yang terjadi dari tombol lompat.
Gunakan Object.FindObjectOfType<ZepetoScreenButton>() untuk menemukan objek ZepetoScreenButton dalam adegan.
Tambahkan pendengar untuk OnPointDownEvent dan OnPointUpEvent dari tombol lompat.
Di dalam OnPointDownEvent, sebuah log yang disebut Jump Button Down dikeluarkan setiap kali tombol lompat ditekan.
Di dalam OnPointUpEvent, sebuah log yang disebut Jump Button Up dikeluarkan setiap kali tombol lompat dilepaskan.
﻿
Jika Anda menjalankannya dengan menekan tombol Putar, Anda dapat melihat nilai posisi V-pad ditampilkan di log konsol setiap kali Anda menekan V-pad. Anda juga akan melihat log konsol ditampilkan setiap kali Anda menekan atau melepaskan tombol lompat.
﻿
﻿
﻿
Kustomisasi V-Pad
Anda dapat mengontrol V-Pad menggunakan ScreenTouchPad dan ScreenButton.
Anda dapat menghidupkan/mematikan V-Pad dari UIController_TouchPad_Horizontal, dan UIController_TouchPad_Vertical Prefab.
Berikut adalah tampilan saat Touch Pad dimatikan. Anda dapat mematikan Tombol Lompatan dengan cara yang sama.
﻿
﻿
Pengaturan Lompatan Ganda
Anda dapat menambahkan fungsi lompatan ganda ke tombol lompatan V-pad atau menerapkan fungsi tombol lompatan ganda kustom.
﻿
﻿
Untuk mengaktifkan fitur lompatan ganda, aktifkan kotak centang Parameter Kustom > Lompatan Ganda di bagian Karakter dari komponen ZepetoPlayers.
Tinggi dari lompatan ganda dapat diatur dengan menyesuaikan nilai Daya.
﻿
﻿
Ada tiga cara untuk menggunakan fitur lompatan ganda pada V-pad:
﻿
1) Pengaturan melalui Prefab V-Pad
Saat menggunakan Lompatan Ganda dengan Tombol V-Pad, atur sebagai berikut.
Klik prefab UIController_TouchPad_Vertical atau UIController_TouchPad_Horizontal. Anda akan dipindahkan ke folder tempat prefab asli berada di bawah folder Packages di panel Proyek.
﻿
﻿
Salin prefab UIController_TouchPad_Vertical atau UIController_TouchPad_Horizontal dengan menyeret dan menjatuhkannya ke dalam folder Assets.
﻿
❗️ Peringatan
Prefab asli di folder Packages tidak dapat dimodifikasi, jadi Anda harus menyalin salinan ke folder Assets untuk memodifikasinya.
Jika Anda mencoba memodifikasi Prefab asli, akan terjadi kesalahan Immutable Prefab.
﻿
﻿
Klik dua kali pada prefab UIController_TouchPad_Vertical atau UIController_TouchPad_Horizontal di item Prefab yang disalin atau tekan tombol Buka Prefab di jendela Inspector untuk mengedit Prefab.
﻿
﻿
Pilih objek Jump dari sub-objek Prefab.
﻿
﻿
Di komponen Tombol Layar Zepeto dari objek Jump, tekan tombol + di On Point Down Event() dan daftarkan sebuah acara sebagai berikut.
﻿
On Point Down Event()
Hanya Runtime
Pilih Objek : Daftarkan UIController_TouchPad_Vertical atau UIController_TouchPad_Horizontal.
Fungsi Acara : Klik bagian No Function dan atur ke UIZepetoPlayerControl > DoubleJump() fungsi.
﻿
﻿
Jika pengaturannya sebagai berikut, itu berhasil.
﻿
﻿
2) Pengaturan menggunakan skrip
Skrip ini memungkinkan karakter untuk melakukan lompatan ganda sebagai respons terhadap input dari tombol lompat V-pad.
TypeScript
import { ZepetoScriptBehaviour } from 'ZEPETO.Script';
import { Object } from 'UnityEngine';
import { ZepetoScreenButton, CharacterState, ZepetoPlayers } from 'ZEPETO.Character.Controller';
 
export default class DobuleJump extends ZepetoScriptBehaviour {
 
    Start() {
         
           // Dengarkan ketika pemain lokal ditambahkan dan jalankan fungsi lambda yang diberikan
        ZepetoPlayers.instance.OnAddedLocalPlayer.AddListener(() => {
 
            // Ambil karakter pemain lokal
            const zepetoCharacter = ZepetoPlayers.instance.LocalPlayer.zepetoPlayer.character;
 
            // Temukan objek tipe ZepetoScreenButton di scene
            const screenButton = Object.FindObjectOfType<ZepetoScreenButton>();
 
            // Tambahkan pendengar untuk OnPointDownEvent dari tombol layar untuk menangani aksi lompatan
            screenButton.OnPointDownEvent.AddListener(() => {
 
                // Jika keadaan karakter saat ini adalah Jump, aktifkan lompatan ganda
                if (zepetoCharacter.CurrentState === CharacterState.Jump) {
                    zepetoCharacter.DoubleJump();
                }
            });
        })    
    }
}


import { ZepetoScriptBehaviour } from 'ZEPETO.Script';
import { Object } from 'UnityEngine';
import { ZepetoScreenButton, CharacterState, ZepetoPlayers } from 'ZEPETO.Character.Controller';
 
export default class DobuleJump extends ZepetoScriptBehaviour {
 
    Start() {
         
           // Dengarkan ketika pemain lokal ditambahkan dan jalankan fungsi lambda yang diberikan
        ZepetoPlayers.instance.OnAddedLocalPlayer.AddListener(() => {
 
            // Ambil karakter pemain lokal
            const zepetoCharacter = ZepetoPlayers.instance.LocalPlayer.zepetoPlayer.character;
 
            // Temukan objek tipe ZepetoScreenButton di scene
            const screenButton = Object.FindObjectOfType<ZepetoScreenButton>();
 
            // Tambahkan pendengar untuk OnPointDownEvent dari tombol layar untuk menangani aksi lompatan
            screenButton.OnPointDownEvent.AddListener(() => {
 
                // Jika keadaan karakter saat ini adalah Jump, aktifkan lompatan ganda
                if (zepetoCharacter.CurrentState === CharacterState.Jump) {
                    zepetoCharacter.DoubleJump();
                }
            });
        })    
    }
}

﻿
Deskripsi skrip
ZepetoPlayers.instance.OnAddedLocalPlayer.AddListener() mendaftar pendengar yang dipicu ketika pemain lokal ditambahkan ke permainan. Ini berfungsi untuk mengonfigurasi fitur lompatan ganda yang akan ditambahkan saat pemain lokal ditambahkan.
ZepetoPlayers.instance.LocalPlayer.zepetoPlayer.character memberikan akses ke karakter pemain lokal. Object.FindObjectOfType() menemukan objek tipe ZepetoScreenButton di scene saat ini dan menetapkannya untuk aksi lompatan.
ScreenButton.OnPointDownEvent.AddListener() menambahkan pendengar ke OnPointDownEvent tombol layar. Pendengar ini menunggu baik sentuhan layar atau klik dan memulai aksi lompatan atau lompatan ganda.
Di dalam pendengar, pernyataan if memeriksa apakah keadaan karakter saat ini adalah CharacterState.Jump. Jika benar, itu mengeksekusi zepetoCharacter.DoubleJump().
﻿
Setelah menulis skrip, buat GameObject kosong di scene dan tambahkan skrip DobuleJump.ts sebagai komponen.
﻿
﻿
3) Pengaturan melalui Tombol Kustom
Jika Anda memilih untuk membuat dan menggunakan tombol Anda sendiri, silakan tambahkan skrip seperti yang ditunjukkan di bawah ini.
Skrip ini menambahkan fungsi lompatan dan lompatan ganda ke tombol yang ditentukan oleh pengguna.
TypeScript
import { ZepetoScriptBehaviour } from 'ZEPETO.Script';
import { Button } from 'UnityEngine.UI';
import { CharacterState, ZepetoCharacter, ZepetoPlayers } from 'ZEPETO.Character.Controller';
 
export default class JumpButton extends ZepetoScriptBehaviour {
 
    public shotButton: Button;
    private zepetoCharacter: ZepetoCharacter;
 
    Start() {
 
        // Buat karakter
        ZepetoPlayers.instance.OnAddedLocalPlayer.AddListener(() => {
            this.zepetoCharacter = ZepetoPlayers.instance.LocalPlayer.zepetoPlayer.character;
        });
 
        // Tambahkan komponen skrip
        this.shotButton.onClick.AddListener(() => {
            if (this.zepetoCharacter.CurrentState === CharacterState.Jump) {
                this.zepetoCharacter.DoubleJump();
            } else {
                this.zepetoCharacter.Jump();
            }
        });
    }
}

import { ZepetoScriptBehaviour } from 'ZEPETO.Script';
import { Button } from 'UnityEngine.UI';
import { CharacterState, ZepetoCharacter, ZepetoPlayers } from 'ZEPETO.Character.Controller';
 
export default class JumpButton extends ZepetoScriptBehaviour {
 
    public shotButton: Button;
    private zepetoCharacter: ZepetoCharacter;
 
    Start() {
 
        // Buat karakter
        ZepetoPlayers.instance.OnAddedLocalPlayer.AddListener(() => {
            this.zepetoCharacter = ZepetoPlayers.instance.LocalPlayer.zepetoPlayer.character;
        });
 
        // Tambahkan komponen skrip
        this.shotButton.onClick.AddListener(() => {
            if (this.zepetoCharacter.CurrentState === CharacterState.Jump) {
                this.zepetoCharacter.DoubleJump();
            } else {
                this.zepetoCharacter.Jump();
            }
        });
    }
}
﻿
Deskripsi skrip
ZepetoPlayers.instance.OnAddedLocalPlayer.AddListener() mendaftarkan fungsi yang akan dijalankan ketika pemain lokal ditambahkan ke dalam permainan.
this.shotButton.onClick.AddListener() menambahkan fungsi yang akan dijalankan ketika shotButton diklik.
Ketika fungsi dipicu, ia memeriksa apakah keadaan karakter saat ini adalah keadaan melompat dan menjalankan lompatan atau lompatan ganda.
Jika karakter berada dalam keadaan melompat, this.zepetoCharacter.DoubleJump() dipanggil untuk melakukan lompatan ganda; jika tidak, this.zepetoCharacter.Jump() dipanggil untuk melakukan lompatan.
﻿
Setelah menulis skrip, buat GameObject kosong di dalam scene dan tambahkan skrip JumpButton.ts sebagai komponen.
Akhirnya, tetapkan tombol lompatan ke Tombol Tembakan di Inspector.
﻿
﻿
Mode layar	Ukuran kanvas	Ukuran area
Horizontal	1334 X 750	600 X 450
Vertikal	750 X 1334	375 X 500
Event	Deskripsi
OnPointerDownEvent	Event ini terjadi ketika pengguna menekan V-pad.
OnDragEvent	Event ini terjadi saat pengguna menekan V-pad.
OnPointerUpEvent	Event ini terjadi ketika pengguna melepaskan V-Pad.