Công cụ cho nhà phát triển Blockly là một công cụ dành cho nhà phát triển dựa trên web, có thể giúp bạn tạo các khối tuỳ chỉnh và đưa chúng vào ứng dụng của mình.
Xác định một khối
Không gian làm việc Block Factory sẽ bắt đầu bằng một khối cấu hình trống. Bạn có thể thêm đầu vào và trường vào khối bằng cách kéo các khối từ các danh mục tương ứng trong hộp công cụ. Bạn cũng có thể đặt văn bản chú thích, URL trợ giúp, màu sắc và(các) chế độ kiểm tra kết nối cho khối bằng cách sửa đổi khối cấu hình.
Block Factory chỉ có thể tạo một loại khối tại một thời điểm. Nếu muốn thiết kế một số khối được kết nối với nhau, bạn sẽ phải thiết kế các khối riêng biệt và kết nối chúng trong định nghĩa hộp công cụ. Ngoài ra, các khối có thể có các tính năng nâng cao như mutator, nhưng bạn không thể tạo các tính năng nâng cao này trong Nhà máy. Bạn sẽ phải sửa đổi định nghĩa khối theo tài liệu sau khi đã tạo biểu mẫu cơ bản của khối.
Khi bạn sửa đổi khối cấu hình trong không gian làm việc, bản xem trước của khối sẽ tự động cập nhật. Mã mà bạn cần thêm vào ứng dụng cũng sẽ tự động cập nhật.
Cấu hình đầu ra
Blockly hỗ trợ nhiều phương thức xác định các khối và tải chính Blockly, cũng như có nhiều ngôn ngữ trình tạo mã tích hợp. Cách bạn xác định các khối và trình tạo mã khối phụ thuộc vào những yếu tố này, vì vậy, bạn có thể đặt các khối và trình tạo mã khối trong Block Factory để thay đổi đầu ra mã.
Định dạng nhập Blockly
Bạn có thể tải Blockly thông qua thẻ <script>
trong HTML hoặc sử dụng câu lệnh import
nếu dùng một công cụ tạo với ứng dụng của mình. Lựa chọn này ảnh hưởng đến cách bạn tham chiếu một số phần của API Blockly. Để biết thêm thông tin về lựa chọn nào, hãy xem tài liệu về tải Blockly.
Dù bạn sử dụng phương thức nào, hãy nhớ chọn lựa chọn tương ứng trong Block Factory để mã mà bạn sẽ thêm vào ứng dụng của mình là chính xác cho ứng dụng của bạn.
Định dạng định nghĩa khối
Blockly hỗ trợ việc xác định các khối trong JSON hoặc JavaScript. Bạn nên dùng định dạng JSON, nhưng nếu sẽ thêm các tính năng nâng cao như mutator, bạn có thể dùng định dạng JavaScript.
Ngôn ngữ của trình tạo mã
Blockly đi kèm với nhiều ngôn ngữ của trình tạo mã. Chọn(các) ngôn ngữ mà ứng dụng của bạn cần để hiển thị phần giữ chỗ trình tạo mã khối tương ứng. Nếu sử dụng trình tạo ngôn ngữ tuỳ chỉnh, bạn có thể sửa đổi tên của lớp CodeGenerator
tuỳ chỉnh sau khi sao chép mã vào ứng dụng.
Kết quả chạy mã
Các phần tiếp theo của Block Factory sẽ cho bạn thấy mã mà bạn cần sao chép vào ứng dụng của mình để tải khối mà bạn đã tạo. Vị trí bạn sao chép mã sẽ tuỳ thuộc vào cách bạn đã cấu trúc ứng dụng của mình, nhưng nói chung, bạn sẽ cần chạy tiêu đề mã trước định nghĩa và trình tạo mã khối, các định nghĩa khối trước khi bạn cố gắng sử dụng chúng trong hộp công cụ và trình tạo mã khối trước khi bạn cố gắng tạo mã cho một không gian làm việc. Đối với mỗi phần, bạn có thể dùng nút sao chép để sao chép toàn bộ khối mã cho phần đó.
Nếu vẫn chưa biết cách sử dụng đầu ra mã, bạn có thể quan tâm đến ứng dụng mẫu có các ví dụ về khối tuỳ chỉnh và trình tạo mã khối.
Tiêu đề mã
Phần Tiêu đề mã cho thấy mã bạn cần để tải thư viện Blockly cốt lõi và trình tạo ngôn ngữ mà bạn đã chọn. Cũng có thể có những cấu hình khác ở đây; ví dụ: một số trường bạn có thể đưa vào một khối là từ các trình bổ trợ Blockly. Các trình bổ trợ này sẽ có câu lệnh nhập riêng và có thể có mã khác mà bạn phải chạy để khởi động trường. Bạn nên thêm mã này trước bất kỳ phần mã nào sau đây.
Định nghĩa về khối
Định nghĩa khối là cách bạn cho Blockly biết hình dạng của khối, chẳng hạn như khối có những trường và đầu vào nào, màu sắc và nhiều thông tin khác. Sau khi bạn chạy mã này, Blockly sẽ biết cách tạo một khối chỉ dựa trên type
của khối đó.
Nếu đang dùng ứng dụng mẫu, bạn có thể đưa mã này vào một tệp trong thư mục blocks/
. Nếu bạn có cấu trúc ứng dụng riêng, hãy nhớ thêm mã này trước khi bạn cố gắng tham chiếu một khối theo tên, chẳng hạn như trong định nghĩa hộp công cụ. Dù bằng cách nào, hãy đảm bảo rằng tiêu đề mã có trong tệp mà bạn thêm mã này.
Stub trình tạo
Trình tạo mã khối là cách bạn mô tả mã cần được tạo cho một khối. Phần giữ chỗ trình tạo do Block Factory tạo sẽ cung cấp cho bạn mã cơ bản để lấy giá trị của các đầu vào và trường có trên khối của bạn. Bạn có thể kết hợp các giá trị này thành mã cuối cùng sẽ được tạo!
Nếu đang dùng ứng dụng mẫu, bạn có thể đưa mã này vào một tệp trong thư mục generators/
. Nếu bạn có cấu trúc ứng dụng riêng, hãy nhớ thêm mã này trước khi bạn cố gắng tạo mã cho một không gian làm việc có chứa các khối tuỳ chỉnh của bạn. Dù bằng cách nào, hãy đảm bảo rằng tiêu đề mã có trong tệp mà bạn đưa mã này vào.
Video hướng dẫn từng bước
Video này hướng dẫn chi tiết các bước xác định một khối. Giao diện người dùng đã lỗi thời, nhưng các tính năng chặn mà giao diện này làm nổi bật vẫn ít nhiều chính xác.
Thư viện khối
Các khối sẽ tự động được lưu vào bộ nhớ cục bộ của trình duyệt bất cứ khi nào bạn thực hiện thay đổi đối với khối. Bạn có thể tạo một khối mới hoặc tải một khối hiện có từ bộ nhớ cục bộ bằng cách nhấp vào các nút tương ứng trên thanh công cụ ở trên cùng.
Nhập từ Block Factory cũ
Nếu đã sử dụng Block Factory cũ và muốn di chuyển các định nghĩa khối hiện có vào công cụ mới, bạn có thể làm theo các bước sau:
Trong Block Factory cũ, hãy nhấp vào nút
Export Block Library
trên thanh công cụ. Thao tác này sẽ tải một tệp xuống chứa tất cả các định nghĩa khối của bạn.Trong Block Factory mới, hãy nhấp vào nút "Load block" (Tải khối) trên thanh công cụ.
Chọn mục "Nhập từ Block Factory" trong trình đơn.
Tải tệp bạn đã tải xuống ở Bước 1 lên.
Định nghĩa khối của bạn sẽ tự động chuyển đổi sang định dạng mới và giờ sẽ có trong trình đơn
Load block
. Các khối có thể đã được đổi tên nếu xung đột với các khối hiện có.Nếu có lỗi khi phân tích cú pháp bất kỳ khối nào, chúng tôi sẽ không thể tải các khối đó. Bạn có thể giúp chúng tôi bằng cách báo cáo lỗi đối với blockly-samples và thêm tệp không phân tích cú pháp được.