Professional Documents
Culture Documents
Zombie Apocalypse AR Tutorials
Zombie Apocalypse AR Tutorials
3
PHẦN 7. HOÀN THIỆN GAMEPLAY VÀ CÁC THÔNG TIN HIỂN THỊ 2D CỦA
TRÒ CHƠI 29
A. Kết quả cần đạt được 29
B. Các hướng phát triển và mở rộng 29
4
PHẦN 0. GIỚI THIỆU & CÁC YÊU CẦU BẮT BUỘC
A. Giới thiệu
5
B. Yêu cầu thiết bị
Bắt buộc cần phải có 2 loại thiết bị sau:
● Máy tính (PC/Laptop) sử dụng hệ điều hành có hỗ trợ Unity 3D;
● Thiết bị di động có hỗ trợ Google ARCore.
Về phần thiết bị di động, vì chúng ta dự định làm game AR sử dụng công nghệ Google
ARCore nên sẽ cần các thiết bị hỗ trợ công nghệ này. Danh sách các thiết bị di động có hỗ trợ
Google ARCore được liệt kê ở link dưới đây:
https://developers.google.com/ar/discover/supported-devices
6
Khuyến khích sử dụng các thiết bị di động có khả năng quay video tốt vì chất lượng quay sẽ
ảnh hưởng trực tiếp đến độ chính xác của Google ARCore.
Về phần máy tính dùng để phát triển, tốt nhất nên chọn máy tính có sử dụng hệ điều hành
Windows. Nếu bạn nào đang chỉ dùng mỗi Ubuntu thì cài thêm Windows chạy song song.
➥ Lưu ý:
● Unity 3D ngốn khá nhiều tài nguyên nên tuyệt đối không sử dụng máy ảo hay một thứ
gì tương tự để chạy Unity 3D.
● Các bạn sử dụng hệ điều hành MacOS thì theo lý thuyết khi thực hiện các bước hướng
dẫn sau này thì mọi thứ cũng gần tương tự như trên Windows.
7
PHẦN 1. CÀI ĐẶT MÔI TRƯỜNG VÀ PHẦN MỀM
Nếu như bạn chưa cài Unity thì khuyến cáo nên sử dụng Unity Hub để tải và cài đặt bản
Unity mới nhất, lúc đó các bước cài đặt ở dưới sẽ được đơn giản hóa. Tải và cài đặt Unity
bằng Unity Hub tại đây: https://store.unity.com/download.
● ARCore by Google: Đây là một ứng dụng trên Google Play Store. Thiết bị Android
của bạn cần phải có ứng dụng này thì mới chạy được các ứng dụng có sử dụng AR
trên Android. Nếu không tìm thấy trên Google Play Store ứng dụng này thì khả năng
cao thiết bị Android của bạn không hỗ trợ ARCore (danh sách các thiết bị hỗ trợ
ARCore có thể xem chi tiết ở link sau:
https://developers.google.com/ar/discover/supported-devices).
8
B. Cài đặt phần mềm
Tải Unity (bản Personal) tại https://store.unity.com/download.
Ngoài ra nếu sau này gặp lỗi trong quá trình Build Android App (hoặc bất kỳ một lỗi nào đó
mà không Google Search ra được) thì có thể sửa bằng cách cài đặt thêm:
● Android Target Support: https://unity3d.com/unity/whats-new/unity-2018.1.0 (Lưu
ý chọn đúng phiên bản Unity tương ứng)
● Android SDK: https://docs.unity3d.com/2018.1/Documentation/Manual/android-
sdksetup.html (Lưu ý chọn đúng phiên bản Unity tương ứng)
● Visual Studio: Dùng cho việc lập trình (bằng C#) trong Unity. Thường thì Visual
Studio sẽ được cài đặt cùng Unity. Còn nếu vì một lý do nào đó mà Visual Studio
không được cài đặt cùng Unity thì bạn có thể tải và cài đặt thủ công:
https://visualstudio.microsoft.com/vs/community.
9
PHẦN 2. XÂY DỰNG ỨNG DỤNG AR TRÊN ANDROID
BẰNG GOOGLE ARCORE
➥ Lưu ý:
● Phải đảm bảo thiết bị Android của bạn đã cài đặt ARCore by Google.
● Thiết bị có camera càng tốt thì khả năng nhận diện của Google ARCore sẽ càng
nhanh và chính xác.
10
PHẦN 3. TẠO ZOMBIES VỚI KHẢ NĂNG DI CHUYỂN
➥ Lưu ý:
● Các Models trên được lấy từ trang https://www.mixamo.com. Đây là một trang cung
cấp các Models miễn phí (có cả Animations).
● Để sử dụng các Models trên Mixamo thì bạn sẽ phải ngồi lựa chọn các Animations
phù hợp, rồi khi import vào Unity thì cũng sẽ phải trải qua một số bước lằng nhằng
nữa mới có thể sử dụng được (video hướng dẫn:
https://www.youtube.com/watch?v=P4PrO8fHZ4E). Còn các Zombie Models trong
link Google Drive bên trên thì đã làm sẵn mọi thứ, chỉ việc sử dụng.
11
● Trong cửa sổ Hierarchy, đổi tên zombiegirl_w_kurniawan thành FemaleZombie.
● Trong thư mục Assets sẽ xuất hiện file ZombieController. Kích đúp chuột vào file
này để chỉnh sửa. Lúc này Visual Studio sẽ mở ra.
12
● Copy & paste đoạn code sau vào trong phương thức Update:
transform.LookAt(Camera.main.transform.position);
transform.Translate(Vector3.forward * Time.deltaTime);
transform.eulerAngles = new Vector3(0, transform.eulerAngles.y, 0);
● Save file ZombieController.cs, sau đó quay trở lại Unity bấm nút Play để kiểm tra
thử xem Zombie đã được dịnh chuyển chưa.
● Chuyển 3 dòng code trên vào 1 phương thức mới void Move.
13
● Trong cửa sổ Hierarchy, chọn FemaleZombie. Sau đó kéo thả
Assets/Animators/FemaleZombieAnimatorController vào ô Controller của
Component Animator trong cửa sổ Inspector.
● Bấm nút Play để kiểm tra thử xem Zombie đã được dịnh chuyển kèm theo Walk
Animation chưa.
14
PHẦN 4. TẠO KHẢ NĂNG TẤN CÔNG CHO ZOMBIES
Khi một Zombie tiến lại gần MainCamera thì chúng ta sẽ khiến nó tấn công người chơi.
Unity cung cấp cho chúng ta 2 phương thức: OnCollisionEnter và OnCollisionExit,
tương ứng với khi một vật thể va chạm với một vật thể khác và khi 2 vật thể đó không còn va
chạm. Dưới đây là links tài liệu chi tiết về 2 phương thức trên:
● OnCollisionEnter:
https://docs.unity3d.com/ScriptReference/Collider.OnCollisionEnter.html
● OnCollisionExit:
https://docs.unity3d.com/ScriptReference/Collider.OnCollisionExit.html
15
B. Thêm Script điều khiển Zombie tấn công
● Chúng ta sẽ sử dụng 2 phương thức do Unity cung cấp là OnCollisionEnter và
OnCollisionExit như đã đề cập. Thêm đoạn code sau vào trong
ZombieController:
...
16
Ý tưởng của đoạn code trên chính là khi một FemaleZombie va chạm với
MainCamera thì sẽ gắn giá trị isZombieClose = true, và ngược lại khi không còn
va chạm.
● Trong ZombieController, ta sẽ tạo một phương thức Attack để điều khiển Zombie
tấn công:
void Attack()
{
GetComponent<Animator>().Play("Zombie Attack");
}
● Tiếp theo chúng ta sẽ sử dụng phương thức Update có sẵn để gọi tới hàm Attack
khi isZombieClose == true. Tuy nhiên chúng ta cần thêm 2 biến nữa để quản lý
thời gian giữa 2 lần tấn công của Zombie, nếu không thì Zombie sẽ tấn công liên tục.
Hãy thử tự suy nghĩ và làm viết ra đoạn code phù hợp cho phần này, sau đó có thể
tham khảo đoạn code dưới đây:
attackCooldownTimer -= Time.deltaTime;
if (attackCooldownTimer <= 0 && isZombieClose)
{
Attack();
attackCooldownTimer = timeBetweenAttacks;
}
}
● Quay lại Unity, bấm nút Play và thử xem FemaleZombie đã tấn công khi tới gần
MainCamera hay chưa.
17
C. Tinh chỉnh khả năng tấn công và thêm âm thanh
1. Tinh chỉnh khả năng tấn công của Zombie
Hiện giờ FemaleZombie đã có khả năng tấn công khi tiếp cận MainCamera. Tuy nhiên có
một vấn đề là trong quá trình con Zombie đang giơ tay tấn công thì nó vẫn được dịch chuyển
do phương thức Move được gọi liên tục mỗi lần Update. Để khắc phục, ta sẽ thêm một thuộc
tính nữa gọi là isZombieAttacking để khi con Zombie đang tấn công thì không được gọi tới
phương thức Move nữa.
● Trong phương thức Attack, ta sẽ gắn isZombieAttacking = true. Vấn đề là ta sẽ
phải gắn isZombieAttack = false sau một khoảng thời gian (khi Zombie đã tấn
công xong). Để làm được điều đó ta sẽ dùng StartCoroutine. Trong
ZombieController sửa lại code như sau:
...
void Attack()
{
isZombieAttacking = true;
GetComponent<Animator>().Play("Zombie Attack");
StartCoroutine(finishAttacking());
}
Ở đây 1.2s là khoảng thời gian (tương đối) mà animation Zombie Attack hoàn thành.
● Rồi sau đó trong hàm Update thêm dòng code sau:
Move();
attackCooldownTimer -= Time.deltaTime;
if (attackCooldownTimer <= 0 && isZombieClose)
{
Attack();
attackCooldownTimer = timeBetweenAttacks;
}
18
}
● Save file ZombieController.cs và quay lại Unity bấm nút Play để test thử xem
Zombie còn bị dịch chuyển khi tấn công không.
void Start()
{
attackCooldownTimer = timeBetweenAttacks;
initializeSounds();
}
● Save file ZombieController.cs và bấm Play test thử xem khi Zombie tấn công đã có
âm thanh hay chưa. Nếu gặp lỗi “There are no audio listeners in the scene.” và không
nghe được âm thanh thì sửa bằng cách chọn ARCore Device > First Person Camera
trong cửa sổ Hierarchy rồi thêm Audio Listener thông qua nút Add Component
trong cửa sổ Inspector.
19
PHẦN 5. SỬ DỤNG HỖ TRỢ CỦA ARCORE ĐỂ TẠO
ZOMBIES TỪ CÁC NẤM MỒ TRÊN NỀN ĐẤT THẬT
20
2. Viết Script sinh Zombies từ các nấm mồ
● Trong cửa sổ Project, kéo thả Prefab Tombstones trong thư mục
Assets/Models/CemetaryPack/Prefabs/Tombstones vào bất cứ vị trí nào trong
Scene (bạn có thể chọn bất cứ mẫu prefab nấm mồ nào trong thư mục đó đều được).
● Bấm chọn vào nấm mồ mà bạn vừa đặt vào trong Scene. Trong cửa sổ Inspector,
chọn Add Component > New script, đặt tên là SpawnController. Mở
SpawnController để thêm đoạn code sau (nhớ save file):
21
3. Phương thức spawnZombie làm 2 việc: thứ nhất là lấy vị trí hiện tại của nấm
mồ, thứ hai là tạo một con Zombie mới (dựa trên Prefab được truyền vào)
ngay tại vị trí đó.
● Như vừa đề cập, giờ chúng ta sẽ tiến hành truyền vào Prefab tương ứng với Zombie
muốn tạo ra cho SpawnController, ở đây chính là Prefab FemaleZombie. Trong cửa
sổ Hierarchy, bấm chọn Tombstones (nấm mồ mà bạn vừa đặt trong Scene). Quan
sát trong cửa sổ Inspector, bạn sẽ thấy phần Spawn Controller (Script) sẽ có thêm
thuộc tính mới là Female Zombie Prefab, giờ chỉ cần kéo thả Prefab FemaleZombie
vào là xong (Assets/Models/ZombieModels/ZombieGirl/Prefabs/ FemaleZombie).
● Bấm Play và giờ Zombie sẽ được tạo ra liên tục từ nấm mồ mỗi 10-15s.
● Tạo thư mục Tombstones trong Assets/Models. Kéo Tombstones trong cửa sổ
Hierarchy vào thư mục Assets/Models/Tombstones trong cửa sổ Project để tạo
thành 1 Prefab mới. Đổi tên Prefab này thành ZombieSpawnerTomb để tránh nhầm
lẫn sau này.
● Đối với nút đặt nấm mồ, ta chỉ việc duplicate PlaceGroundButton (bấm chuột phải
chọn Duplicate), sửa tên thành PlaceTombButton và sửa Text thành “Place Tomb”
là xong. Lưu ý là nút PlaceTombButton vẫn phải nằm trong Canvas ở trong cửa sổ
Hierarchy. Sau đó ta tạm thời ẩn nút này đi bằng cách bỏ tích ở ô bên trái ngay cạnh
tên PlaceTombButton trong cửa sổ Inspector.
● Chúng ta sẽ tiến hành tạo tiếp nút bắt đầu game. Duplicate PlaceGroundButton, sửa
tên thành StartGameButton.
○ Trong thuộc tính Rect Transform:
■ Chọn Anchor Presets là middle center.
■ Pos X: 0, Pos Y: 0, Pos Z: 0.
■ Width: 600, Height: 200.
■ Pivot: X: 0.5, Y: 0.
○ Trong thuộc tính Image (Script), chọn Source Image là SF Window.
● Trong cửa sổ Hierarchy, bấm vào mũi tên mở rộng StartGameButton, lúc này bấm
chọn vào thành phần Text trong đó. Trong cửa sổ Inspector, sửa lại thuộc tính Text
(Script) như sau:
○ Text: Start Game
○ Paragraph > Min Size: 10
○ Paragraph > Max Size: 100
● Kết quả cần đạt được của nút StartGameButton (nút bắt đầu game) như ở hình dưới
(nằm ở chính giữa màn hình). Sau đó chúng ta cũng tạm thời ẩn nút này đi, chỉ để lại
nút đặt nền đất.
24
3. Tạo bù nhìn (dummy) để kiểm tra tương quan trong không gian ba chiều
● Chúng ta sẽ tạo bù nhìn từ chính Prefab FemaleZombie. Trước hết ở cửa sổ
Inspector, ta sẽ sửa lại kích cỡ của FemaleZombie trong thuộc tính Transform
thành Scale(0.8, 0.8, 0.8).
● Để ý rằng trong cửa sổ Project, khi bấm chuột phải vào
Assets/Models/ZombieModels/ZombieGirl/Prefabs/FemaleZombie thì sẽ không
thấy tùy chọn “Copy” hay “Duplicate”. Để tạo 1 Prefab giống hệt vậy thì tạm thời
đành phải kéo Prefab FemaleZombie trong cửa sổ Project vào trong cửa sổ
Hierarchy, rồi lại kéo ngược lại vào folder
Assets/Models/ZombieModels/ZombieGirl/Prefabs trong cửa sổ Project (chọn
“Original Prefab”).
● Sửa tên Prefab FemaleZombie 1 thành Dummy.
● Trong cửa sổ Inspector của Prefab Dummy, xóa các thuộc tính Animator,
Rigidbody, Box Collider, Audio Source và Zombie Controller (Script) đi (bấm
chuột phải vào thuộc tính và chọn Remove Component).
4. Sử dụng ARCore để xác định vị trí nền đất trong thế giới thực
● Trong cửa sổ Project, tìm đến file
Assets/GoogleARCore/Examples/HelloAR/Scripts/HelloARController và đổi tên
thành GameInitController.
● Mở file GameInitController.cs ra, đổi tên class từ HelloARController thành
GameInitController. Thêm mới các thuộc tính sau đây vào class
GameInitController:
25
private bool isDummyInitialized;
private bool isGroundPlaced;
private bool hasGameStarted;
private int numOfTombsPlaced = 0;
...
}
26
1. Mục đích dùng ARCore là để xác định vị trí nền đất trên thực tế. Thay vì đặt
các con Android (AndyPrefab) lên mặt đất như ở phần 1 thì ta sẽ đặt Dummy
rồi sau đó quan sát vị trí của con Dummy này xem vị trí mặt đất xác định bởi
ARCore đã tốt chưa (Dummy không bị nghiêng ngả, chân phải đứng sát mặt
đất) ⇒ Sửa code trong GameInitController để có thể đặt Dummy thay cho
AndyPrefab.
2. Sau khi dùng Dummy để “ướm thử” vị trí mặt đất xác định bởi ARCore thì
khi bấm nút “Place Ground” ta sẽ thay InfiniteGround vào vị trí của
Dummy. InfiniteGround sẽ đóng vai trò làm “nền đất ảo” để các vật thể
trong game không bị rơi tự do. Sau khi hoàn thành xong bước này thì cần phải
xóa các “lưới” do ARCore sinh ra để không vướng mắt trong khi chơi (tắt
chức năng Plane Detection của ARCore đi - google cụm từ khóa “How to stop
Plane Detection in ARCore” sẽ tìm được đáp án) ⇒ Sửa code trong
GameInitController để khi bấm nút “Place Ground” thì sẽ đặt
InfiniteGround vào vị trí của Dummy, sau đó ẩn nút này đi.
3. Sau khi bấm nút “Place Ground” để đặt InfiniteGround xong, nút này được
ẩn đi thì sau đó hiển thị nút “Place Tomb” (đặt nấm mộ). Sau đó việc còn lại
chỉ là đặt nấm mộ mỗi khi bấm nút “Place Tomb” tại đúng vị trí camera hiện
tại (vị trí người chơi đang đứng). ⇒ Sửa code trong GameInitController để
hiển thị nút “Place Tomb” và khi bấm nút “Place Tomb” sẽ lấy vị trí hiện tại
của camera và 1 đặt nấm mộ ZombieSpawnerTomb tại đó.
4. Sau khi đặt một số lượng nấm mộ vừa ý thì sẽ bấm “Start Game” để bắt đầu
trò chơi. ⇒ Sửa code sao cho ZombieSpawnerTomb chỉ hoạt động khi bấm
nút “Start Game”.
27
PHẦN 6. THIẾT LẬP GAMEPLAY VÀ KHẢ NĂNG
BẮN ZOMBIES
28
PHẦN 7. HOÀN THIỆN GAMEPLAY VÀ CÁC THÔNG
TIN HIỂN THỊ 2D CỦA TRÒ CHƠI
29