Learning Construct 2 - Chương 6 - Phần 3

Bài 3. Chèn dữ liệu vào từ điển

1. Chèn dữ liệu vào từ điển

Bây giờ, hãy thử làm điều tương tự với một từ điển. Đầu tiên, ta sẽ thêm một đối tượng từ điển vào trò chơi của chúng ta. Giống như mảng, từ điển được thêm vào tổng thể project. Thêm một đối tượng từ điển mới vào project của chúng ta và gọi nó là scoreDictionary.

Thường thì trong một trò chơi, bạn sẽ sử dụng cả mảng và từ điển, hoặc ko dùng cả 2, nhưng chúng ta đã có một sự kiện ở đây sử dụng mảng. Chúng ta có thể xóa nó trước khi ta thêm những đoạn mã khi sử dụng từ điển, nhưng ở đây, tôi sẽ chỉ cho bạn cách vô hiệu hóa đoạn mã. Đầu tiên, lựa chọn đoạn mã bạn muốn vô hiệu hóa; với chúng ta là đoạn mã mà playerShip bị tiêu diệt, và chúng ta sẽ thiết lập giá trị cho mảng. Sau đó, bấm nút D, sự kiện và hành động sẽ bị vô hiệu hóa, hoặc bạn có thể bấm chuột phải và lựa chọn Toggle Disabled. Vô hiệu hóa sự kiện và hành động được đánh dấu bằng gạch qua văn bản của nó, được hiện lên như hình sau:

Có nhiều cách để vô hiệu hóa một sự kiện: bạn có thể nhấn và giữ nút D; bạn có thể vô hiệu hóa nhiều sự kiện một lần bằng cách chọn các sự kiện đó và nhấn nút D; bạn có thể vô hiệu hóa hành động mà không cần vô hiệu hóa sự kiện; lựa chọn một sự kiện hoặc hành động bị vô hiệu hóa rồi nhần nút D sẽ loại bỏ trạng thái vô hiệu hóa.

Bây giờ, hãy thêm mã của chúng ta để thêm thành viên mới vào từ điển. Khi thêm một thành viên mới vào từ điển, chúng ta sẽ định nghĩa khóa.

2. Khôi phục giá trị trong một mảng và từ điển

Chúng ta đã biết cách lưu trữ dữ liệu tới mảng và từ điển, nhưng có gì hay khi ta lại ko biết khôi phục nó? Tôi sẽ cho bạn thấy làm thế nào đối với 2 đối tượng. Trước tiên, chúng ta sẽ tạo một chỗ cho họ trên màn hình. Hãy tạo 2 đối tượng văn bản: một được gọi là arrayScoreText, và cái còn lại là dictionaryScoreText, đặt chúng vào phía trái bên trên màn hình như sau:

Sau đó, ở event sheet, chúng ta sẽ thêm hành động để trình giá trị của chúng trong đối tượng văn bản. Về điều này, chúng ta sẽ sử dụng 2 sự kiện On player destroyed: một để khôi phục giá trị mảng và còn lại để khôi phục giá trị từ điển. Để khôi phục giá trị mảng, chúng ta sẽ sử dụng một biểu thức cho chúng ta giá trị thành viên của mảng, dựa trên số mục lục mà ta cung cấp cho nó. Biểu thức này được gọi là At (), chúng ta sẽ cung cấp số mục lục trong dấu ngoặc đơn. Chúng ta sẽ thêm giá trị chúng ta nhận được từ nó tới đối tượng văn bản:

Tiếp theo, chúng ta sẽ khôi phục giá trị từ điển. Để làm vậy, chúng ta cần sự trợ giúp từ một biểu thức, nhưng thay vì một số mục lục, biểu thức cần khóa của giá trị mà ta cần khôi phục. Ta sẽ thêm giá trị trả về tới đối tượng văn bản:

Test game bây giờ, và bạn sẽ thấy trò chơi hiện điểm sau khi người chơi bị tiêu diệt.

Bài 4. Lưu trữ dữ liệu trong máy của người chơi

Chúng ta đã biết cách lưu trữ dữ liệu trong mảng và từ điển và cách hiển thị chúng trên màn hình, thật tuyệt! Tuy nhiên, có một điều cần nhớ khi làm việc với mảng và từ điển: chúng sẽ mất giá trị của chúng khi trò chơi bị đóng. Người chơi đóng cửa sổ trình duyệt web. Bất cứ khi nào họ làm điều này, trò chơi sẽ ko nhớ được giá trị mà bạn đưa vào mảng hay từ điển.

Trong hầu hết các trường hợp đây là điều mà chúng ta ko muốn. Nếu bạn muốn giữ lại điểm số và so sánh chúng để tạo bảng xếp hạng, bạn cần game phải nhớ ngay cả khi đã bị đóng. Để làm điều này, ta cần lưu trữ dữ liệu tỏng máy của người chơi. Chính vì vậy, khi ta bắt đầu trò chơi lần tiếp theo, trò chơi vẫn nhớ điểm số của người chơi. Chúng ta làm điều này như thế nào? Sử dụng đối tượng WebStorage.

Đối tượng WebStorage ko lưu trữ đối tượng trực tuyến như cái tên của nó. Nó lưu trữ dữ liệu trong máy của người chơi. Nó cũng làm việc khi tạo một game offline với node-webkit và gói mobile như CocoonJS (tôi sẽ giải thích thêm khi chúng ta xuất game).

WebStorage ko lưu trữ dữ liệu trong cache trình duyệt, chính vì vậy nếu người chơi xóa cache trình duyệt, dữ liệu sẽ ko mất. Tuy nhiên, dữ liệu WebStorage sẽ mất nếu họ xóa cookies hoặc dữ liệu web ngoại tuyến. Tuy nhiên, ở những nền tảng ko là trình duyệt web với thanh địa chỉ (Window 8 app), sẽ ko có cách nào để người chơi xóa dữ liệu WebStorage.

Hãy nhớ rằng đối tượng WebStorage kết nối dữ liệu với miền. Ví dụ, tất cả trò chơi được lưu trữ trên myGamesSite.com chia sẻ cùng dữ liệu, nhưng game trên facebook.com có dữ liệu khác nhau và ko thể truy cập dữ liệu từ myGamesSite.com.

Có 2 nơi đối tượng WebStorage lưu trữ dữ liệu:

Local storage: vĩnh viễn, dữ liệu ko mất cho đến khi người chơi xóa cache.
Session storage: kéo dài đến phiên trình duyệt hiện tại; nếu phiên này kết thúc, dữ liệu sẽ bị xóa

WAITING FOR LUV

Bạn có muốn cải thiện khả năng thiết kế đồ họa của mình? Chắc hẳn các bạn cũng biết, nếu các dòng code là linh hồn của một trò chơi, thì đồ họa chính là bộ mặt của trò chơi đó. Đồ họa đẹp, dễ nhìn sẽ khiến trò chơi của bạn tăng tỉ lệ hấp dẫn người xem đến 90%. Hiện tại có hai công cụ hỗ trợ thiết kế đồ họa game tiện nhất mà mình biết, đó là Photoshop và Illustrator. Mình sẽ cố gắng tìm kiếm và chia sẻ các đồ họa game miễn phí cho các bạn tại blog này; tuy nhiên, một trò chơi mà 100% do chính mình tạo ra vẫn hơn là đi cóp nhặt hình ảnh từ nơi khác đúng không nào. Tiện đây, mình có chia sẻ một khóa học thiết kế đồ họa Game 2D cho Mobile. Các bạn có thể tham khảo dưới đây để được giảm 40% học phí nhé.

Có, mình muốn đăng kí

1. Sử dụng WebStorage để lưu trữ dữ liệu

Bây giờ, hãy sử dụng đối tượng WebStorage để lưu trữ dữ liệu của ta. Chèn WebStorage vào project của bạn; chúng ta sẽ thêm giá trị scores vào WebStorage khi người chơi bị tiêu diệt, giống như mảng và từ điển. Chính vì vậy, đầu tiên vô hiệu hoá 2 sự kiện mà thêm giá trị mới vào đối tượng mảng và từ điển, chúng ta sẽ tạo sự kiện playerShip on destroyed mới để chèn dữ liệu mới vào WebStorage. Cách để thêm giá trị mới vào WebStorage giống như cách chúng ta thêm vào từ điển, nơi nó kết nối khóa tới giá trị, chính vì vậy, tạo khóa playerScore để lưu trữ điểm như sau:

Cái này khá đơn giản, nhưng để thêm một bảng xếp hạng, chúng ta không chỉ cần trình điểm số từ lần chơi gần nhất, mà còn từ trước đó nữa. Chúng ta sẽ trình bày tất cả dữ liệu này tới người chơi bởi làm bảng xếp hạng. Ví dụ, nếu chúng ta có 5 phiên game, chúng ta muốn dữ liệu ở WebStorage như thế này:

“ playerScore1 “: 50

“ playerScore2 “: 100

“ playerScore3 “: 70

“ playerScore4 “: 20

“ playerScore5 “: 60

Người chơi có thể chơi nhiều hơn 5 phiên, và chúng ta muốn code của chúng ta có thể xử lí tình huống này. Nếu chúng ta sử dụng code trước, giá trị khóa playerScore của đối tượng WebStorage sẽ thay đổi mỗi lần người chơi chết, bởi vì lưu trữ giá trị khác tới khóa đã tồn tại sẽ chép đè lên nó. Vì vậy, ta nên làm gì?

Đầu tiên ta sẽ tạo một khóa mới trên đối tượng WebStorage, hãy gọi nó là gameSession để làm rõ ràng khóa này ghi lại số lần trò chơi được chơi. Chúng ta sẽ tạo nó mỗi lần trò chơi bắt đầu. Đây là điều đặc biệt khi chúng ta tạo khóa này; chúng ta chỉ tạo nó nếu nó không được tạo sớm hơn. Bằng cách này chúng ta sẽ không ghi đè giá trị cuối cùng của khóa gameSession. Chúng ta làm điều này bằng cách sử dụng khóa tồn tại hành động của đối tượng WebStorage và sau đó đảo ngược điều kiện.

Sau đó, chúng ta hãy tạo ra một biến toàn cầu để thêm số gameSession tới khóa khi chúng ta lưu trữ giá trị tới WebStorage. Chúng ta sẽ gọi biến này là sesionNumber và biến nó thành một chuỗi. Tại sao lại là một chuỗi; giá trị được lưu trữ trong khóa gameSession không phải là 1 số? Vâng, đó là bởi vì ko giống như từ điển nơi bạn có thể khôi phục văn bản hoặc số, tất cả giá trị bạn khôi phục từ WebStorage đều là văn bản.

Bạn có thể thay đổi loại giá trị văn bản sang số bằng cách sử dụng một biểu thức hệ thống, int (). Biểu thức int () dành cho số nguyên, một loại dữ liệu tròn số trong ngôn ngữ lập trình truyền thống.

Bây giờ, chúng ta đã có những gì chúng ta cần để làm cho mã của chúng ta nhớ một số phiên trò chơi, vì vậy hãy làm nó thôi nào. Tuy nhiên, đầu tiên, xóa hành động khi chúng ta thiết lập khóa địa phương playerScore tới đối tượng WebStorage của chúng ta, bởi vì chúng ta sẽ thay thế cái này bằng một thiết lập đoạn mã khác. Khi người chơi bị tiêu diệt, chúng ta muốn khôi phục khóa gameSession và lưu trữ giá trị ở biến toàn cầu sessionNumber của ta. Chúng ta có thể khôi phục dữ liệu bằng cách sử dụng biểu thức localValue () và chuyển khóa tới nó:

Sau đó, chúng ta sẽ tăng giá trị gameSession bằng 1 và lưu trữ nó về với WebStorage để chúng ta có thể lưu trữ điểm cho phiên trò chơi sắp tới. Chúng ta sẽ làm điều này bởi thay đổi các biến sessionNumber thành một số, tăng nó lên 1 và lưu trữ nó tới WebStorage.

Code trước đó không thay đổi giá trị của biến sessionNumber; chúng ta chỉ sử dụng giá trị của nó để thay đổi khóa gameSesion. Bây giờ, chúng ta sẽ lưu số điểm tới WebStorage sử dụng khóa với biến sessionNumber được thêm vào cuối cùng.

2. Tạo bảng xếp hạng

Trò chơi bây giờ đã lưu trữ các điểm khác nhau cho các phiên trò chơi khác nhau, và điều đó thật tuyệt vời. Những gì còn lại bây giờ là hiển thị chúng trong một bảng thành tích. Vì vậy bây giờ, tạo ra một layout mới nơi chúng ta tạo bảng xếp hạng và cung cấp cho nó hình nền giống như layout đầu tiên. Chúng ta sẽ thêm 2 đối tượng văn bản mà chúng ta sẽ sử dụng cho bảng thành tích trên layout này; đặt tên chúng là highscoreNameText và highscoreText để trình khóa và điểm tương ứng trong bảng thành tích.

Khi bắt đầu layout, chúng ta sẽ nhìn thấy đối tượng WebStorage và nhìn xem có bao nhiêu phần tử mà nó có. Đối với mỗi phần tử, chúng ta sẽ tạo các đối tượng văn bản mới để hiện thị khóa và điểm số trên màn hình. Ở đây chúng tôi đang sử dụng khái niệm khác trong lập trình mà tôi chưa giải thích: loop.

3. Tìm hiểu về sự lặp lại

Lặp lại là gì? Tôi đã giải thích trong chương 1 rằng code trong C2 như trong bất kì ngôn ngữ khác, được thực hiện từ đầu đến cuối. Vì vậy, code trong C2 chạy từ sự kiện đầu tiên đến sự kiện cuối cùng mà ko dừng lại, nghĩa là trừ khi nó gặp một vòng lặp.

Một vòng lặp là một khối mã luôn được thực hiện miễn là các điều kiện của nó vẫn đúng. Vào cuối một vòng lặp, chương trình sẽ kiểm tra xem điều kiện có được đáp ứng hay ko. Nếu ko, việc thực hiện bắt đầu lại từ đầu vòng lặp và thực hiện tiếp tục đến mã tiếp theo.

Tôi chắc chắn rằng cái này sẽ dễ hiểu hơn khi đưa vào thực hành. Chúng ta sẽ làm điều này bằng một kiểu vòng lặp: vòng lặp for. Vòng lặp for là vòng lặp tiếp tục cho một số thời gian nhất định; điều này được xác định bởi chỉ số đầu và kết của nó. Những gì chúng ta muốn làm là vòng lặp cho tổng số thành viên của đối tượng WebStorage của chúng ta, và sau đó, chúng ta sẽ tạo 2 văn bản để hiện thị bảng xếp hạng. Một vòng lặp for được sử dụng khi chúng ta biết chính xác bao nhiêu lần để lặp; trong trường hợp này, chúng ta đang lặp lại cho tổng số thành viên đối tượng WebStorage của chúng ta.

Sử dụng vòng lặp trong bảng thành tích . có 3 điều chúng ta cần cho vòng lặp:

Tên của vòng lặp: được sử dụng để xác định vòng lặp trong trường hợp có nhiều hơn một vòng lặp trong code của bạn. Nó có thể là một văn bản rỗng.
Chỉ số bắt đầu: đây là chỉ số khởi đầu của vòng lặp.
Chỉ số cuối: đây là chỉ số kết thúc của vòng lặp.

Vòng lặp for sẽ tăng chỉ số vòng lặp lên 1 vào cuối vòng lặp và sau đó bắt đầu lại mã từ đầu. Vòng lặp sẽ dừng cho đến khi đạt chỉ số kết thúc.

Chúng ta sẽ sử dụng 2 biểu thức WebStorage trong vòng lặp này: localAt và localKeyAt. Biểu thức localAt được sử dụng để khôi phục giá trị tại một mục. Chúng ta có thể khôi phục giá trị được lưu trữ ở WebStorage theo mục lục hoặc khóa. Giống như mảng, WebStorage dựa trên chỉ số 0, vì vậy thành viên đầu tiên là 0, thành viên thứ 2 là 1, vân vân. Biểu thức localKeyAt cho chúng ta chìa khóa tại mục lục nhất định.

Có hai cách để lấy giá trị từ WebStorage: bởi vị trí mục lục sử dụng biểu thức localKeyAt hoặc bởi khóa của nó sử dụng biểu thức localValue.

Hãy nhớ rằng ở đầu Layout 1, chúng ta đã tạo một khóa được gọi là gameSession ở đối tượng WebStorage. Khóa này sẽ ở mục lục 0, và thiết lập playerScore của các khóa sẽ ở mục lục 1,2,3 vân vân. Chính vì vậy, vòng lặp for sẽ lặp lại từ mục lục 1 cho đến hết của WebStorage.

Để xác định kết thúc của WebStorage, chúng ta sẽ đếm số khóa địa phương được lưu trữ trong WebStorage và giảm nó đi 1. Tại sao chúng ta lại giảm nó? Tại vì WebStorage là mục lục dựa trên 0, nhưng nếu chúng ta tính nó, chúng ta sẽ nhận được tổng số khóa địa phương đã lưu trữ, mà ko dựa trên 0. chúng ta sẽ đặt tên vòng lặp là leaderboard và sử dụng code như sau với nó:

Sau đó chúng ta sẽ tạo 2 chuỗi văn bản và đặt chúng vào những nơi thích hợp. Chúng ta muốn tọa độ y của chuỗi văn bản tăng mỗi lần chỉ số lặp tăng để tọa độ đó của văn bản mới nằm ở vị trí cuối cùng. Sau đó, chúng ta sẽ thay đổi giá trị của chuỗi văn bản. Một cái để trình bày khóa; chúng ta sẽ làm điều này bởi sử dụng biểu thức WebStorage, localKeyAt, và chúng ta sẽ cung cấp chỉ số vòng lặp để nhận khóa tại một mục lục. Văn bản còn lại là để hiện điểm số; chúng ta sẽ làm điều này với biểu thức localAt, cho chúng ta giá trị đã lưu trữ trong 1 mục.

Chúng ta đã sẵn sàng để test leaderboard, nhưng trước tiên, chúng ta phải khiến trò chơi chuyển sang layout 2 khi người chơi chết. Vì vậy, hãy trở lại event sheet trong layout 1 và thêm 2 hành động nữa. Cái thứ nhất là đợi 1 giây trước khi chuyển layout, cái thứ 2 là thay đổi layout.

Test game bây giờ, hãy chắc chắn là bạn test từ layout 1 chứ ko phải layout 2. Sau khi con tàu bị phá hủy, trò chơi sẽ đưa bạn đến layout thứ 2 nơi bạn có thể nhìn thấy bảng thành tích như dưới đây:

Chúc mừng, bạn đã hoàn thành xong một bảng thành tích cơ bản. Các game khác sử dụng bảng thành tích cũng tương tự thế này nhưng sử dụng lưu trữ trực tuyến thay vì dữ liệu địa phương như chúng ta.

Tổng kết

Bạn đã được học rất nhiều điều khác nhau trong chương này, từ việc thay đổi kích thước của cửa sổ trò chơi và cách bố trí để sử dụng một điểm ảnh để sinh ra một đối tượng mới có liên quan đến đối tượng đang tồn tại. Sau đó bạn đã được học về các đối tượng khác nhau để lưu trữ: Array (mảng), Dictionary (từ điển) và WebStorage. Bạn cũng đã được học cách lưu trữ dữ liệu vào mảng và từ điển.

Sau đó bạn đã được hướng dẫn chi tiết hơn về sự khác nhau giữa mảng và từ điển cũng như lúc nào nên sử dụng một trong hai cái này. Một điều nhỏ nhưng vô cùng hữu ích mà bạn được học đó là cách vô hiệu hóa và kích hoạt lại các sự kiện. Sáu đó, chúng ta tìm ra cách mà chúng a có thể lưu trữ dữ liệu trên máy tính của người chơi thay vì chỉ lưu trữ trong trò chơi. Cuối cùng, chúng ta tìm ra khái niệm vòng lặp, thứ mà ta có thể sử dụng để tạo bảng xếp hạng.

Đó là những thứ được đề cập trong chương này, tôi hy vọng bạn có thể nắm được nó. Bạn đã được hướng dẫn rất nhiều về C2, nhưng vẫn còn một công cụ nữa bạn nên biết: một kẻ địch thông minh. Trong chương kế tiếp, ta sẽ tạo ra những kẻ địch có thể tìm ra vị trí của người chơi và hành động phù hợp.

Bản dịch do construct2vn.ga thực hiện
Ai sao chép hay chia sẻ hãy ghi nguồn và đưa link www.construct2vn.ga vào đầu bài chia sẻ nhé

Construct 2 Community VN

Learning Construct 2 - Chương 6 - Phần 3

Bài đăng phổ biến

DONATE TINH THẦN CHO BLOG TẠI ĐÂY

Gửi thư cho mình nhé

ĐỊA CHỈ

EMAIL

TELEPHONE

MOBILE